@sigx/zero-daisyui 0.8.0 → 0.9.0

package/dist/lynx/index.css

@@ -5993,6 +5993,104 @@
     --avatar-text: var(--text-lg);
 }
 
+.zx-avatar-group__root {
+    --avatar-group-text: var(--text-sm);
+    --avatar-group-ring: var(--color-primary);
+}
+
+.zx-avatar-group__root {
+    display: flex;
+    align-items: center;
+    vertical-align: middle;
+    isolation: isolate;
+}
+
+.zx-avatar-group__overflow {
+    position: relative;
+    display: inline-grid;
+    place-items: center;
+    box-sizing: border-box;
+    min-width: calc(var(--size-selector) * 10);
+    height: calc(var(--size-selector) * 10);
+    border-radius: 9999px;
+    box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--avatar-group-ring);
+    background: var(--color-neutral);
+    color: var(--color-neutral-content);
+    font-size: var(--avatar-group-text);
+    font-weight: var(--weight-semibold);
+    font-variant-numeric: tabular-nums;
+    white-space: nowrap;
+    user-select: none;
+}
+
+.zx-avatar-group__overflow.zx-a-size-xs {
+    min-width: calc(var(--size-selector) * 6);
+    height: calc(var(--size-selector) * 6);
+}
+
+.zx-avatar-group__overflow.zx-a-size-sm {
+    min-width: calc(var(--size-selector) * 8);
+    height: calc(var(--size-selector) * 8);
+}
+
+.zx-avatar-group__overflow.zx-a-size-lg {
+    min-width: calc(var(--size-selector) * 12);
+    height: calc(var(--size-selector) * 12);
+}
+
+.zx-avatar-group__overflow.zx-a-size-xl {
+    min-width: calc(var(--size-selector) * 16);
+    height: calc(var(--size-selector) * 16);
+}
+
+.zx-avatar-group__root.zx-a-color-primary {
+    --avatar-group-ring: var(--color-primary);
+}
+
+.zx-avatar-group__root.zx-a-color-secondary {
+    --avatar-group-ring: var(--color-secondary);
+}
+
+.zx-avatar-group__root.zx-a-color-accent {
+    --avatar-group-ring: var(--color-accent);
+}
+
+.zx-avatar-group__root.zx-a-color-neutral {
+    --avatar-group-ring: var(--color-neutral);
+}
+
+.zx-avatar-group__root.zx-a-color-info {
+    --avatar-group-ring: var(--color-info);
+}
+
+.zx-avatar-group__root.zx-a-color-success {
+    --avatar-group-ring: var(--color-success);
+}
+
+.zx-avatar-group__root.zx-a-color-warning {
+    --avatar-group-ring: var(--color-warning);
+}
+
+.zx-avatar-group__root.zx-a-color-error {
+    --avatar-group-ring: var(--color-error);
+}
+
+.zx-avatar-group__root.zx-a-size-xs {
+    --avatar-group-text: var(--text-xs);
+}
+
+.zx-avatar-group__root.zx-a-size-sm {
+    --avatar-group-text: var(--text-xs);
+}
+
+.zx-avatar-group__root.zx-a-size-lg {
+    --avatar-group-text: var(--text-md);
+}
+
+.zx-avatar-group__root.zx-a-size-xl {
+    --avatar-group-text: var(--text-lg);
+}
+
 .zx-toast__root {
     --toast-bg: var(--color-base-200);
     --toast-ink: var(--color-base-content);
@@ -8905,15 +9003,34 @@
     align-items: center;
     border: none;
     align-self: stretch;
+    background: var(--divider-ink);
 }
 
 .zx-divider__root.zx-o-horizontal {
     inline-size: 100%;
+    block-size: var(--border);
+}
+
+.zx-divider__root.zx-o-horizontal.zx-a-size-lg {
+    block-size: calc(var(--border) * 2);
+}
+
+.zx-divider__root.zx-o-horizontal.zx-a-size-xl {
+    block-size: calc(var(--border) * 3);
 }
 
 .zx-divider__root.zx-o-vertical {
     flex-direction: column;
     min-block-size: 1em;
+    inline-size: var(--border);
+}
+
+.zx-divider__root.zx-o-vertical.zx-a-size-lg {
+    inline-size: calc(var(--border) * 2);
+}
+
+.zx-divider__root.zx-o-vertical.zx-a-size-xl {
+    inline-size: calc(var(--border) * 3);
 }
 
 .zx-divider__label {

package/dist/lynx/manifest.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://signalxjs.github.io/zero/schemas/lynx-manifest.schema.json",
   "manifestVersion": 1,
-  "zeroVersion": "0.8.0",
+  "zeroVersion": "0.9.0",
   "name": "daisyui",
   "themes": [
     {
@@ -982,6 +982,28 @@
       },
       "mods": []
     },
+    "avatar-group": {
+      "color": [
+        "primary",
+        "secondary",
+        "accent",
+        "neutral",
+        "info",
+        "success",
+        "warning",
+        "error"
+      ],
+      "size": [
+        "xs",
+        "sm",
+        "lg",
+        "xl",
+        "md"
+      ],
+      "variant": [],
+      "axes": {},
+      "mods": []
+    },
     "toast": {
       "color": [
         "primary",
@@ -2030,6 +2052,11 @@
       "singlePart": false,
       "props": {}
     },
+    "avatar-group": {
+      "carrier": "root",
+      "singlePart": false,
+      "props": {}
+    },
     "toast": {
       "carrier": "root",
       "singlePart": false,
@@ -2262,7 +2289,7 @@
   "target": "lynx",
   "classGrammarVersion": 2,
   "capabilities": {
-    "translated": 74,
-    "dropped": 438
+    "translated": 76,
+    "dropped": 453
   }
 }

package/dist/manifest.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://signalxjs.github.io/zero/schemas/ds-manifest.schema.json",
   "manifestVersion": 1,
-  "zeroVersion": "0.8.0",
+  "zeroVersion": "0.9.0",
   "name": "daisyui",
   "themes": [
     {
@@ -982,6 +982,28 @@
       },
       "mods": []
     },
+    "avatar-group": {
+      "color": [
+        "primary",
+        "secondary",
+        "accent",
+        "neutral",
+        "info",
+        "success",
+        "warning",
+        "error"
+      ],
+      "size": [
+        "xs",
+        "sm",
+        "lg",
+        "xl",
+        "md"
+      ],
+      "variant": [],
+      "axes": {},
+      "mods": []
+    },
     "toast": {
       "color": [
         "primary",
@@ -2030,6 +2052,11 @@
       "singlePart": false,
       "props": {}
     },
+    "avatar-group": {
+      "carrier": "root",
+      "singlePart": false,
+      "props": {}
+    },
     "toast": {
       "carrier": "root",
       "singlePart": false,

package/dist/recipes.d.ts

@@ -76,6 +76,7 @@ export declare const accordion: RecipeInput;
 export declare const select: RecipeInput;
 export declare const button: RecipeInput;
 export declare const avatar: RecipeInput;
+export declare const avatarGroup: RecipeInput;
 /**
  * Toast presence is runtime-managed (see the SKILL's Toast section): plain
  * two-state transitions only — no `@starting-style`, no `allow-discrete`.

package/dist/recipes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"recipes.d.ts","sourceRoot":"","sources":["../src/recipes.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"recipes.d.ts","sourceRoot":"","sources":["../src/recipes.ts"],"names":[],"mappings":"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"}

package/dist/recipes.js

@@ -3501,6 +3501,98 @@ export const avatar = {
         },
     },
 };
+/**
+ * Avatar group (#297) — daisy's `avatar-group`: the faces overlap by a
+ * quarter, each already cut out by the avatar's own base-100 gap ring, and the
+ * "+N" chip is daisy's `avatar-placeholder` (neutral fill, neutral-content
+ * ink, a circle) wearing the same ring. The group's `size` borrows the
+ * avatar's own size step (`composes`), so a group sizes its faces without a
+ * prop on each, and an avatar's own `size` still wins. Colour is daisy's
+ * ring colour: it rings the chip, and it is borrowed by the avatars too, so
+ * one `color` on the group rings every face alike.
+ */
+const avatarGroupSteps = {
+    xs: ['calc(var(--size-selector) * 6)', 'var(--text-xs)'],
+    sm: ['calc(var(--size-selector) * 8)', 'var(--text-xs)'],
+    lg: ['calc(var(--size-selector) * 12)', 'var(--text-md)'],
+    xl: ['calc(var(--size-selector) * 16)', 'var(--text-lg)'],
+};
+export const avatarGroup = {
+    component: 'avatar-group',
+    tokens: {
+        '--avatar-group-size': 'calc(var(--size-selector) * 10)',
+        '--avatar-group-text': 'var(--text-sm)',
+        '--avatar-group-ring': 'var(--color-primary)',
+    },
+    parts: {
+        root: {
+            base: {
+                display: 'inline-flex',
+                alignItems: 'center',
+                verticalAlign: 'middle',
+                isolation: 'isolate',
+            },
+        },
+        overflow: {
+            base: {
+                // Positioned like the avatars, or it would paint under the
+                // face it overlaps.
+                position: 'relative',
+                display: 'inline-grid',
+                placeItems: 'center',
+                boxSizing: 'border-box',
+                minWidth: 'var(--avatar-group-size)',
+                height: 'var(--avatar-group-size)',
+                paddingInline: 'var(--space-2xs)',
+                marginInlineStart: 'calc(var(--avatar-group-size) * -0.25)',
+                borderRadius: '9999px',
+                boxShadow: '0 0 0 2px var(--color-base-100), 0 0 0 4px var(--avatar-group-ring)',
+                background: 'var(--color-neutral)',
+                color: 'var(--color-neutral-content)',
+                fontSize: 'var(--avatar-group-text)',
+                fontWeight: 'var(--weight-semibold)',
+                fontVariantNumeric: 'tabular-nums',
+                whiteSpace: 'nowrap',
+                userSelect: 'none',
+            },
+        },
+    },
+    composes: {
+        avatar: {
+            parts: {
+                root: {
+                    selectors: {
+                        '&:not(:first-child)': { marginInlineStart: 'calc(var(--avatar-group-size) * -0.25)' },
+                    },
+                },
+            },
+        },
+    },
+    compoundVariants: [
+        ...Object.keys(avatarGroupSteps).map((size) => ({
+            match: { size },
+            parts: {},
+            composes: { avatar: { axes: { size } } },
+        })),
+        ...ROLES.map((color) => ({
+            match: { color },
+            parts: {},
+            composes: { avatar: { axes: { color } } },
+        })),
+    ],
+    variants: {
+        color: Object.fromEntries(ROLES.map((c) => [c, { root: { base: {
+                        '--avatar-group-ring': `var(--color-${c})`,
+                    } } }])),
+        size: {
+            ...Object.fromEntries(Object.entries(avatarGroupSteps).map(([size, [box, text]]) => [size, { root: { base: {
+                            '--avatar-group-size': box, '--avatar-group-text': text,
+                        } } }])),
+            // `md` is the un-attributed render — the defaults in `tokens:`.
+            md: {},
+        },
+    },
+};
 /**
  * A toast whose indicator is rendered (#292): the grid grows a leading column
  * for the mark, and the text, action and close step one column along.
@@ -5402,6 +5494,25 @@ export const divider = {
             xl: { root: { base: { '--divider-thickness': 'calc(var(--border) * 3)' } } },
         },
     },
+    targets: {
+        lynx: {
+            parts: {
+                // Lynx drops the ::before/::after segments the rule is drawn
+                // with above, which left the lynx divider with no line and,
+                // since only those rules read `--divider-thickness`, no size
+                // ramp either (#375). There the root itself is the line, as
+                // it was before the segments (#356): filled with the ink and
+                // one thickness across.
+                root: {
+                    base: { background: 'var(--divider-ink)' },
+                    selectors: {
+                        '&[data-orientation="horizontal"]': { blockSize: 'var(--divider-thickness)' },
+                        '&[data-orientation="vertical"]': { inlineSize: 'var(--divider-thickness)' },
+                    },
+                },
+            },
+        },
+    },
 };
 // ── Loading (#314) ────────────────────────────────────────────────────────
 /**
@@ -7992,7 +8103,7 @@ export const diff = {
 };
 export const recipes = [
     tabs, collapsible, switchRecipe, dialog, popover, tooltip, hoverCard, menu, menubar,
-    field, fieldset, checkbox, checkboxGroup, radioGroup, progress, slider, accordion, select, button, avatar, toast, combobox,
+    field, fieldset, checkbox, checkboxGroup, radioGroup, progress, slider, accordion, select, button, avatar, avatarGroup, toast, combobox,
     toggle, toggleGroup, numberInput, ratingGroup, treeView, input, textarea,
     card, alert, emptyState, badge, divider, skeleton, spinner,
     kbd, status, indicator, stats, timeline, chat, chatLog, radialProgress, join,