@mindlogic-ai/logician-ui 4.0.0-alpha.9 → 5.0.0-alpha.0

package/dist/components/Tag/Tag.styles.js

@@ -1,140 +1,166 @@
 "use client";
 'use strict';
 
+var disabledControl = require('../../utils/disabledControl.js');
+var isDev = require('../../utils/isDev.js');
+
 /**
- * Tag styles using a two-dimensional variant system.
- *
- * Structure: tagColorPaletteStyles[colorPalette][variant]
- *
- * Uses semantic color tokens from the Golden Ratio color system.
+ * Colour per tone (5.0 BAZE tokens). `hoverBorder` is applied only when the
+ * tag is interactive (clickable / toggle).
  */
-const tagColorPaletteStyles = {
-    primary: {
-        soft: {
-            bgColor: 'primary.extralight',
-            borderColor: 'primary.light',
-            color: 'primary.dark',
-        },
-        solid: {
-            bgColor: 'blue.500',
-            borderColor: 'blue.500',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'primary.main',
-            color: 'primary.main',
-        },
-    },
-    secondary: {
-        soft: {
-            bgColor: 'secondary.extralight',
-            borderColor: 'secondary.light',
-            color: 'secondary.dark',
-        },
-        solid: {
-            bgColor: 'violet.500',
-            borderColor: 'violet.500',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'secondary.main',
-            color: 'secondary.main',
-        },
-    },
-    danger: {
-        soft: {
-            bgColor: 'danger.extralight',
-            borderColor: 'danger.light',
-            color: 'danger.dark',
-        },
-        solid: {
-            bgColor: 'rose.500',
-            borderColor: 'rose.500',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'danger.main',
-            color: 'danger.main',
-        },
+const tagToneStyles = {
+    neutral: {
+        bgColor: 'bg.muted',
+        color: 'fg.default',
+        hoverBorder: 'secondary.border',
     },
     success: {
-        soft: {
-            bgColor: 'success.extralight',
-            borderColor: 'success.light',
-            color: 'success.dark',
-        },
-        solid: {
-            bgColor: 'green.600',
-            borderColor: 'green.600',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'success.main',
-            color: 'success.main',
-        },
+        bgColor: 'success.bg',
+        color: 'success.fg',
+        hoverBorder: 'success.border',
     },
     warning: {
-        soft: {
-            bgColor: 'warning.extralight',
-            borderColor: 'warning.light',
-            color: 'warning.dark',
-        },
-        solid: {
-            bgColor: 'gold.500',
-            borderColor: 'gold.500',
-            color: 'gold.900', // dark text: white/gold.500 was 2.39:1; gold.900 = 6.73:1
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'warning.main',
-            color: 'warning.main',
-        },
+        bgColor: 'warning.bg',
+        color: 'warning.fg',
+        hoverBorder: 'warning.border',
     },
-    neutral: {
-        soft: {
-            // Flip surface + border with the mode so the fg.muted text stays legible
-            // in dark. Light values preserved (bg.muted → gray.100, border.default →
-            // gray.300).
-            bgColor: 'bg.muted',
-            borderColor: 'border.default',
-            color: 'fg.muted',
-        },
-        solid: {
-            bgColor: 'gray.800',
-            borderColor: 'gray.800',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'border.strong', // gray.500 / gray.900 (_dark)
-            color: 'fg.subtle',
-        },
+    danger: {
+        bgColor: 'danger.bg',
+        color: 'danger.fg',
+        hoverBorder: 'danger.border',
+    },
+    info: {
+        bgColor: 'info.bg',
+        color: 'info.fg',
+        hoverBorder: 'info.border',
     },
 };
-/**
- * Helper function to get tag styles for a given colorPalette and variant.
- */
-const getTagStyles = (colorPalette = 'neutral', variant = 'soft') => {
-    return tagColorPaletteStyles[colorPalette][variant];
-};
-/** All available color palettes */
-const tagColorPalettes = [
-    'primary',
-    'secondary',
-    'danger',
+/** Every 5.0 tone, in display order. */
+const tagTones = [
+    'neutral',
     'success',
     'warning',
-    'neutral',
+    'danger',
+    'info',
 ];
-/** All available variants */
-const tagVariants = ['soft', 'solid', 'outline'];
+/** Colour transition only — a focus ring or press must not lag. */
+const TAG_TRANSITION = {
+    transitionProperty: 'background-color, border-color, color',
+    transitionDuration: 'fast',
+    transitionTimingFunction: 'standard',
+};
+/**
+ * Resolve the colour styles for a tag. Precedence: `selected` > `category` >
+ * `tone`.
+ */
+const getTagStyles = ({ tone = 'neutral', selected = false, category, interactive = false, } = {}) => {
+    let colors;
+    if (selected) {
+        colors = {
+            bgColor: 'primary.main',
+            color: 'fg.onPrimary',
+            ...(interactive && {
+                _hover: { bgColor: 'primary.hover' },
+                _active: { bgColor: 'primary.active' },
+            }),
+        };
+    }
+    else if (category) {
+        colors = {
+            bgColor: `category.${category}.surface`,
+            color: 'fg.default',
+            ...(interactive && { _hover: { borderColor: 'secondary.border' } }),
+        };
+    }
+    else {
+        const { bgColor, color, hoverBorder } = tagToneStyles[tone] ?? tagToneStyles.neutral;
+        colors = {
+            bgColor,
+            color,
+            ...(interactive && { _hover: { borderColor: hoverBorder } }),
+        };
+    }
+    return {
+        borderColor: 'transparent',
+        ...colors,
+        ...TAG_TRANSITION,
+        cursor: interactive ? 'pointer' : undefined,
+        _disabled: { ...disabledControl.disabledControl, cursor: 'not-allowed' },
+    };
+};
+const PLAIN_PALETTES = new Set(['primary', 'secondary', 'neutral']);
+const STATUS_PALETTES = new Set(['danger', 'success', 'warning']);
+/**
+ * Map 4.x `colorPalette` × `variant` (or Chip's `colorScheme` × `variant`) to
+ * 5.0 Tag props. A missing palette / variant takes the 4.x default of the
+ * component it came from — Tag was `neutral` / `soft`, Chip `primary` / `soft`
+ * (Chip passes its own default in).
+ *
+ * | palette \ variant           | soft (or —)    | solid                  | outline                 |
+ * |-----------------------------|----------------|------------------------|-------------------------|
+ * | primary · secondary · neutral | neutral        | selected               | neutral                 |
+ * | danger · success · warning  | that tone      | that tone (needsHuman) | neutral (needsHuman)    |
+ * | anything else               | neutral (needsHuman, as does any unknown variant)                  |
+ *
+ * `neutral`/`secondary` × `solid` → `selected`, same as `primary`: 4.x
+ * call sites toggled `colorScheme={on ? 'primary' : 'neutral'}` or
+ * `variant={on ? 'solid' : 'soft'}`, and both arms must stay distinct.
+ * Selected here is the *look* only — it does not make the tag a toggle
+ * (no hover, no `aria-pressed`); only an explicit `selected` prop does.
+ */
+const mapLegacyTagProps = (colorPalette, variant) => {
+    const palette = colorPalette ?? 'neutral';
+    const v = variant ?? 'soft';
+    const plain = PLAIN_PALETTES.has(palette);
+    const status = STATUS_PALETTES.has(palette);
+    if (!plain && !status)
+        return { tone: 'neutral', needsHuman: true };
+    switch (v) {
+        case 'soft':
+            return status
+                ? { tone: palette, needsHuman: false }
+                : { tone: 'neutral', needsHuman: false };
+        case 'solid':
+            return status
+                ? { tone: palette, needsHuman: true }
+                : { tone: 'neutral', selected: true, needsHuman: false };
+        case 'outline':
+            return { tone: 'neutral', needsHuman: status };
+        default:
+            return { tone: 'neutral', needsHuman: true };
+    }
+};
+const warned = new Set();
+/**
+ * Warn once per (component, palette, variant) in development, naming the
+ * combination and what it now renders as. Exported for tests.
+ */
+const warnLegacyTagProps = (component, colorPalette, variant, resolved) => {
+    if (!isDev.isDev())
+        return;
+    const key = `${component}|${String(colorPalette)}|${String(variant)}`;
+    if (warned.has(key))
+        return;
+    warned.add(key);
+    const paletteProp = component === 'Chip' ? 'colorScheme' : 'colorPalette';
+    const to = resolved.selected
+        ? '<Tag selected>'
+        : resolved.tone === 'neutral'
+            ? '<Tag>'
+            : `<Tag tone="${resolved.tone}">`;
+    const lead = component === 'Chip'
+        ? '<Chip> is deprecated since 5.0 and will be removed in 6.0. '
+        : '';
+    console.warn(`[logician-ui] ${lead}<${component} ${paletteProp}="${String(colorPalette)}" variant="${String(variant)}"> uses the 4.x API, which 5.0 removed. ` +
+        `Rendering as ${to}.` +
+        (resolved.needsHuman
+            ? ' This combination has no exact 5.0 equivalent — please choose tone / selected / category by hand.'
+            : ' Replace the props with that.'));
+};
 
 exports.getTagStyles = getTagStyles;
-exports.tagColorPaletteStyles = tagColorPaletteStyles;
-exports.tagColorPalettes = tagColorPalettes;
-exports.tagVariants = tagVariants;
+exports.mapLegacyTagProps = mapLegacyTagProps;
+exports.tagToneStyles = tagToneStyles;
+exports.tagTones = tagTones;
+exports.warnLegacyTagProps = warnLegacyTagProps;
 //# sourceMappingURL=Tag.styles.js.map

package/dist/components/Tag/Tag.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.styles.js","sources":["../../../src/components/Tag/Tag.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
+{"version":3,"file":"Tag.styles.js","sources":["../../../src/components/Tag/Tag.styles.ts"],"sourcesContent":[null],"names":["disabledControl","isDev"],"mappings":"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"}

package/dist/components/Tag/Tag.styles.mjs

@@ -1,135 +1,160 @@
 "use client";
+import { disabledControl } from '../../utils/disabledControl.mjs';
+import { isDev } from '../../utils/isDev.mjs';
+
 /**
- * Tag styles using a two-dimensional variant system.
- *
- * Structure: tagColorPaletteStyles[colorPalette][variant]
- *
- * Uses semantic color tokens from the Golden Ratio color system.
+ * Colour per tone (5.0 BAZE tokens). `hoverBorder` is applied only when the
+ * tag is interactive (clickable / toggle).
  */
-const tagColorPaletteStyles = {
-    primary: {
-        soft: {
-            bgColor: 'primary.extralight',
-            borderColor: 'primary.light',
-            color: 'primary.dark',
-        },
-        solid: {
-            bgColor: 'blue.500',
-            borderColor: 'blue.500',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'primary.main',
-            color: 'primary.main',
-        },
-    },
-    secondary: {
-        soft: {
-            bgColor: 'secondary.extralight',
-            borderColor: 'secondary.light',
-            color: 'secondary.dark',
-        },
-        solid: {
-            bgColor: 'violet.500',
-            borderColor: 'violet.500',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'secondary.main',
-            color: 'secondary.main',
-        },
-    },
-    danger: {
-        soft: {
-            bgColor: 'danger.extralight',
-            borderColor: 'danger.light',
-            color: 'danger.dark',
-        },
-        solid: {
-            bgColor: 'rose.500',
-            borderColor: 'rose.500',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'danger.main',
-            color: 'danger.main',
-        },
+const tagToneStyles = {
+    neutral: {
+        bgColor: 'bg.muted',
+        color: 'fg.default',
+        hoverBorder: 'secondary.border',
     },
     success: {
-        soft: {
-            bgColor: 'success.extralight',
-            borderColor: 'success.light',
-            color: 'success.dark',
-        },
-        solid: {
-            bgColor: 'green.600',
-            borderColor: 'green.600',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'success.main',
-            color: 'success.main',
-        },
+        bgColor: 'success.bg',
+        color: 'success.fg',
+        hoverBorder: 'success.border',
     },
     warning: {
-        soft: {
-            bgColor: 'warning.extralight',
-            borderColor: 'warning.light',
-            color: 'warning.dark',
-        },
-        solid: {
-            bgColor: 'gold.500',
-            borderColor: 'gold.500',
-            color: 'gold.900', // dark text: white/gold.500 was 2.39:1; gold.900 = 6.73:1
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'warning.main',
-            color: 'warning.main',
-        },
+        bgColor: 'warning.bg',
+        color: 'warning.fg',
+        hoverBorder: 'warning.border',
     },
-    neutral: {
-        soft: {
-            // Flip surface + border with the mode so the fg.muted text stays legible
-            // in dark. Light values preserved (bg.muted → gray.100, border.default →
-            // gray.300).
-            bgColor: 'bg.muted',
-            borderColor: 'border.default',
-            color: 'fg.muted',
-        },
-        solid: {
-            bgColor: 'gray.800',
-            borderColor: 'gray.800',
-            color: 'white',
-        },
-        outline: {
-            bgColor: 'transparent',
-            borderColor: 'border.strong', // gray.500 / gray.900 (_dark)
-            color: 'fg.subtle',
-        },
+    danger: {
+        bgColor: 'danger.bg',
+        color: 'danger.fg',
+        hoverBorder: 'danger.border',
+    },
+    info: {
+        bgColor: 'info.bg',
+        color: 'info.fg',
+        hoverBorder: 'info.border',
     },
 };
-/**
- * Helper function to get tag styles for a given colorPalette and variant.
- */
-const getTagStyles = (colorPalette = 'neutral', variant = 'soft') => {
-    return tagColorPaletteStyles[colorPalette][variant];
-};
-/** All available color palettes */
-const tagColorPalettes = [
-    'primary',
-    'secondary',
-    'danger',
+/** Every 5.0 tone, in display order. */
+const tagTones = [
+    'neutral',
     'success',
     'warning',
-    'neutral',
+    'danger',
+    'info',
 ];
-/** All available variants */
-const tagVariants = ['soft', 'solid', 'outline'];
+/** Colour transition only — a focus ring or press must not lag. */
+const TAG_TRANSITION = {
+    transitionProperty: 'background-color, border-color, color',
+    transitionDuration: 'fast',
+    transitionTimingFunction: 'standard',
+};
+/**
+ * Resolve the colour styles for a tag. Precedence: `selected` > `category` >
+ * `tone`.
+ */
+const getTagStyles = ({ tone = 'neutral', selected = false, category, interactive = false, } = {}) => {
+    let colors;
+    if (selected) {
+        colors = {
+            bgColor: 'primary.main',
+            color: 'fg.onPrimary',
+            ...(interactive && {
+                _hover: { bgColor: 'primary.hover' },
+                _active: { bgColor: 'primary.active' },
+            }),
+        };
+    }
+    else if (category) {
+        colors = {
+            bgColor: `category.${category}.surface`,
+            color: 'fg.default',
+            ...(interactive && { _hover: { borderColor: 'secondary.border' } }),
+        };
+    }
+    else {
+        const { bgColor, color, hoverBorder } = tagToneStyles[tone] ?? tagToneStyles.neutral;
+        colors = {
+            bgColor,
+            color,
+            ...(interactive && { _hover: { borderColor: hoverBorder } }),
+        };
+    }
+    return {
+        borderColor: 'transparent',
+        ...colors,
+        ...TAG_TRANSITION,
+        cursor: interactive ? 'pointer' : undefined,
+        _disabled: { ...disabledControl, cursor: 'not-allowed' },
+    };
+};
+const PLAIN_PALETTES = new Set(['primary', 'secondary', 'neutral']);
+const STATUS_PALETTES = new Set(['danger', 'success', 'warning']);
+/**
+ * Map 4.x `colorPalette` × `variant` (or Chip's `colorScheme` × `variant`) to
+ * 5.0 Tag props. A missing palette / variant takes the 4.x default of the
+ * component it came from — Tag was `neutral` / `soft`, Chip `primary` / `soft`
+ * (Chip passes its own default in).
+ *
+ * | palette \ variant           | soft (or —)    | solid                  | outline                 |
+ * |-----------------------------|----------------|------------------------|-------------------------|
+ * | primary · secondary · neutral | neutral        | selected               | neutral                 |
+ * | danger · success · warning  | that tone      | that tone (needsHuman) | neutral (needsHuman)    |
+ * | anything else               | neutral (needsHuman, as does any unknown variant)                  |
+ *
+ * `neutral`/`secondary` × `solid` → `selected`, same as `primary`: 4.x
+ * call sites toggled `colorScheme={on ? 'primary' : 'neutral'}` or
+ * `variant={on ? 'solid' : 'soft'}`, and both arms must stay distinct.
+ * Selected here is the *look* only — it does not make the tag a toggle
+ * (no hover, no `aria-pressed`); only an explicit `selected` prop does.
+ */
+const mapLegacyTagProps = (colorPalette, variant) => {
+    const palette = colorPalette ?? 'neutral';
+    const v = variant ?? 'soft';
+    const plain = PLAIN_PALETTES.has(palette);
+    const status = STATUS_PALETTES.has(palette);
+    if (!plain && !status)
+        return { tone: 'neutral', needsHuman: true };
+    switch (v) {
+        case 'soft':
+            return status
+                ? { tone: palette, needsHuman: false }
+                : { tone: 'neutral', needsHuman: false };
+        case 'solid':
+            return status
+                ? { tone: palette, needsHuman: true }
+                : { tone: 'neutral', selected: true, needsHuman: false };
+        case 'outline':
+            return { tone: 'neutral', needsHuman: status };
+        default:
+            return { tone: 'neutral', needsHuman: true };
+    }
+};
+const warned = new Set();
+/**
+ * Warn once per (component, palette, variant) in development, naming the
+ * combination and what it now renders as. Exported for tests.
+ */
+const warnLegacyTagProps = (component, colorPalette, variant, resolved) => {
+    if (!isDev())
+        return;
+    const key = `${component}|${String(colorPalette)}|${String(variant)}`;
+    if (warned.has(key))
+        return;
+    warned.add(key);
+    const paletteProp = component === 'Chip' ? 'colorScheme' : 'colorPalette';
+    const to = resolved.selected
+        ? '<Tag selected>'
+        : resolved.tone === 'neutral'
+            ? '<Tag>'
+            : `<Tag tone="${resolved.tone}">`;
+    const lead = component === 'Chip'
+        ? '<Chip> is deprecated since 5.0 and will be removed in 6.0. '
+        : '';
+    console.warn(`[logician-ui] ${lead}<${component} ${paletteProp}="${String(colorPalette)}" variant="${String(variant)}"> uses the 4.x API, which 5.0 removed. ` +
+        `Rendering as ${to}.` +
+        (resolved.needsHuman
+            ? ' This combination has no exact 5.0 equivalent — please choose tone / selected / category by hand.'
+            : ' Replace the props with that.'));
+};
 
-export { getTagStyles, tagColorPaletteStyles, tagColorPalettes, tagVariants };
+export { getTagStyles, mapLegacyTagProps, tagToneStyles, tagTones, warnLegacyTagProps };
 //# sourceMappingURL=Tag.styles.mjs.map

package/dist/components/Tag/Tag.styles.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.styles.mjs","sources":["../../../src/components/Tag/Tag.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
+{"version":3,"file":"Tag.styles.mjs","sources":["../../../src/components/Tag/Tag.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}