@astralui/core 0.1.7 → 0.1.9

package/dist/styles.css

@@ -44,11 +44,18 @@ button, input, optgroup, select, textarea { font-family: inherit; font-size: 100
   --astral-color-blue-5: #339af0;
   --astral-color-blue-6: #228be6;
   --astral-color-blue-7: #1c7ed6;
+  --astral-color-cyan-4: #3bc9db;
+  --astral-color-cyan-5: #22b8cf;
   --astral-color-cyan-6: #15aabf;
+  --astral-color-cyan-7: #1098ad;
   --astral-color-cyan-8: #0c8599;
   --astral-color-grape-6: #be4bdb;
   --astral-color-grape-7: #ae3ec9;
+  --astral-color-indigo-4: #748ffc;
+  --astral-color-indigo-5: #5c7cfa;
   --astral-color-indigo-6: #4c6ef5;
+  --astral-color-indigo-7: #4263eb;
+  --astral-color-indigo-8: #3b5bdb;
   --astral-color-gray-0: #f8f9fa;
   --astral-color-gray-1: #f1f3f5;
   --astral-color-gray-2: #e9ecef;
@@ -62,6 +69,11 @@ button, input, optgroup, select, textarea { font-family: inherit; font-size: 100
   --astral-color-green-7: #37b24d;
   --astral-color-green-8: #2f9e44;
   --astral-color-green-9: #2b8a3e;
+  --astral-color-lime-4: #a9e34b;
+  --astral-color-lime-5: #94d82d;
+  --astral-color-lime-6: #82c91e;
+  --astral-color-lime-7: #74b816;
+  --astral-color-lime-8: #66a80f;
   --astral-color-orange-5: #ff922b;
   --astral-color-orange-6: #fd7e14;
   --astral-color-orange-7: #f76707;
@@ -70,6 +82,11 @@ button, input, optgroup, select, textarea { font-family: inherit; font-size: 100
   --astral-color-red-6: #fa5252;
   --astral-color-red-7: #f03e3e;
   --astral-color-red-8: #e03131;
+  --astral-color-pink-4: #f783ac;
+  --astral-color-pink-5: #f06595;
+  --astral-color-pink-6: #e64980;
+  --astral-color-pink-7: #d6336c;
+  --astral-color-pink-8: #c2255c;
   --astral-color-teal-5: #20c997;
   --astral-color-teal-6: #12b886;
   --astral-color-teal-7: #0ca678;
@@ -900,3 +917,23 @@ button, input, optgroup, select, textarea { font-family: inherit; font-size: 100
 .au-search .clr { position: absolute; right: 8px; width: 20px; height: 20px; border: 0; background: none; color: var(--au-faint); cursor: pointer; border-radius: 6px; display: grid; place-items: center; }
 .au-search .clr:hover { color: var(--au-text); background: var(--au-line); }
 .au-search .clr svg { width: 13px; height: 13px; }
+
+
+/* ===== src/styles/collapse.css ===== */
+/* AstralUI collapsible - a folding panel that animates open AND closed via an
+   exact measured max-height. Render via <Collapsible title="...">...</Collapsible>. */
+.au-collapse { border: 1px solid var(--au-line); border-radius: 14px; background: var(--au-panel); box-shadow: var(--au-shadow); overflow: hidden; }
+.au-collapse-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 12px 15px; font: inherit; font-size: 13px; font-weight: 700; color: var(--au-text); background: none; border: 0; text-align: left; cursor: pointer; }
+.au-collapse-head:hover:not(:disabled) { background: var(--au-surface-2); }
+.au-collapse-head:disabled { opacity: .6; cursor: not-allowed; }
+.au-collapse-title { min-width: 0; }
+.au-collapse--open .au-collapse-head { border-bottom: 1px solid var(--au-line); }
+.au-collapse-chev { flex: 0 0 auto; color: var(--au-dim); transition: transform .2s ease; }
+.au-collapse--open .au-collapse-chev { transform: rotate(180deg); }
+/* The region animates height; the inner fades so content doesn't flash in fully formed. */
+.au-collapse-region { max-height: 0; overflow: hidden; transition: max-height .3s cubic-bezier(.4, 0, .2, 1); }
+.au-collapse-inner { padding: 14px; opacity: 0; transition: opacity .22s ease; }
+.au-collapse--open .au-collapse-inner { opacity: 1; }
+@media (prefers-reduced-motion: reduce) {
+  .au-collapse-region, .au-collapse-inner, .au-collapse-chev { transition: none; }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astralui/core",
-  "version": "0.1.7",
+  "version": "0.1.9",
   "description": "AstralUI - a self-contained, dependency-free React design system: theme engine (light/dark + per-brand theming), design tokens, and components (Modal, Drawer, Select, Menu, Toast, DateInput, PinInput, Spinner).",
   "license": "MIT",
   "author": "Unbounded Technologies",
@@ -32,6 +32,7 @@
   },
   "scripts": {
     "build": "tsup && node scripts/build-css.mjs",
+    "playground": "node scripts/build-playground.mjs",
     "dev": "tsup --watch",
     "typecheck": "tsc --noEmit",
     "prepublishOnly": "npm run build"
@@ -46,9 +47,9 @@
     "astralui"
   ],
   "peerDependencies": {
+    "@tabler/icons-react": ">=3",
     "react": ">=18",
-    "react-dom": ">=18",
-    "@tabler/icons-react": ">=3"
+    "react-dom": ">=18"
   },
   "dependencies": {
     "chroma-js": "^3.2.0"
@@ -58,6 +59,7 @@
     "@types/chroma-js": "^3.1.0",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
+    "esbuild": "^0.28.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "tsup": "^8.3.0",