@frigade/react 2.0.0-alpha.3 → 2.0.0-alpha.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@frigade/react",
-  "version": "2.0.0-alpha.3",
+  "version": "2.0.0-alpha.31",
   "description": "Build better product onboarding, faster.",
   "type": "module",
   "main": "./dist/index.js",
@@ -45,6 +45,10 @@
   "files": [
     "./dist"
   ],
+  "sideEffects": [
+    "**/*.css",
+    "**/*.css.ts"
+  ],
   "scripts": {
     "dev": "tsup --watch",
     "clean": "rimraf ./dist",
@@ -57,22 +61,25 @@
     "@emotion/react": "^11.11.1",
     "@frigade/js": "*",
     "@heroicons/react": "^2.0.18",
+    "@radix-ui/react-dialog": "^1.0.5",
     "@radix-ui/react-popover": "^1.0.7",
-    "@vanilla-extract/css": "^1.13.0",
-    "@vanilla-extract/dynamic": "^2.0.3",
     "clsx": "^2.0.0",
-    "core-js-pure": "^3.33.0"
+    "core-js-pure": "^3.33.0",
+    "dompurify": "^3.0.6",
+    "jsdom": "^23.0.1",
+    "known-css-properties": "^0.29.0"
   },
   "peerDependencies": {
     "react": "17 - 18",
     "react-dom": "17 - 18"
   },
   "devDependencies": {
+    "@types/dompurify": "^3.0.5",
     "@types/jest": "^23.3.1",
+    "@types/node": "^20.10.5",
     "@types/react": "^18.2.34",
     "@types/react-dom": "^18.2.14",
-    "@vanilla-extract/esbuild-plugin": "^2.3.0",
-    "jest": "^29.6.2",
+    "jest": "^29.7.0",
     "jest-config": "^29.6.2",
     "jest-environment-jsdom": "^29.6.2",
     "prettier": "^2.4.1",

package/dist/index.css

@@ -1,2 +0,0 @@
-:root{--fr-borders-md: 1px solid;--fr-borderWidths-0: 0;--fr-borderWidths-md: 1px;--fr-colors-black: #000000;--fr-colors-gray100: #14161A;--fr-colors-gray200: #181B20;--fr-colors-gray300: #1F2329;--fr-colors-gray400: #2E343D;--fr-colors-gray500: #4C5766;--fr-colors-gray600: #5A6472;--fr-colors-gray700: #C5CBD3;--fr-colors-gray800: #E2E5E9;--fr-colors-gray900: #F1F2F4;--fr-colors-white: #ffffff;--fr-colors-blue400: #015AC6;--fr-colors-blue500: #0171F8;--fr-colors-blue800: #DBECFF;--fr-colors-blue900: #F5F9FF;--fr-colors-green400: #009E37;--fr-colors-green500: #00D149;--fr-colors-green800: #DBFFE8;--fr-colors-transparent: #FFFFFF00;--fr-colors-red500: #c00000;--fr-colors-neutral-background: var(--fr-colors-white);--fr-colors-neutral-border: var(--fr-colors-gray900);--fr-colors-neutral-foreground: var(--fr-colors-black);--fr-colors-neutral-surface: var(--fr-colors-gray700);--fr-colors-neutral-active-background: var(--fr-colors-white);--fr-colors-neutral-active-border: var(--fr-colors-gray900);--fr-colors-neutral-active-foreground: var(--fr-colors-black);--fr-colors-neutral-active-surface: var(--fr-colors-gray700);--fr-colors-neutral-focus-background: var(--fr-colors-white);--fr-colors-neutral-focus-border: var(--fr-colors-gray900);--fr-colors-neutral-focus-foreground: var(--fr-colors-black);--fr-colors-neutral-focus-surface: var(--fr-colors-gray700);--fr-colors-neutral-hover-background: var(--fr-colors-white);--fr-colors-neutral-hover-border: var(--fr-colors-gray900);--fr-colors-neutral-hover-foreground: var(--fr-colors-black);--fr-colors-neutral-hover-surface: var(--fr-colors-gray700);--fr-colors-primary-background: var(--fr-colors-blue500);--fr-colors-primary-border: var(--fr-colors-blue500);--fr-colors-primary-foreground: var(--fr-colors-white);--fr-colors-primary-surface: var(--fr-colors-blue500);--fr-colors-primary-active-background: var(--fr-colors-blue400);--fr-colors-primary-active-border: var(--fr-colors-blue400);--fr-colors-primary-active-foreground: var(--fr-colors-white);--fr-colors-primary-active-surface: var(--fr-colors-blue400);--fr-colors-primary-focus-background: var(--fr-colors-blue500);--fr-colors-primary-focus-border: var(--fr-colors-blue500);--fr-colors-primary-focus-foreground: var(--fr-colors-white);--fr-colors-primary-focus-surface: var(--fr-colors-blue500);--fr-colors-primary-hover-background: var(--fr-colors-blue400);--fr-colors-primary-hover-border: var(--fr-colors-blue400);--fr-colors-primary-hover-foreground: var(--fr-colors-white);--fr-colors-primary-hover-surface: var(--fr-colors-blue400);--fr-colors-secondary-background: var(--fr-colors-gray900);--fr-colors-secondary-border: var(--fr-colors-gray900);--fr-colors-secondary-foreground: var(--fr-colors-black);--fr-colors-secondary-surface: var(--fr-colors-gray900);--fr-colors-secondary-active-background: var(--fr-colors-gray800);--fr-colors-secondary-active-border: var(--fr-colors-gray800);--fr-colors-secondary-active-foreground: var(--fr-colors-black);--fr-colors-secondary-active-surface: var(--fr-colors-gray800);--fr-colors-secondary-focus-background: var(--fr-colors-gray900);--fr-colors-secondary-focus-border: var(--fr-colors-gray900);--fr-colors-secondary-focus-foreground: var(--fr-colors-black);--fr-colors-secondary-focus-surface: var(--fr-colors-gray900);--fr-colors-secondary-hover-background: var(--fr-colors-gray800);--fr-colors-secondary-hover-border: var(--fr-colors-gray800);--fr-colors-secondary-hover-foreground: var(--fr-colors-black);--fr-colors-secondary-hover-surface: var(--fr-colors-gray800);--fr-fontFamilies-default: TT Interphases Pro, sans-serif;--fr-fontSizes-xs: 12px;--fr-fontSizes-sm: 14px;--fr-fontSizes-md: 16px;--fr-fontSizes-lg: 18px;--fr-fontSizes-xl: 20px;--fr-fontSizes-2xl: 24px;--fr-fontSizes-3xl: 30px;--fr-fontSizes-4xl: 36px;--fr-fontSizes-5xl: 48px;--fr-fontWeights-regular: 400;--fr-fontWeights-demibold: 600;--fr-fontWeights-bold: 700;--fr-letterSpacings-md: .02em;--fr-lineHeights-xs: 18px;--fr-lineHeights-sm: 22px;--fr-lineHeights-md: 24px;--fr-lineHeights-lg: 26px;--fr-lineHeights-xl: 30px;--fr-lineHeights-2xl: 38px;--fr-lineHeights-3xl: 46px;--fr-lineHeights-4xl: 60px;--fr-radii-md: 8px;--fr-radii-lg: 20px;--fr-radii-round: 50%;--fr-shadows-md: 0px 4px 20px rgba(0, 0, 0, .1);--fr-space-0: 0px;--fr-space-1: 4px;--fr-space-2: 8px;--fr-space-3: 12px;--fr-space-4: 16px;--fr-space-5: 20px;--fr-space-6: 24px;--fr-space-7: 28px;--fr-space-8: 32px;--fr-space-9: 36px;--fr-space-10: 40px;--fr-space-11: 44px;--fr-space-12: 48px;--fr-space-13: 52px;--fr-space-14: 56px;--fr-space-15: 60px;--fr-space-16: 64px;--fr-space-17: 68px;--fr-space-18: 72px;--fr-space-19: 76px;--fr-space-20: 80px;--fr-space--20: -80px;--fr-space--19: -76px;--fr-space--18: -72px;--fr-space--17: -68px;--fr-space--16: -64px;--fr-space--15: -60px;--fr-space--14: -56px;--fr-space--13: -52px;--fr-space--12: -48px;--fr-space--11: -44px;--fr-space--10: -40px;--fr-space--9: -36px;--fr-space--8: -32px;--fr-space--7: -28px;--fr-space--6: -24px;--fr-space--5: -20px;--fr-space--4: -16px;--fr-space--3: -12px;--fr-space--2: -8px;--fr-space--1: -4px;--fr-space--0-5: -2px;--fr-space-0-5: 2px;--fr-space-auto: auto}@keyframes _16td420{0%{opacity:.5;transform:scale(.5)}50%{opacity:0;transform:scale(1)}to{opacity:0;transform:scale(1)}}._16td421{animation:2s ease-out infinite _16td420}
-/*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["vanilla-extract-css-ns:src/shared/theme/baseTheme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE6VY226bQBB971cgVZVSqRvBcrOdp8Q2at8qtVKe17C2UTFYC07dVv337i01ZgeWYBTlYQ5nZs5clmwWrKoa5887x0Foy9CmYhllNTpkC8c7np26KvLs4Rp9zrNmXyN34bgwosn/wbQqKu5zU5D0x8J578qni+4Y+eW53Ol7L/Ai7xHCscJn3hMG+b7CE+zjOYQHEsdrP/BXEB5KPFiGcRRBeCTx8DEKYgzhscSX4fJp5UP4TOJrvA7XYH5ziSdcQBJ08Z/7vKEc3crHrO2JKnWuFz4ujewFHmo89pIZhKvsVk/rZZJAuM4uTOYmvmOUljoBd772Y/AFnYG78gJAP3/hNYUkWRspNoyU9ZEwWjYiDfmYY8RopqKk4JSV9MT9FGjDR3HHqlPJR/WFsDuj0h97mXLSTZbuXy9vWzHaF1FuRi+zPrEtSSkcMh4ISdImf6E3aH11MFGypk9Xrh1MLsC2Sk/1Dfo1f3LHBXu6esWfLH5fvVB2g3jNnyhesaeLV/w3iz+y/EDYr0HZ+izs5/ZItvGGxMKlfmX2yrSFHLHh+stgdTEgegR9unbbjtsSsO+4vW9DWz6OPV2/Zctt4e1bbivg8J6PY0+Xb9nzvvA1Tasys2163yHVYr/xeLsw3360XbiDx9pw2BEbr//SHOFkQPwoB7fUYMy3fTgJ++aP6eKUL3yXf0sdRnzlh1OwnwD2Utq/9WP4t5RhxPf+KoVtVTYJOeRFTmuU0S05Ffxa8P2786VsKDvuSU1r5yurPjk1vzbwQCzfXpG/5b8581zzqypu3VUvUH3gUABC8oIbgVCx49AMhM7FwsEuCGGJwcF8gfkwL5AYnEkosKCbyjPNd/tG3JN2p4LwZgetS1L7hYwe8k1VcKVRzxsKjVtoQRte/G9HkublTpXJvXcxPVzeyEv6WfNl7dv5tUFRfYx7QOH4qlptUHQARz2gUcs2KLvg92Uk+xD0OZadiNqeGcnyXKY6M6wyR/NlvTuh++E/UO9JVv3UtTyeHa5aMh2225A795Ojf+69y27wW3JK5f9nWhGU0Vs4gWHE1ykqo99ZDGUNOoOvrGFHjbJGnSYpa8ytZrQZL7wZbd4Zbq3BFVNrmoU2M56HO1ugzVxfaEb0uMAQCBl2mqvNXGIEhOQaIyAkFxkDIbnK2AyJucqZGVLaEQQIPwhwJOMiILDMEwGJSl0IECbrgIBCyLohoHCyzggotOwLAhoj+4iARsq+I6DxYkwQMCdiqBAwVWIEETCDYmARMLFivBEw32IZELANYnUQsDtizxAkWMgyza6KawDSbprJqakWjvj98O7vP0nait/WFQAA","vanilla-extract-css-ns:src/components/Tooltip/Dot.css.ts.vanilla.css?source=QGtleWZyYW1lcyBfMTZ0ZDQyMCB7CiAgMCUgewogICAgb3BhY2l0eTogMC41OwogICAgdHJhbnNmb3JtOiBzY2FsZSgwLjUpOwogIH0KICA1MCUgewogICAgb3BhY2l0eTogMDsKICAgIHRyYW5zZm9ybTogc2NhbGUoMSk7CiAgfQogIDEwMCUgewogICAgb3BhY2l0eTogMDsKICAgIHRyYW5zZm9ybTogc2NhbGUoMSk7CiAgfQp9Ci5fMTZ0ZDQyMSB7CiAgYW5pbWF0aW9uOiAycyBlYXNlLW91dCBpbmZpbml0ZSBfMTZ0ZDQyMDsKfQ=="],"sourcesContent":[":root {\n  --fr-borders-md: 1px solid;\n  --fr-borderWidths-0: 0;\n  --fr-borderWidths-md: 1px;\n  --fr-colors-black: #000000;\n  --fr-colors-gray100: #14161A;\n  --fr-colors-gray200: #181B20;\n  --fr-colors-gray300: #1F2329;\n  --fr-colors-gray400: #2E343D;\n  --fr-colors-gray500: #4C5766;\n  --fr-colors-gray600: #5A6472;\n  --fr-colors-gray700: #C5CBD3;\n  --fr-colors-gray800: #E2E5E9;\n  --fr-colors-gray900: #F1F2F4;\n  --fr-colors-white: #ffffff;\n  --fr-colors-blue400: #015AC6;\n  --fr-colors-blue500: #0171F8;\n  --fr-colors-blue800: #DBECFF;\n  --fr-colors-blue900: #F5F9FF;\n  --fr-colors-green400: #009E37;\n  --fr-colors-green500: #00D149;\n  --fr-colors-green800: #DBFFE8;\n  --fr-colors-transparent: #FFFFFF00;\n  --fr-colors-red500: #c00000;\n  --fr-colors-neutral-background: var(--fr-colors-white);\n  --fr-colors-neutral-border: var(--fr-colors-gray900);\n  --fr-colors-neutral-foreground: var(--fr-colors-black);\n  --fr-colors-neutral-surface: var(--fr-colors-gray700);\n  --fr-colors-neutral-active-background: var(--fr-colors-white);\n  --fr-colors-neutral-active-border: var(--fr-colors-gray900);\n  --fr-colors-neutral-active-foreground: var(--fr-colors-black);\n  --fr-colors-neutral-active-surface: var(--fr-colors-gray700);\n  --fr-colors-neutral-focus-background: var(--fr-colors-white);\n  --fr-colors-neutral-focus-border: var(--fr-colors-gray900);\n  --fr-colors-neutral-focus-foreground: var(--fr-colors-black);\n  --fr-colors-neutral-focus-surface: var(--fr-colors-gray700);\n  --fr-colors-neutral-hover-background: var(--fr-colors-white);\n  --fr-colors-neutral-hover-border: var(--fr-colors-gray900);\n  --fr-colors-neutral-hover-foreground: var(--fr-colors-black);\n  --fr-colors-neutral-hover-surface: var(--fr-colors-gray700);\n  --fr-colors-primary-background: var(--fr-colors-blue500);\n  --fr-colors-primary-border: var(--fr-colors-blue500);\n  --fr-colors-primary-foreground: var(--fr-colors-white);\n  --fr-colors-primary-surface: var(--fr-colors-blue500);\n  --fr-colors-primary-active-background: var(--fr-colors-blue400);\n  --fr-colors-primary-active-border: var(--fr-colors-blue400);\n  --fr-colors-primary-active-foreground: var(--fr-colors-white);\n  --fr-colors-primary-active-surface: var(--fr-colors-blue400);\n  --fr-colors-primary-focus-background: var(--fr-colors-blue500);\n  --fr-colors-primary-focus-border: var(--fr-colors-blue500);\n  --fr-colors-primary-focus-foreground: var(--fr-colors-white);\n  --fr-colors-primary-focus-surface: var(--fr-colors-blue500);\n  --fr-colors-primary-hover-background: var(--fr-colors-blue400);\n  --fr-colors-primary-hover-border: var(--fr-colors-blue400);\n  --fr-colors-primary-hover-foreground: var(--fr-colors-white);\n  --fr-colors-primary-hover-surface: var(--fr-colors-blue400);\n  --fr-colors-secondary-background: var(--fr-colors-gray900);\n  --fr-colors-secondary-border: var(--fr-colors-gray900);\n  --fr-colors-secondary-foreground: var(--fr-colors-black);\n  --fr-colors-secondary-surface: var(--fr-colors-gray900);\n  --fr-colors-secondary-active-background: var(--fr-colors-gray800);\n  --fr-colors-secondary-active-border: var(--fr-colors-gray800);\n  --fr-colors-secondary-active-foreground: var(--fr-colors-black);\n  --fr-colors-secondary-active-surface: var(--fr-colors-gray800);\n  --fr-colors-secondary-focus-background: var(--fr-colors-gray900);\n  --fr-colors-secondary-focus-border: var(--fr-colors-gray900);\n  --fr-colors-secondary-focus-foreground: var(--fr-colors-black);\n  --fr-colors-secondary-focus-surface: var(--fr-colors-gray900);\n  --fr-colors-secondary-hover-background: var(--fr-colors-gray800);\n  --fr-colors-secondary-hover-border: var(--fr-colors-gray800);\n  --fr-colors-secondary-hover-foreground: var(--fr-colors-black);\n  --fr-colors-secondary-hover-surface: var(--fr-colors-gray800);\n  --fr-fontFamilies-default: TT Interphases Pro, sans-serif;\n  --fr-fontSizes-xs: 12px;\n  --fr-fontSizes-sm: 14px;\n  --fr-fontSizes-md: 16px;\n  --fr-fontSizes-lg: 18px;\n  --fr-fontSizes-xl: 20px;\n  --fr-fontSizes-2xl: 24px;\n  --fr-fontSizes-3xl: 30px;\n  --fr-fontSizes-4xl: 36px;\n  --fr-fontSizes-5xl: 48px;\n  --fr-fontWeights-regular: 400;\n  --fr-fontWeights-demibold: 600;\n  --fr-fontWeights-bold: 700;\n  --fr-letterSpacings-md: 0.02em;\n  --fr-lineHeights-xs: 18px;\n  --fr-lineHeights-sm: 22px;\n  --fr-lineHeights-md: 24px;\n  --fr-lineHeights-lg: 26px;\n  --fr-lineHeights-xl: 30px;\n  --fr-lineHeights-2xl: 38px;\n  --fr-lineHeights-3xl: 46px;\n  --fr-lineHeights-4xl: 60px;\n  --fr-radii-md: 8px;\n  --fr-radii-lg: 20px;\n  --fr-radii-round: 50%;\n  --fr-shadows-md: 0px 4px 20px rgba(0, 0, 0, 0.1);\n  --fr-space-0: 0px;\n  --fr-space-1: 4px;\n  --fr-space-2: 8px;\n  --fr-space-3: 12px;\n  --fr-space-4: 16px;\n  --fr-space-5: 20px;\n  --fr-space-6: 24px;\n  --fr-space-7: 28px;\n  --fr-space-8: 32px;\n  --fr-space-9: 36px;\n  --fr-space-10: 40px;\n  --fr-space-11: 44px;\n  --fr-space-12: 48px;\n  --fr-space-13: 52px;\n  --fr-space-14: 56px;\n  --fr-space-15: 60px;\n  --fr-space-16: 64px;\n  --fr-space-17: 68px;\n  --fr-space-18: 72px;\n  --fr-space-19: 76px;\n  --fr-space-20: 80px;\n  --fr-space--20: -80px;\n  --fr-space--19: -76px;\n  --fr-space--18: -72px;\n  --fr-space--17: -68px;\n  --fr-space--16: -64px;\n  --fr-space--15: -60px;\n  --fr-space--14: -56px;\n  --fr-space--13: -52px;\n  --fr-space--12: -48px;\n  --fr-space--11: -44px;\n  --fr-space--10: -40px;\n  --fr-space--9: -36px;\n  --fr-space--8: -32px;\n  --fr-space--7: -28px;\n  --fr-space--6: -24px;\n  --fr-space--5: -20px;\n  --fr-space--4: -16px;\n  --fr-space--3: -12px;\n  --fr-space--2: -8px;\n  --fr-space--1: -4px;\n  --fr-space--0-5: -2px;\n  --fr-space-0-5: 2px;\n  --fr-space-auto: auto;\n}","@keyframes _16td420 {\n  0% {\n    opacity: 0.5;\n    transform: scale(0.5);\n  }\n  50% {\n    opacity: 0;\n    transform: scale(1);\n  }\n  100% {\n    opacity: 0;\n    transform: scale(1);\n  }\n}\n._16td421 {\n  animation: 2s ease-out infinite _16td420;\n}"],"mappings":"AAAA,MACE,2BACA,uBACA,0BACA,2BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,6BACA,2BACA,6BACA,6BACA,6BACA,6BACA,8BACA,8BACA,8BACA,mCACA,4BACA,uDACA,qDACA,uDACA,sDACA,8DACA,4DACA,8DACA,6DACA,6DACA,2DACA,6DACA,4DACA,6DACA,2DACA,6DACA,4DACA,yDACA,qDACA,uDACA,sDACA,gEACA,4DACA,8DACA,6DACA,+DACA,2DACA,6DACA,4DACA,+DACA,2DACA,6DACA,4DACA,2DACA,uDACA,yDACA,wDACA,kEACA,8DACA,gEACA,+DACA,iEACA,6DACA,+DACA,8DACA,iEACA,6DACA,+DACA,8DACA,0DACA,wBACA,wBACA,wBACA,wBACA,wBACA,yBACA,yBACA,yBACA,yBACA,8BACA,+BACA,2BACA,8BACA,0BACA,0BACA,0BACA,0BACA,0BACA,2BACA,2BACA,2BACA,mBACA,oBACA,sBACA,gDACA,kBACA,kBACA,kBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,mBACA,oBACA,oBACA,oBACA,oBACA,oBACA,oBACA,oBACA,oBACA,oBACA,oBACA,oBACA,sBACA,sBACA,sBACA,sBACA,sBACA,sBACA,sBACA,sBACA,sBACA,sBACA,sBACA,qBACA,qBACA,qBACA,qBACA,qBACA,qBACA,qBACA,oBACA,oBACA,sBACA,oBACA,sBC7IF,uBAEI,WACA,wBAGA,UACA,sBAGA,UACA,oBAGJ,UACE","names":[]}