@a4ui/core 0.24.1 → 0.24.2

package/README.md

@@ -206,6 +206,16 @@ import { ProductCard, CartSummary } from '@a4ui/core/commerce'
 import { DonutChart, Sparkline } from '@a4ui/core/charts'
 ```
 
+## Example pages
+
+Full-page templates built entirely with the components above — browse the whole
+gallery at **[a4ui.pages.dev/#/examples](https://a4ui.pages.dev/#/examples)**. Each
+one reskins under every theme.
+
+[![Boutique — a faceted product catalog with a filter sidebar, three switchable product-card styles, and a cart drawer](https://a4ui.pages.dev/showcase-boutique.png)](https://a4ui.pages.dev/#/examples/boutique)
+
+[![Showpiece — a product detail page with a gallery lightbox, price/coupon/financing block, a condition meter, and a spec sheet](https://a4ui.pages.dev/showcase-showpiece.png)](https://a4ui.pages.dev/#/examples/showpiece)
+
 ## Why A4ui
 
 |                         | **A4ui**                                           | Kobalte                | shadcn-solid                      | Hope UI                |

package/dist/commerce.js

@@ -471,7 +471,7 @@ function ze(e) {
   })();
 }
 A(["click"]);
-var Se = /* @__PURE__ */ v('<span class="text-muted-foreground line-through">'), ke = /* @__PURE__ */ v('<span class="inline-flex items-center gap-1 text-sm text-muted-foreground">As low as <!>/mo'), Ae = /* @__PURE__ */ v('<div><div class="flex flex-wrap items-center gap-2"><span>'), Me = /* @__PURE__ */ v('<span class="text-sm text-muted-foreground"> after code '), Pe = /* @__PURE__ */ v('<div class="flex flex-wrap items-center gap-2"><span class="inline-flex items-center gap-1 rounded-md border border-dashed border-primary/50 px-2 py-0.5 text-xs font-mono text-primary"> ');
+var Se = /* @__PURE__ */ v('<span class="text-muted-foreground line-through">'), ke = /* @__PURE__ */ v('<span class="inline-flex items-center gap-1 text-sm text-muted-foreground">As low as <!>/mo'), Ae = /* @__PURE__ */ v('<div><div class="flex flex-wrap items-center gap-2"><span>'), Me = /* @__PURE__ */ v('<span class="text-sm text-muted-foreground"> after code '), Pe = /* @__PURE__ */ v('<div class="flex flex-wrap items-center gap-2"><span class="inline-flex items-center gap-1 rounded-md border border-dashed border-primary/50 px-2 py-0.5 text-xs font-mono text-foreground"> ');
 const Te = {
   md: "text-xl",
   lg: "text-3xl"

package/dist/elements.css

@@ -22,7 +22,7 @@
   --primary: 217 91% 52%;
   --primary-foreground: 0 0% 100%;
   --accent: 199 89% 55%;
-  --accent-foreground: 0 0% 100%;
+  --accent-foreground: 199 45% 12%;
   --ring: 217 91% 52%;
   --destructive: 0 72% 52%;
   --destructive-foreground: 0 0% 100%;
@@ -58,7 +58,7 @@
   --primary: 217 91% 52%;
   --primary-foreground: 0 0% 100%;
   --accent: 199 89% 48%;
-  --accent-foreground: 0 0% 100%;
+  --accent-foreground: 199 45% 12%;
   --ring: 217 91% 52%;
   --destructive: 0 72% 50%;
   --destructive-foreground: 0 0% 100%;
@@ -3450,6 +3450,10 @@ html.calm .tile-glass {
   --tw-bg-opacity: 1;
   background-color: hsl(var(--primary) / var(--tw-bg-opacity, 1));
 }
+.data-\[checked\]\:text-primary-foreground[data-checked] {
+  --tw-text-opacity: 1;
+  color: hsl(var(--primary-foreground) / var(--tw-text-opacity, 1));
+}
 .data-\[pressed\]\:text-primary-foreground[data-pressed] {
   --tw-text-opacity: 1;
   color: hsl(var(--primary-foreground) / var(--tw-text-opacity, 1));
@@ -3458,10 +3462,6 @@ html.calm .tile-glass {
   --tw-text-opacity: 1;
   color: hsl(var(--foreground) / var(--tw-text-opacity, 1));
 }
-.data-\[selected\]\:text-primary-foreground[data-selected] {
-  --tw-text-opacity: 1;
-  color: hsl(var(--primary-foreground) / var(--tw-text-opacity, 1));
-}
 .data-\[disabled\]\:opacity-50[data-disabled] {
   opacity: 0.5;
 }

package/dist/full.css

@@ -22,7 +22,7 @@
   --primary: 217 91% 52%;
   --primary-foreground: 0 0% 100%;
   --accent: 199 89% 55%;
-  --accent-foreground: 0 0% 100%;
+  --accent-foreground: 199 45% 12%;
   --ring: 217 91% 52%;
   --destructive: 0 72% 52%;
   --destructive-foreground: 0 0% 100%;
@@ -58,7 +58,7 @@
   --primary: 217 91% 52%;
   --primary-foreground: 0 0% 100%;
   --accent: 199 89% 48%;
-  --accent-foreground: 0 0% 100%;
+  --accent-foreground: 199 45% 12%;
   --ring: 217 91% 52%;
   --destructive: 0 72% 50%;
   --destructive-foreground: 0 0% 100%;
@@ -3450,6 +3450,10 @@ html.calm .tile-glass {
   --tw-bg-opacity: 1;
   background-color: hsl(var(--primary) / var(--tw-bg-opacity, 1));
 }
+.data-\[checked\]\:text-primary-foreground[data-checked] {
+  --tw-text-opacity: 1;
+  color: hsl(var(--primary-foreground) / var(--tw-text-opacity, 1));
+}
 .data-\[pressed\]\:text-primary-foreground[data-pressed] {
   --tw-text-opacity: 1;
   color: hsl(var(--primary-foreground) / var(--tw-text-opacity, 1));
@@ -3458,10 +3462,6 @@ html.calm .tile-glass {
   --tw-text-opacity: 1;
   color: hsl(var(--foreground) / var(--tw-text-opacity, 1));
 }
-.data-\[selected\]\:text-primary-foreground[data-selected] {
-  --tw-text-opacity: 1;
-  color: hsl(var(--primary-foreground) / var(--tw-text-opacity, 1));
-}
 .data-\[disabled\]\:opacity-50[data-disabled] {
   opacity: 0.5;
 }

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export declare const A4UI_VERSION = "0.24.1";
+export declare const A4UI_VERSION = "0.24.2";
 export { cn } from './lib/cn';
 export { useTheme, toggleTheme, setTheme, storedTheme, applyTheme, toggled, type Theme } from './lib/theme';
 export { useEffects, isCalm, setEffects } from './lib/effects';

package/dist/index.js

@@ -2262,7 +2262,7 @@ function Hu(e) {
           get value() {
             return t.value;
           },
-          class: "relative z-10 flex cursor-pointer items-center px-3 py-1.5 text-sm font-medium text-muted-foreground transition-colors data-[selected]:text-primary-foreground",
+          class: "relative z-10 flex cursor-pointer items-center px-3 py-1.5 text-sm font-medium text-muted-foreground transition-colors data-[checked]:text-primary-foreground",
           get children() {
             return [o(Ie.ItemInput, {}), o(Ie.ItemLabel, {
               get children() {
@@ -6918,7 +6918,7 @@ const wd = [
     primary: "217 91% 52%",
     "primary-foreground": "0 0% 100%",
     accent: "199 89% 55%",
-    "accent-foreground": "0 0% 100%",
+    "accent-foreground": "199 45% 12%",
     ring: "217 91% 52%",
     destructive: "0 72% 52%",
     "destructive-foreground": "0 0% 100%"
@@ -6935,7 +6935,7 @@ const wd = [
     primary: "217 91% 52%",
     "primary-foreground": "0 0% 100%",
     accent: "199 89% 48%",
-    "accent-foreground": "0 0% 100%",
+    "accent-foreground": "199 45% 12%",
     ring: "217 91% 52%",
     destructive: "0 72% 50%",
     "destructive-foreground": "0 0% 100%"
@@ -7222,7 +7222,7 @@ function ff() {
     }
   Id(e && hr(e) || gt);
 }
-const mf = "0.24.1";
+const mf = "0.24.2";
 export {
   mf as A4UI_VERSION,
   du as Accordion,

package/dist/styles.css

@@ -21,7 +21,7 @@
   --primary: 217 91% 52%;
   --primary-foreground: 0 0% 100%;
   --accent: 199 89% 55%;
-  --accent-foreground: 0 0% 100%;
+  --accent-foreground: 199 45% 12%;
   --ring: 217 91% 52%;
   --destructive: 0 72% 52%;
   --destructive-foreground: 0 0% 100%;
@@ -57,7 +57,7 @@
   --primary: 217 91% 52%;
   --primary-foreground: 0 0% 100%;
   --accent: 199 89% 48%;
-  --accent-foreground: 0 0% 100%;
+  --accent-foreground: 199 45% 12%;
   --ring: 217 91% 52%;
   --destructive: 0 72% 50%;
   --destructive-foreground: 0 0% 100%;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@a4ui/core",
-  "version": "0.24.1",
+  "version": "0.24.2",
   "description": "A4ui — Spatial Glass design system & component library for SolidJS (Kobalte behavior + Tailwind glass tokens + motion).",
   "type": "module",
   "license": "MIT",

package/src/commerce/PriceBlock.tsx

@@ -110,7 +110,7 @@ export function PriceBlock(props: PriceBlockProps): JSX.Element {
       <Show when={props.coupon}>
         {(coupon) => (
           <div class="flex flex-wrap items-center gap-2">
-            <span class="inline-flex items-center gap-1 rounded-md border border-dashed border-primary/50 px-2 py-0.5 text-xs font-mono text-primary">
+            <span class="inline-flex items-center gap-1 rounded-md border border-dashed border-primary/50 px-2 py-0.5 text-xs font-mono text-foreground">
               {coupon().label ?? 'Coupon'} {coupon().code}
             </span>
             <Show when={coupon().amount !== undefined}>

package/src/index.ts

@@ -8,7 +8,7 @@
 //   import '@a4ui/core/styles.css'
 //   import { Button, Card, Modal } from '@a4ui/core'
 
-export const A4UI_VERSION = '0.24.1'
+export const A4UI_VERSION = '0.24.2'
 
 // Helpers (src/lib) — generic, framework-level utilities.
 export { cn } from './lib/cn'

package/src/themes/palettes.ts

@@ -82,7 +82,7 @@ export const space: ThemeDefinition = {
     primary: '217 91% 52%',
     'primary-foreground': '0 0% 100%',
     accent: '199 89% 55%',
-    'accent-foreground': '0 0% 100%',
+    'accent-foreground': '199 45% 12%',
     ring: '217 91% 52%',
     destructive: '0 72% 52%',
     'destructive-foreground': '0 0% 100%',
@@ -99,7 +99,7 @@ export const space: ThemeDefinition = {
     primary: '217 91% 52%',
     'primary-foreground': '0 0% 100%',
     accent: '199 89% 48%',
-    'accent-foreground': '0 0% 100%',
+    'accent-foreground': '199 45% 12%',
     ring: '217 91% 52%',
     destructive: '0 72% 50%',
     'destructive-foreground': '0 0% 100%',

package/src/ui/SegmentedControl.tsx

@@ -49,7 +49,7 @@ export function SegmentedControl(props: SegmentedControlProps): JSX.Element {
         {(option) => (
           <KSegmentedControl.Item
             value={option.value}
-            class="relative z-10 flex cursor-pointer items-center px-3 py-1.5 text-sm font-medium text-muted-foreground transition-colors data-[selected]:text-primary-foreground"
+            class="relative z-10 flex cursor-pointer items-center px-3 py-1.5 text-sm font-medium text-muted-foreground transition-colors data-[checked]:text-primary-foreground"
           >
             <KSegmentedControl.ItemInput />
             <KSegmentedControl.ItemLabel>{option.label}</KSegmentedControl.ItemLabel>