@nocoo/basalt 2.0.0-rc.1 → 2.0.0

package/dist/providers/accent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accent.js","names":[],"sources":["../../src/providers/accent.tsx"],"sourcesContent":["import {\n\tcreateContext,\n\ttype ReactNode,\n\tuseCallback,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseSyncExternalStore,\n} from \"react\";\n\nexport type AccentSwatch = {\n\tid: string;\n\tlabel: string;\n\tlight: string;\n\tdark: string;\n\tforeground: string;\n};\n\nexport const ACCENT_SWATCHES: readonly AccentSwatch[] = [\n\t{ id: \"blue\", label: \"Blue\", light: \"217 80% 36%\", dark: \"217 80% 38%\", foreground: \"0 0% 100%\" },\n\t{ id: \"teal\", label: \"Teal\", light: \"186 72% 28%\", dark: \"186 72% 32%\", foreground: \"0 0% 100%\" },\n\t{\n\t\tid: \"green\",\n\t\tlabel: \"Green\",\n\t\tlight: \"142 64% 28%\",\n\t\tdark: \"142 64% 32%\",\n\t\tforeground: \"0 0% 100%\",\n\t},\n\t{ id: \"amber\", label: \"Amber\", light: \"38 88% 44%\", dark: \"38 88% 56%\", foreground: \"0 0% 10%\" },\n\t{\n\t\tid: \"orange\",\n\t\tlabel: \"Orange\",\n\t\tlight: \"24 86% 36%\",\n\t\tdark: \"24 86% 38%\",\n\t\tforeground: \"0 0% 100%\",\n\t},\n\t{ id: \"rose\", label: \"Rose\", light: \"340 72% 36%\", dark: \"340 72% 38%\", foreground: \"0 0% 100%\" },\n\t{\n\t\tid: \"purple\",\n\t\tlabel: \"Purple\",\n\t\tlight: \"270 52% 36%\",\n\t\tdark: \"270 52% 38%\",\n\t\tforeground: \"0 0% 100%\",\n\t},\n\t{\n\t\tid: \"indigo\",\n\t\tlabel: \"Indigo\",\n\t\tlight: \"250 52% 36%\",\n\t\tdark: \"250 52% 38%\",\n\t\tforeground: \"0 0% 100%\",\n\t},\n] as const;\n\nexport const DEFAULT_ACCENT_ID = \"blue\";\nconst STORAGE_KEY = \"basalt-accent\";\n\ntype AccentContextValue = {\n\taccent: string;\n\tsetAccent: (id: string) => void;\n\tswatches: readonly AccentSwatch[];\n};\n\nconst AccentContext = createContext<AccentContextValue | null>(null);\n\nexport function accentSwatchById(id: string | null | undefined): AccentSwatch {\n\treturn ACCENT_SWATCHES.find((swatch) => swatch.id === id) ?? ACCENT_SWATCHES[0];\n}\n\nexport function applyAccent(id: string, dark = false) {\n\tconst swatch = accentSwatchById(id);\n\tconst value = dark ? swatch.dark : swatch.light;\n\tconst root = document.documentElement;\n\troot.style.setProperty(\"--basalt-primary\", value);\n\troot.style.setProperty(\"--basalt-primary-foreground\", swatch.foreground);\n\troot.style.setProperty(\"--basalt-ring\", value);\n\troot.style.setProperty(\"--basalt-chart-1\", value);\n\troot.dataset.accent = swatch.id;\n}\n\nfunction readAccent(): string {\n\treturn accentSwatchById(window.localStorage.getItem(STORAGE_KEY)).id;\n}\n\nfunction subscribe(onStoreChange: () => void) {\n\twindow.addEventListener(\"storage\", onStoreChange);\n\treturn () => window.removeEventListener(\"storage\", onStoreChange);\n}\n\nfunction isDarkMode(): boolean {\n\treturn document.documentElement.classList.contains(\"dark\");\n}\n\nexport function AccentProvider({ children }: { children: ReactNode }) {\n\tconst accent = useSyncExternalStore(subscribe, readAccent, () => DEFAULT_ACCENT_ID);\n\tuseEffect(() => {\n\t\tapplyAccent(accent, isDarkMode());\n\t\tconst observer = new MutationObserver(() => applyAccent(accent, isDarkMode()));\n\t\tobserver.observe(document.documentElement, { attributes: true, attributeFilter: [\"class\"] });\n\t\treturn () => observer.disconnect();\n\t}, [accent]);\n\tconst setAccent = useCallback((id: string) => {\n\t\tconst next = accentSwatchById(id).id;\n\t\twindow.localStorage.setItem(STORAGE_KEY, next);\n\t\tapplyAccent(next, isDarkMode());\n\t\twindow.dispatchEvent(new Event(\"storage\"));\n\t}, []);\n\tconst value = useMemo(\n\t\t() => ({ accent, setAccent, swatches: ACCENT_SWATCHES }),\n\t\t[accent, setAccent],\n\t);\n\treturn <AccentContext.Provider value={value}>{children}</AccentContext.Provider>;\n}\n\nexport function useAccent() {\n\tconst ctx = useContext(AccentContext);\n\tif (!ctx) {\n\t\tthrow new Error(\"useAccent must be used within AccentProvider\");\n\t}\n\treturn ctx;\n}\n"],"mappings":";;;;AAkBA,IAAa,IAA2C;CACvD;EAAE,IAAI;EAAQ,OAAO;EAAQ,OAAO;EAAe,MAAM;EAAe,YAAY;CAAY;CAChG;EAAE,IAAI;EAAQ,OAAO;EAAQ,OAAO;EAAe,MAAM;EAAe,YAAY;CAAY;CAChG;EACC,IAAI;EACJ,OAAO;EACP,OAAO;EACP,MAAM;EACN,YAAY;CACb;CACA;EAAE,IAAI;EAAS,OAAO;EAAS,OAAO;EAAc,MAAM;EAAc,YAAY;CAAW;CAC/F;EACC,IAAI;EACJ,OAAO;EACP,OAAO;EACP,MAAM;EACN,YAAY;CACb;CACA;EAAE,IAAI;EAAQ,OAAO;EAAQ,OAAO;EAAe,MAAM;EAAe,YAAY;CAAY;CAChG;EACC,IAAI;EACJ,OAAO;EACP,OAAO;EACP,MAAM;EACN,YAAY;CACb;CACA;EACC,IAAI;EACJ,OAAO;EACP,OAAO;EACP,MAAM;EACN,YAAY;CACb;AACD,GAEa,IAAoB,QAC3B,IAAc,iBAQd,IAAgB,EAAyC,IAAI;AAEnE,SAAgB,EAAiB,GAA6C;CAC7E,OAAO,EAAgB,MAAM,MAAW,EAAO,OAAO,CAAE,KAAK,EAAgB;AAC9E;AAEA,SAAgB,EAAY,GAAY,IAAO,IAAO;CACrD,IAAM,IAAS,EAAiB,CAAE,GAC5B,IAAQ,IAAO,EAAO,OAAO,EAAO,OACpC,IAAO,SAAS;CAKtB,AAJA,EAAK,MAAM,YAAY,oBAAoB,CAAK,GAChD,EAAK,MAAM,YAAY,+BAA+B,EAAO,UAAU,GACvE,EAAK,MAAM,YAAY,iBAAiB,CAAK,GAC7C,EAAK,MAAM,YAAY,oBAAoB,CAAK,GAChD,EAAK,QAAQ,SAAS,EAAO;AAC9B;AAEA,SAAS,IAAqB;CAC7B,OAAO,EAAiB,OAAO,aAAa,QAAQ,CAAW,CAAC,CAAC,CAAC;AACnE;AAEA,SAAS,EAAU,GAA2B;CAE7C,OADA,OAAO,iBAAiB,WAAW,CAAa,SACnC,OAAO,oBAAoB,WAAW,CAAa;AACjE;AAEA,SAAS,IAAsB;CAC9B,OAAO,SAAS,gBAAgB,UAAU,SAAS,MAAM;AAC1D;AAEA,SAAgB,EAAe,EAAE,eAAqC;CACrE,IAAM,IAAS,EAAqB,GAAW,SAAkB,CAAiB;CAClF,QAAgB;EACf,EAAY,GAAQ,EAAW,CAAC;EAChC,IAAM,IAAW,IAAI,uBAAuB,EAAY,GAAQ,EAAW,CAAC,CAAC;EAE7E,OADA,EAAS,QAAQ,SAAS,iBAAiB;GAAE,YAAY;GAAM,iBAAiB,CAAC,OAAO;EAAE,CAAC,SAC9E,EAAS,WAAW;CAClC,GAAG,CAAC,CAAM,CAAC;CACX,IAAM,IAAY,GAAa,MAAe;EAC7C,IAAM,IAAO,EAAiB,CAAE,CAAC,CAAC;EAGlC,AAFA,OAAO,aAAa,QAAQ,GAAa,CAAI,GAC7C,EAAY,GAAM,EAAW,CAAC,GAC9B,OAAO,cAAc,IAAI,MAAM,SAAS,CAAC;CAC1C,GAAG,CAAC,CAAC,GACC,IAAQ,SACN;EAAE;EAAQ;EAAW,UAAU;CAAgB,IACtD,CAAC,GAAQ,CAAS,CACnB;CACA,OAAO,kBAAC,EAAc,UAAf;EAA+B;EAAQ;CAAiC,CAAA;AAChF;AAEA,SAAgB,IAAY;CAC3B,IAAM,IAAM,EAAW,CAAa;CACpC,IAAI,CAAC,GACJ,MAAU,MAAM,8CAA8C;CAE/D,OAAO;AACR"}

