From c5eb84d7e8eb1cd1d05d37e98c7118d8d5c6d6ff Mon Sep 17 00:00:00 2001 From: Aman Harwara Date: Wed, 2 Mar 2022 23:33:46 +0530 Subject: [PATCH] feat: add toast notifications using stylekit (#905) --- .../components/ApplicationView.tsx | 3 + app/assets/javascripts/typings/stylekit.d.ts | 1 - app/assets/stylesheets/_sn.scss | 36 ----- app/assets/stylesheets/_ui.scss | 4 - package.json | 2 +- yarn.lock | 126 +++++------------- 6 files changed, 41 insertions(+), 131 deletions(-) delete mode 100644 app/assets/javascripts/typings/stylekit.d.ts diff --git a/app/assets/javascripts/components/ApplicationView.tsx b/app/assets/javascripts/components/ApplicationView.tsx index 7ba447673aa..71b467ed3ff 100644 --- a/app/assets/javascripts/components/ApplicationView.tsx +++ b/app/assets/javascripts/components/ApplicationView.tsx @@ -27,6 +27,7 @@ import { RevisionHistoryModalWrapper } from './RevisionHistoryModal/RevisionHist import { PremiumModalProvider } from './Premium'; import { ConfirmSignoutContainer } from './ConfirmSignoutModal'; import { TagsContextMenu } from './Tags/TagContextMenu'; +import { ToastContainer } from '@standardnotes/stylekit'; type Props = { application: WebApplication; @@ -283,6 +284,8 @@ export class ApplicationView extends PureComponent { appState={this.appState} application={this.application} /> + + )} diff --git a/app/assets/javascripts/typings/stylekit.d.ts b/app/assets/javascripts/typings/stylekit.d.ts deleted file mode 100644 index 44b004f9353..00000000000 --- a/app/assets/javascripts/typings/stylekit.d.ts +++ /dev/null @@ -1 +0,0 @@ -declare module '@standardnotes/stylekit'; diff --git a/app/assets/stylesheets/_sn.scss b/app/assets/stylesheets/_sn.scss index 29094ef7007..4c2fc3caad3 100644 --- a/app/assets/stylesheets/_sn.scss +++ b/app/assets/stylesheets/_sn.scss @@ -32,22 +32,6 @@ text-decoration: underline; } -.sn-icon { - @extend .h-5; - @extend .w-5; - @extend .fill-current; - - &.sn-icon--small { - @extend .h-3\.5; - @extend .w-3\.5; - } - - &.sn-icon--mid { - @extend .w-4; - @extend .h-4; - } -} - .sn-dropdown { @extend .bg-default; @extend .rounded; @@ -257,9 +241,6 @@ .ml-3 { margin-left: 0.75rem; } -.ml-4 { - margin-left: 1rem; -} .mr-2\.5 { margin-right: 0.625rem; @@ -583,10 +564,6 @@ padding-bottom: 2.25rem; } -.select-none { - user-select: none; -} - .placeholder-dark-red::placeholder { @extend .color-dark-red; } @@ -719,11 +696,6 @@ background: var(--sn-stylekit-grey-4); } -.sn-component .spinner-info { - border-color: var(--sn-stylekit-info-color); - border-right-color: transparent; -} - @keyframes slide-up { 0% { opacity: 1; @@ -907,10 +879,6 @@ } } -.flex-shrink-0 { - flex-shrink: 0; -} - .leading-140\% { line-height: 140%; } @@ -921,10 +889,6 @@ pointer-events: none; } -.flex-shrink-0 { - flex-shrink: 0; -} - .last\:hidden:last-child { display: none; } diff --git a/app/assets/stylesheets/_ui.scss b/app/assets/stylesheets/_ui.scss index c2e8fab5918..155cc39fb88 100644 --- a/app/assets/stylesheets/_ui.scss +++ b/app/assets/stylesheets/_ui.scss @@ -210,10 +210,6 @@ $screen-md-max: ($screen-lg-min - 1) !default; pointer-events: none; } -.fill-current { - fill: currentColor; -} - .font-editor { font-family: var(--sn-stylekit-editor-font-family); } diff --git a/package.json b/package.json index 7d68cd75d4a..067e82e7701 100644 --- a/package.json +++ b/package.json @@ -57,7 +57,7 @@ "pretty-quick": "^3.1.3", "sass-loader": "^12.6.0", "serve-static": "^1.14.2", - "@standardnotes/stylekit": "5.10.0", + "@standardnotes/stylekit": "5.12.2", "svg-jest": "^1.0.1", "ts-jest": "^27.1.3", "ts-loader": "^9.2.6", diff --git a/yarn.lock b/yarn.lock index 60861a5bbec..f0c49f25a3e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2052,6 +2052,11 @@ "@jridgewell/resolve-uri" "^3.0.3" "@jridgewell/sourcemap-codec" "^1.4.10" +"@nanostores/preact@^0.1.3": + version "0.1.3" + resolved "https://registry.yarnpkg.com/@nanostores/preact/-/preact-0.1.3.tgz#aeac0a1d8de1e067bc0b156c1fdd62a6b7bf6069" + integrity sha512-uiX1ned0LrzASot+sPUjyJzr8Js3pX075omazgsSdLf0zPp4ss8xwTiuNh5FSKigTSQEVqZFiS+W8CnHIrX62A== + "@nodelib/fs.scandir@2.1.4": version "2.1.4" resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.4.tgz#d4b3549a5db5de2683e0c1071ab4f140904bbf69" @@ -2111,14 +2116,6 @@ prop-types "^15.7.2" tslib "^2.3.0" -"@reach/auto-id@0.15.2": - version "0.15.2" - resolved "https://registry.yarnpkg.com/@reach/auto-id/-/auto-id-0.15.2.tgz#289640b47545a32f3621469ba497ba5c040b349c" - integrity sha512-K7d5qhYBlBHIjy+IpSEAyMeB5VTZ9m0tZdr7xyNd5Fr6oeefHEvJiJGuQpubP5bDoe7ShC3y0VQGFmT0g7KcZg== - dependencies: - "@reach/utils" "0.15.2" - tslib "^2.3.0" - "@reach/auto-id@0.16.0": version "0.16.0" resolved "https://registry.yarnpkg.com/@reach/auto-id/-/auto-id-0.16.0.tgz#dfabc3227844e8c04f8e6e45203a8e14a8edbaed" @@ -2139,14 +2136,6 @@ tiny-warning "^1.0.3" tslib "^2.3.0" -"@reach/descendants@0.15.2": - version "0.15.2" - resolved "https://registry.yarnpkg.com/@reach/descendants/-/descendants-0.15.2.tgz#b0641f0bc864d91271364678dea51cf86b2e5c66" - integrity sha512-GdQXWVpscss89MOhWh+sL4TnIn0qX1y+Te3wE72aKQrz/QCR69JFEW4wftovmF7rFm4/kDZcp14lMy512U6VlA== - dependencies: - "@reach/utils" "0.15.2" - tslib "^2.3.0" - "@reach/descendants@0.16.1": version "0.16.1" resolved "https://registry.yarnpkg.com/@reach/descendants/-/descendants-0.16.1.tgz#fa3d89c0503565369707f32985d87eef61985d9f" @@ -2178,17 +2167,16 @@ tiny-warning "^1.0.3" tslib "^2.3.0" -"@reach/listbox@^0.15.0": - version "0.15.2" - resolved "https://registry.yarnpkg.com/@reach/listbox/-/listbox-0.15.2.tgz#21aacc5340deb1b819d522f7f7fd4caac093c8a4" - integrity sha512-bXXelcm+PvAWAmhHQEaEVU6IQvTieIdoYcIrs5JsKzH98M+pp940Gdm0d2uDcmFatx/I9OMTAsOTJ129RPECrA== +"@reach/dropdown@0.16.2": + version "0.16.2" + resolved "https://registry.yarnpkg.com/@reach/dropdown/-/dropdown-0.16.2.tgz#4aa7df0f716cb448d01bc020d54df595303d5fa6" + integrity sha512-l4nNiX6iUpMdHQNbZMhgW5APtw0AUwJuRnkqE93vkjvdtrYl/sNJy1Jr6cGG7TrZIABLSOsfwbXU3C+qwJ3ftQ== dependencies: - "@reach/auto-id" "0.15.2" - "@reach/descendants" "0.15.2" - "@reach/machine" "0.15.2" - "@reach/popover" "0.15.2" - "@reach/utils" "0.15.2" - prop-types "^15.7.2" + "@reach/auto-id" "0.16.0" + "@reach/descendants" "0.16.1" + "@reach/popover" "0.16.2" + "@reach/utils" "0.16.0" + tslib "^2.3.0" "@reach/listbox@^0.16.2": version "0.16.2" @@ -2202,15 +2190,6 @@ "@reach/utils" "0.16.0" prop-types "^15.7.2" -"@reach/machine@0.15.2": - version "0.15.2" - resolved "https://registry.yarnpkg.com/@reach/machine/-/machine-0.15.2.tgz#f1558e63a6b304e6cc12feefb0d0dd315b32c962" - integrity sha512-op8Duhp6rNCReZgdVScbIzoXMPFYP4nje6dvg4g2GKo8hUkyQpebsUFnUNNNv6NWdbmhIRiKHFlTgSl2gIlh5Q== - dependencies: - "@reach/utils" "0.15.2" - "@xstate/fsm" "1.4.0" - tslib "^2.3.0" - "@reach/machine@0.16.0": version "0.16.0" resolved "https://registry.yarnpkg.com/@reach/machine/-/machine-0.16.0.tgz#0504ba47ac09ed495bd341bf5fdd6625bcade0e3" @@ -2220,15 +2199,14 @@ "@xstate/fsm" "1.4.0" tslib "^2.3.0" -"@reach/menu-button@^0.15.1": - version "0.15.2" - resolved "https://registry.yarnpkg.com/@reach/menu-button/-/menu-button-0.15.2.tgz#00f91402be3ff23d3b4cfe377529f4f9e82a78fe" - integrity sha512-slEji1AnfnH134YDZSTwst4nZHYNrfyg9GF+A8p1+kGc8N3JsPysHc7uIUZ/IsK+PdaOCB+r9kuL1QWBgNO+jw== +"@reach/menu-button@^0.16.2": + version "0.16.2" + resolved "https://registry.yarnpkg.com/@reach/menu-button/-/menu-button-0.16.2.tgz#664e33e70de431f88abf1f8537c48b1b6ce87e88" + integrity sha512-p4n6tFVaJZHJZEznHWy0YH2Xr3I+W7tsQWAT72PqKGT+uryGRdtgEQqi76f/8cRaw/00ueazBk5lwLG7UKGFaA== dependencies: - "@reach/auto-id" "0.15.2" - "@reach/descendants" "0.15.2" - "@reach/popover" "0.15.2" - "@reach/utils" "0.15.2" + "@reach/dropdown" "0.16.2" + "@reach/popover" "0.16.2" + "@reach/utils" "0.16.0" prop-types "^15.7.2" tiny-warning "^1.0.3" tslib "^2.3.0" @@ -2238,17 +2216,6 @@ resolved "https://registry.yarnpkg.com/@reach/observe-rect/-/observe-rect-1.2.0.tgz#d7a6013b8aafcc64c778a0ccb83355a11204d3b2" integrity sha512-Ba7HmkFgfQxZqqaeIWWkNK0rEhpxVQHIoVyW1YDSkGsGIXzcaW4deC8B0pZrNSSyLTdIk7y+5olKt5+g0GmFIQ== -"@reach/popover@0.15.2": - version "0.15.2" - resolved "https://registry.yarnpkg.com/@reach/popover/-/popover-0.15.2.tgz#e310e2afe82afa35929354f1fd1a747cdebb7654" - integrity sha512-92Ov7VPXjn4ciOVupeekki03lSMz9NAmw2BjWYE9mVvYWKyDx5jx2srtbkIqUaSCkAVV3KEsFUia8aMm60FDZg== - dependencies: - "@reach/portal" "0.15.2" - "@reach/rect" "0.15.2" - "@reach/utils" "0.15.2" - tabbable "^4.0.0" - tslib "^2.3.0" - "@reach/popover@0.16.2": version "0.16.2" resolved "https://registry.yarnpkg.com/@reach/popover/-/popover-0.16.2.tgz#71d7af3002ca49d791476b22dee1840dd1719c19" @@ -2260,14 +2227,6 @@ tabbable "^4.0.0" tslib "^2.3.0" -"@reach/portal@0.15.2": - version "0.15.2" - resolved "https://registry.yarnpkg.com/@reach/portal/-/portal-0.15.2.tgz#fe7aa3d9a475ec07686c39bab3a0d85093fa91fb" - integrity sha512-5x+dchGr4btRnLazwmyCYbSPVJAIrw0eXwhz7Vj9uT/EIp43WzOtTcODdLOoH6Ol2QLjX1Yt/fBjdK9+UAKxSA== - dependencies: - "@reach/utils" "0.15.2" - tslib "^2.3.0" - "@reach/portal@0.16.2": version "0.16.2" resolved "https://registry.yarnpkg.com/@reach/portal/-/portal-0.16.2.tgz#ca83696215ee03acc2bb25a5ae5d8793eaaf2f64" @@ -2277,17 +2236,6 @@ tiny-warning "^1.0.3" tslib "^2.3.0" -"@reach/rect@0.15.2": - version "0.15.2" - resolved "https://registry.yarnpkg.com/@reach/rect/-/rect-0.15.2.tgz#734e3f17a499d6e22bd2ea95856c801c41ed66fd" - integrity sha512-S2lzvvfclUHdvgcfW/eoz0i729HJvG5f6ayVaXcKz+X6LKF9i9Jdhfwsz7b3UmnSCihKNs0cX5tyWfWr1E1JFw== - dependencies: - "@reach/observe-rect" "1.2.0" - "@reach/utils" "0.15.2" - prop-types "^15.7.2" - tiny-warning "^1.0.3" - tslib "^2.3.0" - "@reach/rect@0.16.0": version "0.16.0" resolved "https://registry.yarnpkg.com/@reach/rect/-/rect-0.16.0.tgz#78cf6acefe2e83d3957fa84f938f6e1fc5700f16" @@ -2313,14 +2261,6 @@ tiny-warning "^1.0.3" tslib "^2.3.0" -"@reach/utils@0.15.2": - version "0.15.2" - resolved "https://registry.yarnpkg.com/@reach/utils/-/utils-0.15.2.tgz#a63a761eb36266bf33d65cb91520dd85a04ae116" - integrity sha512-Lr1SJ5X4hEjD/M0TAonURM8wytM/JuPSuIP7t+e5cil34pThyLsBvTGeNfmpSgaLJ5vlsv0x9u6g4SRAEr84Og== - dependencies: - tiny-warning "^1.0.3" - tslib "^2.3.0" - "@reach/utils@0.16.0": version "0.16.0" resolved "https://registry.yarnpkg.com/@reach/utils/-/utils-0.16.0.tgz#5b0777cf16a7cab1ddd4728d5d02762df0ba84ce" @@ -2461,15 +2401,18 @@ "@standardnotes/sncrypto-common" "^1.7.1" "@standardnotes/utils" "^1.2.1" -"@standardnotes/stylekit@5.10.0": - version "5.10.0" - resolved "https://registry.yarnpkg.com/@standardnotes/stylekit/-/stylekit-5.10.0.tgz#94bc1c6686663b2b89b004eb777a6792a0305f47" - integrity sha512-W0vuqjfN1GD254ZTdlroMgKIQSebuhkJkc5Lh0tWQ5cpQyXrZ3HsHXd3H98PPbP+wtLS34XS5G/PHc7OjD146g== +"@standardnotes/stylekit@5.12.2": + version "5.12.2" + resolved "https://registry.yarnpkg.com/@standardnotes/stylekit/-/stylekit-5.12.2.tgz#8c2bea39aa696d27a3b88ef68c182638f9c72615" + integrity sha512-pa30xiil1ZQoXZetWdOhABIfOTkuhlSqdi2LAmJ7SkfiCclqsGGvOSf8z2R2V8DP5B7R2kYH6ko11CBGAhwjqA== dependencies: - "@reach/listbox" "^0.15.0" - "@reach/menu-button" "^0.15.1" + "@nanostores/preact" "^0.1.3" + "@reach/listbox" "^0.16.2" + "@reach/menu-button" "^0.16.2" "@svgr/webpack" "^6.2.1" - prop-types "^15.7.2" + nanoid "^3.3.1" + nanostores "^0.5.10" + prop-types "^15.8.1" "@standardnotes/utils@^1.2.1": version "1.2.1" @@ -7373,11 +7316,16 @@ nan@^2.13.2: resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.2.tgz#f5376400695168f4cc694ac9393d0c9585eeea19" integrity sha512-M2ufzIiINKCuDfBSAUr1vWQ+vuVcA9kqx8JJUsbQi6yf1uGRyb7HfpdfUr5qLXf3B/t8dPvcjhKMmlfnP47EzQ== -nanoid@^3.2.0: +nanoid@^3.2.0, nanoid@^3.3.1: version "3.3.1" resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.1.tgz#6347a18cac88af88f58af0b3594b723d5e99bb35" integrity sha512-n6Vs/3KGyxPQd6uO0eH4Bv0ojGSUvuLlIHtC3Y0kEO23YRge8H9x1GCzLn28YX0H66pMkxuaeESFq4tKISKwdw== +nanostores@^0.5.10: + version "0.5.10" + resolved "https://registry.yarnpkg.com/nanostores/-/nanostores-0.5.10.tgz#16488776f01fa288b09c026400ff535da55c3583" + integrity sha512-8Y7C8sF8PsHGpLVJochWT+ytEY34XrNRDA30hDqgvLcl5Ih4d/IFb7gUSFIwmgFAaht1pLwKZHTeFoJrNz88RQ== + natural-compare@^1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7"