package/dist/styles/standalone.css

@@ -329,9 +329,6 @@
   .inset-0 {
     inset: 0px;
   }
-  .inset-\[-4px\] {
-    inset: -4px;
-  }
   .inset-x-0 {
     inset-inline: 0px;
   }
@@ -496,15 +493,9 @@
   .h-14 {
     height: calc(var(--spacing) * 14);
   }
-  .h-28 {
-    height: calc(var(--spacing) * 28);
-  }
   .h-36 {
     height: calc(var(--spacing) * 36);
   }
-  .h-72 {
-    height: calc(var(--spacing) * 72);
-  }
   .h-80 {
     height: calc(var(--spacing) * 80);
   }
@@ -595,9 +586,6 @@
   .w-64 {
     width: calc(var(--spacing) * 64);
   }
-  .w-72 {
-    width: calc(var(--spacing) * 72);
-  }
   .w-80 {
     width: calc(var(--spacing) * 80);
   }
@@ -773,6 +761,11 @@
     margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
     margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
   }
+  :where(.space-y-4 > :not(:last-child)) {
+    --tw-space-y-reverse: 0;
+    margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
+    margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
+  }
   .self-stretch {
     align-self: stretch;
   }
@@ -846,10 +839,6 @@
     border-style: var(--tw-border-style);
     border-width: 2px;
   }
-  .border-\[3px\] {
-    border-style: var(--tw-border-style);
-    border-width: 3px;
-  }
   .border-t {
     border-top-style: var(--tw-border-style);
     border-top-width: 1px;
@@ -883,9 +872,6 @@
   .border-transparent {
     border-color: transparent;
   }
-  .border-t-basalt-primary {
-    border-top-color: hsl(var(--basalt-primary));
-  }
   .border-t-transparent {
     border-top-color: transparent;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@nocoo/basalt",
-	"version": "2.0.0-rc.1",
+	"version": "2.0.0",
 	"type": "module",
 	"license": "MIT",
 	"repository": {