@orion-ds/react 4.2.11 → 4.2.13

package/dist/index97.mjs

@@ -1,33 +1,157 @@
-const t = "_container_1h4tg_12", e = "_disabled_1h4tg_18", _ = "_labelWrapper_1h4tg_26", r = "_input_1h4tg_43", s = "_track_1h4tg_55", o = "_thumb_1h4tg_79", n = "_sm_1h4tg_95", a = "_md_1h4tg_107", l = "_lg_1h4tg_119", c = "_error_1h4tg_209", g = "_label_1h4tg_26", h = "_required_1h4tg_244", d = "_helperText_1h4tg_250", p = "_errorMessage_1h4tg_268", b = {
-  container: t,
-  disabled: e,
-  labelWrapper: _,
-  input: r,
-  track: s,
-  thumb: o,
-  sm: n,
-  md: a,
-  lg: l,
-  error: c,
-  label: g,
-  required: h,
-  helperText: d,
-  errorMessage: p
+const r = {
+  theme: "light",
+  semantic: {
+    surface: {
+      base: "{color.neutral.0}",
+      subtle: "{color.neutral.50}",
+      layer: "{color.neutral.100}",
+      primary: "{color.neutral.100}",
+      secondary: "{color.neutral.50}",
+      glass: "color-mix(in srgb, {color.neutral.0} 70%, transparent)",
+      sunken: "color-mix(in srgb, {color.neutral.0} 40%, transparent)",
+      overlay: "color-mix(in srgb, {color.neutral.1000} 50%, transparent)"
+    },
+    text: {
+      primary: "{color.neutral.900}",
+      secondary: "{color.neutral.500}",
+      tertiary: "{color.neutral.400}",
+      inverse: "{color.neutral.0}",
+      brand: "{color.brand.500}",
+      "on-brand": {
+        primary: "{color.neutral.0}",
+        secondary: "color-mix(in srgb, {color.neutral.0} 90%, transparent)",
+        tertiary: "color-mix(in srgb, {color.neutral.0} 70%, transparent)"
+      }
+    },
+    border: {
+      subtle: "{color.neutral.200}",
+      strong: "{color.neutral.300}",
+      interactive: "{color.brand.500}"
+    },
+    interactive: {
+      primary: {
+        default: "{color.brand.500}",
+        hover: "{color.brand.700}",
+        text: "{color.neutral.0}"
+      },
+      secondary: {
+        default: "{color.neutral.100}",
+        hover: "{color.neutral.200}",
+        text: "{color.neutral.900}"
+      },
+      ghost: {
+        hover: "color-mix(in srgb, {color.neutral.1000} 5%, transparent)"
+      }
+    },
+    status: {
+      error: "{color.error.500}",
+      success: "{color.success.500}",
+      warning: "{color.warning.500}",
+      info: "{color.info.500}"
+    },
+    soft: {
+      brand: "color-mix(in srgb, {color.brand.500} 10%, transparent)",
+      "brand-hover": "color-mix(in srgb, {color.brand.500} 20%, transparent)",
+      success: "color-mix(in srgb, {color.success.500} 10%, transparent)",
+      error: "color-mix(in srgb, {color.error.500} 10%, transparent)",
+      warning: "color-mix(in srgb, {color.warning.500} 10%, transparent)",
+      info: "color-mix(in srgb, {color.info.500} 10%, transparent)"
+    },
+    focus: {
+      ring: "0 0 0 3px color-mix(in srgb, {color.brand.500} 40%, transparent)"
+    },
+    gradient: {
+      start: "{color.brand.400}",
+      end: "{color.brand.600}"
+    },
+    chart: {
+      1: "{color.brand.500}",
+      2: "{color.brand.300}",
+      3: "{color.brand.700}",
+      4: "{color.success.500}",
+      5: "{color.warning.500}"
+    }
+  }
+}, o = {
+  theme: "dark",
+  semantic: {
+    surface: {
+      base: "{color.neutral.900}",
+      subtle: "{color.neutral.950}",
+      layer: "{color.neutral.900}",
+      primary: "{color.neutral.900}",
+      secondary: "{color.neutral.900}",
+      glass: "color-mix(in srgb, {color.neutral.950} 60%, transparent)",
+      sunken: "color-mix(in srgb, {color.neutral.950} 40%, transparent)",
+      overlay: "color-mix(in srgb, {color.neutral.1000} 70%, transparent)"
+    },
+    text: {
+      primary: "{color.neutral.50}",
+      secondary: "{color.neutral.400}",
+      tertiary: "{color.neutral.600}",
+      inverse: "{color.neutral.950}",
+      brand: "{color.brand.400}",
+      "on-brand": {
+        primary: "{color.neutral.0}",
+        secondary: "color-mix(in srgb, {color.neutral.0} 90%, transparent)",
+        tertiary: "color-mix(in srgb, {color.neutral.0} 70%, transparent)"
+      }
+    },
+    border: {
+      subtle: "{color.neutral.800}",
+      strong: "{color.neutral.700}",
+      interactive: "{color.brand.500}"
+    },
+    interactive: {
+      primary: {
+        default: "{color.brand.500}",
+        hover: "{color.brand.400}",
+        text: "{color.neutral.900}"
+      },
+      secondary: {
+        default: "{color.neutral.800}",
+        hover: "{color.neutral.700}",
+        text: "{color.neutral.50}"
+      },
+      ghost: {
+        hover: "color-mix(in srgb, {color.neutral.0} 10%, transparent)"
+      }
+    },
+    status: {
+      error: "{color.error.500}",
+      success: "{color.success.500}",
+      warning: "{color.warning.500}",
+      info: "{color.info.500}"
+    },
+    soft: {
+      brand: "color-mix(in srgb, {color.brand.500} 15%, transparent)",
+      "brand-hover": "color-mix(in srgb, {color.brand.500} 25%, transparent)",
+      success: "color-mix(in srgb, {color.success.500} 15%, transparent)",
+      error: "color-mix(in srgb, {color.error.500} 15%, transparent)",
+      warning: "color-mix(in srgb, {color.warning.500} 15%, transparent)",
+      info: "color-mix(in srgb, {color.info.500} 15%, transparent)"
+    },
+    focus: {
+      ring: "0 0 0 3px color-mix(in srgb, {color.brand.500} 50%, transparent)"
+    },
+    gradient: {
+      start: "{color.brand.400}",
+      end: "{color.brand.600}"
+    },
+    chart: {
+      1: "{color.brand.400}",
+      2: "{color.brand.200}",
+      3: "{color.brand.600}",
+      4: "{color.success.500}",
+      5: "{color.warning.500}"
+    }
+  }
+}, n = {
+  light: r,
+  dark: o
 };
 export {
-  t as container,
-  b as default,
-  e as disabled,
-  c as error,
-  p as errorMessage,
-  d as helperText,
-  r as input,
-  g as label,
-  _ as labelWrapper,
-  l as lg,
-  a as md,
-  h as required,
-  n as sm,
-  o as thumb,
-  s as track
+  o as darkTheme,
+  r as lightTheme,
+  n as themes
 };

package/dist/index98.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r={theme:"light",semantic:{surface:{base:"{color.neutral.0}",subtle:"{color.neutral.50}",layer:"{color.neutral.100}",primary:"{color.neutral.100}",secondary:"{color.neutral.50}",glass:"color-mix(in srgb, {color.neutral.0} 70%, transparent)",sunken:"color-mix(in srgb, {color.neutral.0} 40%, transparent)",overlay:"color-mix(in srgb, {color.neutral.1000} 50%, transparent)"},text:{primary:"{color.neutral.900}",secondary:"{color.neutral.500}",tertiary:"{color.neutral.400}",inverse:"{color.neutral.0}",brand:"{color.brand.500}","on-brand":{primary:"{color.neutral.0}",secondary:"color-mix(in srgb, {color.neutral.0} 90%, transparent)",tertiary:"color-mix(in srgb, {color.neutral.0} 70%, transparent)"}},border:{subtle:"{color.neutral.200}",strong:"{color.neutral.300}",interactive:"{color.brand.500}"},interactive:{primary:{default:"{color.brand.500}",hover:"{color.brand.700}",text:"{color.neutral.0}"},secondary:{default:"{color.neutral.100}",hover:"{color.neutral.200}",text:"{color.neutral.900}"},ghost:{hover:"color-mix(in srgb, {color.neutral.1000} 5%, transparent)"}},status:{error:"{color.error.500}",success:"{color.success.500}",warning:"{color.warning.500}",info:"{color.info.500}"},soft:{brand:"color-mix(in srgb, {color.brand.500} 10%, transparent)","brand-hover":"color-mix(in srgb, {color.brand.500} 20%, transparent)",success:"color-mix(in srgb, {color.success.500} 10%, transparent)",error:"color-mix(in srgb, {color.error.500} 10%, transparent)",warning:"color-mix(in srgb, {color.warning.500} 10%, transparent)",info:"color-mix(in srgb, {color.info.500} 10%, transparent)"},focus:{ring:"0 0 0 3px color-mix(in srgb, {color.brand.500} 40%, transparent)"},gradient:{start:"{color.brand.400}",end:"{color.brand.600}"},chart:{1:"{color.brand.500}",2:"{color.brand.300}",3:"{color.brand.700}",4:"{color.success.500}",5:"{color.warning.500}"}}},o={theme:"dark",semantic:{surface:{base:"{color.neutral.900}",subtle:"{color.neutral.950}",layer:"{color.neutral.900}",primary:"{color.neutral.900}",secondary:"{color.neutral.900}",glass:"color-mix(in srgb, {color.neutral.950} 60%, transparent)",sunken:"color-mix(in srgb, {color.neutral.950} 40%, transparent)",overlay:"color-mix(in srgb, {color.neutral.1000} 70%, transparent)"},text:{primary:"{color.neutral.50}",secondary:"{color.neutral.400}",tertiary:"{color.neutral.600}",inverse:"{color.neutral.950}",brand:"{color.brand.400}","on-brand":{primary:"{color.neutral.0}",secondary:"color-mix(in srgb, {color.neutral.0} 90%, transparent)",tertiary:"color-mix(in srgb, {color.neutral.0} 70%, transparent)"}},border:{subtle:"{color.neutral.800}",strong:"{color.neutral.700}",interactive:"{color.brand.500}"},interactive:{primary:{default:"{color.brand.500}",hover:"{color.brand.400}",text:"{color.neutral.900}"},secondary:{default:"{color.neutral.800}",hover:"{color.neutral.700}",text:"{color.neutral.50}"},ghost:{hover:"color-mix(in srgb, {color.neutral.0} 10%, transparent)"}},status:{error:"{color.error.500}",success:"{color.success.500}",warning:"{color.warning.500}",info:"{color.info.500}"},soft:{brand:"color-mix(in srgb, {color.brand.500} 15%, transparent)","brand-hover":"color-mix(in srgb, {color.brand.500} 25%, transparent)",success:"color-mix(in srgb, {color.success.500} 15%, transparent)",error:"color-mix(in srgb, {color.error.500} 15%, transparent)",warning:"color-mix(in srgb, {color.warning.500} 15%, transparent)",info:"color-mix(in srgb, {color.info.500} 15%, transparent)"},focus:{ring:"0 0 0 3px color-mix(in srgb, {color.brand.500} 50%, transparent)"},gradient:{start:"{color.brand.400}",end:"{color.brand.600}"},chart:{1:"{color.brand.400}",2:"{color.brand.200}",3:"{color.brand.600}",4:"{color.success.500}",5:"{color.warning.500}"}}},n={light:r,dark:o};exports.darkTheme=o;exports.lightTheme=r;exports.themes=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r={orion:{name:"Orion",description:"Default brand - Orion Blue, professional rounded corners",accent:{primary:"{color.brand.orion.500}",light:"{color.brand.orion.100}",dark:"{color.brand.orion.900}"},typography:{primary:"Libre Baskerville",secondary:"Inter",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.md}",radiusContainer:"{radius.lg}",buttonStyle:"pill"},semantic:{light:{interactivePrimary:"{color.brand.orion.500}",interactivePrimaryHover:"{color.brand.orion.700}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.orion.500}",interactivePrimaryHover:"{color.brand.orion.400}",interactivePrimaryText:"{color.neutral.0}"}},usage:{html:'<html data-theme="dark">',css:"/* No additional CSS needed - default */",attribute:null}},deepblue:{name:"Deepblue",description:"Deepblue brand - Deep Blue with Work Sans typography",accent:{primary:"{color.brand.deepblue.500}",light:"{color.brand.deepblue.100}",dark:"{color.brand.deepblue.800}"},typography:{primary:"Work Sans",secondary:"Work Sans",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.md}",radiusContainer:"{radius.lg}",buttonStyle:"rounded"},semantic:{light:{interactivePrimary:"{color.brand.deepblue.500}",interactivePrimaryHover:"{color.brand.deepblue.700}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.deepblue.500}",interactivePrimaryHover:"{color.brand.deepblue.400}",interactivePrimaryText:"{color.neutral.900}"}},usage:{html:'<html data-theme="dark" data-brand="deepblue">',css:'/* Included in theme.css via [data-brand="deepblue"] */',attribute:"deepblue"}},red:{name:"Red",description:"Red brand - Red with Poppins typography and pill buttons",accent:{primary:"{color.brand.red.500}",light:"{color.brand.red.100}",dark:"{color.brand.red.900}"},typography:{primary:"Poppins",secondary:"Inter",mono:"JetBrains Mono"},geometry:{radiusControl:"var(--radius-lg)",radiusContainer:"{radius.lg}",buttonStyle:"pill"},semantic:{light:{interactivePrimary:"{color.brand.red.500}",interactivePrimaryHover:"{color.brand.red.600}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.red.500}",interactivePrimaryHover:"{color.brand.red.400}",interactivePrimaryText:"{color.neutral.0}"}},usage:{html:'<html data-theme="dark" data-brand="red">',css:'/* Included in theme.css via [data-brand="red"] */',attribute:"red"}},orange:{name:"Orange",description:"Orange brand - Red-Orange with pill buttons",accent:{primary:"{color.brand.orange.500}",light:"{color.brand.orange.100}",dark:"{color.brand.orange.900}"},typography:{primary:"DM Sans",secondary:"Inter",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.full}",radiusContainer:"{radius.lg}",buttonStyle:"pill"},semantic:{light:{interactivePrimary:"{color.brand.orange.500}",interactivePrimaryHover:"{color.brand.orange.700}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.orange.500}",interactivePrimaryHover:"{color.brand.orange.400}",interactivePrimaryText:"{color.neutral.0}"}},usage:{html:'<html data-theme="dark" data-brand="orange">',css:'/* Included in theme.css via [data-brand="orange"] */',attribute:"orange"}},ember:{name:"Ember",description:"Ember brand — Orange accent with dark neutral buttons and rectangular geometry",accent:{primary:"{color.brand.orange.500}",light:"{color.brand.orange.100}",dark:"{color.brand.orange.900}"},typography:{primary:"DM Sans",secondary:"Inter",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.md}",radiusContainer:"{radius.xl}",buttonStyle:"rounded"},semantic:{light:{interactivePrimary:"{color.neutral.900}",interactivePrimaryHover:"{color.neutral.700}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.neutral.100}",interactivePrimaryHover:"{color.neutral.0}",interactivePrimaryText:"{color.neutral.900}"}},usage:{html:'<html data-theme="light|dark" data-brand="ember">',css:'/* Included in theme.css via [data-brand="ember"] */',attribute:"ember"}},lemon:{name:"Lemon",description:"Lemon brand - Bright lime green with Anton typography and highly rounded design",accent:{primary:"{color.brand.lemon.600}",light:"{color.brand.lemon.100}",dark:"{color.brand.lemon.900}"},typography:{primary:"Anton",secondary:"Work Sans",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.lg}",radiusContainer:"{radius.lg}",buttonStyle:"pill"},semantic:{light:{interactivePrimary:"{color.brand.lemon.700}",interactivePrimaryHover:"{color.brand.lemon.800}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.lemon.500}",interactivePrimaryHover:"{color.brand.lemon.600}",interactivePrimaryText:"{color.neutral.900}"}},usage:{html:'<html data-theme="dark" data-brand="lemon">',css:'/* Included in theme.css via [data-brand="lemon"] */',attribute:"lemon"}}};exports.brands=r;

package/dist/index98.mjs

@@ -1,157 +1,221 @@
 const r = {
-  theme: "light",
-  semantic: {
-    surface: {
-      base: "{color.neutral.0}",
-      subtle: "{color.neutral.50}",
-      layer: "{color.neutral.100}",
-      primary: "{color.neutral.100}",
-      secondary: "{color.neutral.50}",
-      glass: "color-mix(in srgb, {color.neutral.0} 70%, transparent)",
-      sunken: "color-mix(in srgb, {color.neutral.0} 40%, transparent)",
-      overlay: "color-mix(in srgb, {color.neutral.1000} 50%, transparent)"
-    },
-    text: {
-      primary: "{color.neutral.900}",
-      secondary: "{color.neutral.500}",
-      tertiary: "{color.neutral.400}",
-      inverse: "{color.neutral.0}",
-      brand: "{color.brand.500}",
-      "on-brand": {
-        primary: "{color.neutral.0}",
-        secondary: "color-mix(in srgb, {color.neutral.0} 90%, transparent)",
-        tertiary: "color-mix(in srgb, {color.neutral.0} 70%, transparent)"
+  orion: {
+    name: "Orion",
+    description: "Default brand - Orion Blue, professional rounded corners",
+    accent: {
+      primary: "{color.brand.orion.500}",
+      light: "{color.brand.orion.100}",
+      dark: "{color.brand.orion.900}"
+    },
+    typography: {
+      primary: "Libre Baskerville",
+      secondary: "Inter",
+      mono: "JetBrains Mono"
+    },
+    geometry: {
+      radiusControl: "{radius.md}",
+      radiusContainer: "{radius.lg}",
+      buttonStyle: "pill"
+    },
+    semantic: {
+      light: {
+        interactivePrimary: "{color.brand.orion.500}",
+        interactivePrimaryHover: "{color.brand.orion.700}",
+        interactivePrimaryText: "{color.neutral.0}"
+      },
+      dark: {
+        interactivePrimary: "{color.brand.orion.500}",
+        interactivePrimaryHover: "{color.brand.orion.400}",
+        interactivePrimaryText: "{color.neutral.0}"
       }
     },
-    border: {
-      subtle: "{color.neutral.200}",
-      strong: "{color.neutral.300}",
-      interactive: "{color.brand.500}"
-    },
-    interactive: {
-      primary: {
-        default: "{color.brand.500}",
-        hover: "{color.brand.700}",
-        text: "{color.neutral.0}"
-      },
-      secondary: {
-        default: "{color.neutral.100}",
-        hover: "{color.neutral.200}",
-        text: "{color.neutral.900}"
+    usage: {
+      html: '<html data-theme="dark">',
+      css: "/* No additional CSS needed - default */",
+      attribute: null
+    }
+  },
+  deepblue: {
+    name: "Deepblue",
+    description: "Deepblue brand - Deep Blue with Work Sans typography",
+    accent: {
+      primary: "{color.brand.deepblue.500}",
+      light: "{color.brand.deepblue.100}",
+      dark: "{color.brand.deepblue.800}"
+    },
+    typography: {
+      primary: "Work Sans",
+      secondary: "Work Sans",
+      mono: "JetBrains Mono"
+    },
+    geometry: {
+      radiusControl: "{radius.md}",
+      radiusContainer: "{radius.lg}",
+      buttonStyle: "rounded"
+    },
+    semantic: {
+      light: {
+        interactivePrimary: "{color.brand.deepblue.500}",
+        interactivePrimaryHover: "{color.brand.deepblue.700}",
+        interactivePrimaryText: "{color.neutral.0}"
       },
-      ghost: {
-        hover: "color-mix(in srgb, {color.neutral.1000} 5%, transparent)"
+      dark: {
+        interactivePrimary: "{color.brand.deepblue.500}",
+        interactivePrimaryHover: "{color.brand.deepblue.400}",
+        interactivePrimaryText: "{color.neutral.900}"
       }
     },
-    status: {
-      error: "{color.error.500}",
-      success: "{color.success.500}",
-      warning: "{color.warning.500}",
-      info: "{color.info.500}"
-    },
-    soft: {
-      brand: "color-mix(in srgb, {color.brand.500} 10%, transparent)",
-      "brand-hover": "color-mix(in srgb, {color.brand.500} 20%, transparent)",
-      success: "color-mix(in srgb, {color.success.500} 10%, transparent)",
-      error: "color-mix(in srgb, {color.error.500} 10%, transparent)",
-      warning: "color-mix(in srgb, {color.warning.500} 10%, transparent)",
-      info: "color-mix(in srgb, {color.info.500} 10%, transparent)"
-    },
-    focus: {
-      ring: "0 0 0 3px color-mix(in srgb, {color.brand.500} 40%, transparent)"
-    },
-    gradient: {
-      start: "{color.brand.400}",
-      end: "{color.brand.600}"
-    },
-    chart: {
-      1: "{color.brand.500}",
-      2: "{color.brand.300}",
-      3: "{color.brand.700}",
-      4: "{color.success.500}",
-      5: "{color.warning.500}"
+    usage: {
+      html: '<html data-theme="dark" data-brand="deepblue">',
+      css: '/* Included in theme.css via [data-brand="deepblue"] */',
+      attribute: "deepblue"
     }
-  }
-}, o = {
-  theme: "dark",
-  semantic: {
-    surface: {
-      base: "{color.neutral.900}",
-      subtle: "{color.neutral.950}",
-      layer: "{color.neutral.900}",
-      primary: "{color.neutral.900}",
-      secondary: "{color.neutral.900}",
-      glass: "color-mix(in srgb, {color.neutral.950} 60%, transparent)",
-      sunken: "color-mix(in srgb, {color.neutral.950} 40%, transparent)",
-      overlay: "color-mix(in srgb, {color.neutral.1000} 70%, transparent)"
-    },
-    text: {
-      primary: "{color.neutral.50}",
-      secondary: "{color.neutral.400}",
-      tertiary: "{color.neutral.600}",
-      inverse: "{color.neutral.950}",
-      brand: "{color.brand.400}",
-      "on-brand": {
-        primary: "{color.neutral.0}",
-        secondary: "color-mix(in srgb, {color.neutral.0} 90%, transparent)",
-        tertiary: "color-mix(in srgb, {color.neutral.0} 70%, transparent)"
+  },
+  red: {
+    name: "Red",
+    description: "Red brand - Red with Poppins typography and pill buttons",
+    accent: {
+      primary: "{color.brand.red.500}",
+      light: "{color.brand.red.100}",
+      dark: "{color.brand.red.900}"
+    },
+    typography: {
+      primary: "Poppins",
+      secondary: "Inter",
+      mono: "JetBrains Mono"
+    },
+    geometry: {
+      radiusControl: "var(--radius-lg)",
+      radiusContainer: "{radius.lg}",
+      buttonStyle: "pill"
+    },
+    semantic: {
+      light: {
+        interactivePrimary: "{color.brand.red.500}",
+        interactivePrimaryHover: "{color.brand.red.600}",
+        interactivePrimaryText: "{color.neutral.0}"
+      },
+      dark: {
+        interactivePrimary: "{color.brand.red.500}",
+        interactivePrimaryHover: "{color.brand.red.400}",
+        interactivePrimaryText: "{color.neutral.0}"
       }
     },
-    border: {
-      subtle: "{color.neutral.800}",
-      strong: "{color.neutral.700}",
-      interactive: "{color.brand.500}"
+    usage: {
+      html: '<html data-theme="dark" data-brand="red">',
+      css: '/* Included in theme.css via [data-brand="red"] */',
+      attribute: "red"
+    }
+  },
+  orange: {
+    name: "Orange",
+    description: "Orange brand - Red-Orange with pill buttons",
+    accent: {
+      primary: "{color.brand.orange.500}",
+      light: "{color.brand.orange.100}",
+      dark: "{color.brand.orange.900}"
+    },
+    typography: {
+      primary: "DM Sans",
+      secondary: "Inter",
+      mono: "JetBrains Mono"
+    },
+    geometry: {
+      radiusControl: "{radius.full}",
+      radiusContainer: "{radius.lg}",
+      buttonStyle: "pill"
+    },
+    semantic: {
+      light: {
+        interactivePrimary: "{color.brand.orange.500}",
+        interactivePrimaryHover: "{color.brand.orange.700}",
+        interactivePrimaryText: "{color.neutral.0}"
+      },
+      dark: {
+        interactivePrimary: "{color.brand.orange.500}",
+        interactivePrimaryHover: "{color.brand.orange.400}",
+        interactivePrimaryText: "{color.neutral.0}"
+      }
     },
-    interactive: {
-      primary: {
-        default: "{color.brand.500}",
-        hover: "{color.brand.400}",
-        text: "{color.neutral.900}"
+    usage: {
+      html: '<html data-theme="dark" data-brand="orange">',
+      css: '/* Included in theme.css via [data-brand="orange"] */',
+      attribute: "orange"
+    }
+  },
+  ember: {
+    name: "Ember",
+    description: "Ember brand — Orange accent with dark neutral buttons and rectangular geometry",
+    accent: {
+      primary: "{color.brand.orange.500}",
+      light: "{color.brand.orange.100}",
+      dark: "{color.brand.orange.900}"
+    },
+    typography: {
+      primary: "DM Sans",
+      secondary: "Inter",
+      mono: "JetBrains Mono"
+    },
+    geometry: {
+      radiusControl: "{radius.md}",
+      radiusContainer: "{radius.xl}",
+      buttonStyle: "rounded"
+    },
+    semantic: {
+      light: {
+        interactivePrimary: "{color.neutral.900}",
+        interactivePrimaryHover: "{color.neutral.700}",
+        interactivePrimaryText: "{color.neutral.0}"
       },
-      secondary: {
-        default: "{color.neutral.800}",
-        hover: "{color.neutral.700}",
-        text: "{color.neutral.50}"
+      dark: {
+        interactivePrimary: "{color.neutral.100}",
+        interactivePrimaryHover: "{color.neutral.0}",
+        interactivePrimaryText: "{color.neutral.900}"
+      }
+    },
+    usage: {
+      html: '<html data-theme="light|dark" data-brand="ember">',
+      css: '/* Included in theme.css via [data-brand="ember"] */',
+      attribute: "ember"
+    }
+  },
+  lemon: {
+    name: "Lemon",
+    description: "Lemon brand - Bright lime green with Anton typography and highly rounded design",
+    accent: {
+      primary: "{color.brand.lemon.600}",
+      light: "{color.brand.lemon.100}",
+      dark: "{color.brand.lemon.900}"
+    },
+    typography: {
+      primary: "Anton",
+      secondary: "Work Sans",
+      mono: "JetBrains Mono"
+    },
+    geometry: {
+      radiusControl: "{radius.lg}",
+      radiusContainer: "{radius.lg}",
+      buttonStyle: "pill"
+    },
+    semantic: {
+      light: {
+        interactivePrimary: "{color.brand.lemon.700}",
+        interactivePrimaryHover: "{color.brand.lemon.800}",
+        interactivePrimaryText: "{color.neutral.0}"
       },
-      ghost: {
-        hover: "color-mix(in srgb, {color.neutral.0} 10%, transparent)"
+      dark: {
+        interactivePrimary: "{color.brand.lemon.500}",
+        interactivePrimaryHover: "{color.brand.lemon.600}",
+        interactivePrimaryText: "{color.neutral.900}"
       }
     },
-    status: {
-      error: "{color.error.500}",
-      success: "{color.success.500}",
-      warning: "{color.warning.500}",
-      info: "{color.info.500}"
-    },
-    soft: {
-      brand: "color-mix(in srgb, {color.brand.500} 15%, transparent)",
-      "brand-hover": "color-mix(in srgb, {color.brand.500} 25%, transparent)",
-      success: "color-mix(in srgb, {color.success.500} 15%, transparent)",
-      error: "color-mix(in srgb, {color.error.500} 15%, transparent)",
-      warning: "color-mix(in srgb, {color.warning.500} 15%, transparent)",
-      info: "color-mix(in srgb, {color.info.500} 15%, transparent)"
-    },
-    focus: {
-      ring: "0 0 0 3px color-mix(in srgb, {color.brand.500} 50%, transparent)"
-    },
-    gradient: {
-      start: "{color.brand.400}",
-      end: "{color.brand.600}"
-    },
-    chart: {
-      1: "{color.brand.400}",
-      2: "{color.brand.200}",
-      3: "{color.brand.600}",
-      4: "{color.success.500}",
-      5: "{color.warning.500}"
+    usage: {
+      html: '<html data-theme="dark" data-brand="lemon">',
+      css: '/* Included in theme.css via [data-brand="lemon"] */',
+      attribute: "lemon"
     }
   }
-}, n = {
-  light: r,
-  dark: o
 };
 export {
-  o as darkTheme,
-  r as lightTheme,
-  n as themes
+  r as brands
 };

package/dist/index99.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r={orion:{name:"Orion",description:"Default brand - Orion Blue, professional rounded corners",accent:{primary:"{color.brand.orion.500}",light:"{color.brand.orion.100}",dark:"{color.brand.orion.900}"},typography:{primary:"Libre Baskerville",secondary:"Inter",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.md}",radiusContainer:"{radius.lg}",buttonStyle:"pill"},semantic:{light:{interactivePrimary:"{color.brand.orion.500}",interactivePrimaryHover:"{color.brand.orion.700}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.orion.500}",interactivePrimaryHover:"{color.brand.orion.400}",interactivePrimaryText:"{color.neutral.0}"}},usage:{html:'<html data-theme="dark">',css:"/* No additional CSS needed - default */",attribute:null}},deepblue:{name:"Deepblue",description:"Deepblue brand - Deep Blue with Work Sans typography",accent:{primary:"{color.brand.deepblue.500}",light:"{color.brand.deepblue.100}",dark:"{color.brand.deepblue.800}"},typography:{primary:"Work Sans",secondary:"Work Sans",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.md}",radiusContainer:"{radius.lg}",buttonStyle:"rounded"},semantic:{light:{interactivePrimary:"{color.brand.deepblue.500}",interactivePrimaryHover:"{color.brand.deepblue.700}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.deepblue.500}",interactivePrimaryHover:"{color.brand.deepblue.400}",interactivePrimaryText:"{color.neutral.900}"}},usage:{html:'<html data-theme="dark" data-brand="deepblue">',css:'/* Included in theme.css via [data-brand="deepblue"] */',attribute:"deepblue"}},red:{name:"Red",description:"Red brand - Red with Poppins typography and pill buttons",accent:{primary:"{color.brand.red.500}",light:"{color.brand.red.100}",dark:"{color.brand.red.900}"},typography:{primary:"Poppins",secondary:"Inter",mono:"JetBrains Mono"},geometry:{radiusControl:"var(--radius-lg)",radiusContainer:"{radius.lg}",buttonStyle:"pill"},semantic:{light:{interactivePrimary:"{color.brand.red.500}",interactivePrimaryHover:"{color.brand.red.600}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.red.500}",interactivePrimaryHover:"{color.brand.red.400}",interactivePrimaryText:"{color.neutral.0}"}},usage:{html:'<html data-theme="dark" data-brand="red">',css:'/* Included in theme.css via [data-brand="red"] */',attribute:"red"}},orange:{name:"Orange",description:"Orange brand - Red-Orange with pill buttons",accent:{primary:"{color.brand.orange.500}",light:"{color.brand.orange.100}",dark:"{color.brand.orange.900}"},typography:{primary:"DM Sans",secondary:"Inter",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.full}",radiusContainer:"{radius.lg}",buttonStyle:"pill"},semantic:{light:{interactivePrimary:"{color.brand.orange.500}",interactivePrimaryHover:"{color.brand.orange.700}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.orange.500}",interactivePrimaryHover:"{color.brand.orange.400}",interactivePrimaryText:"{color.neutral.0}"}},usage:{html:'<html data-theme="dark" data-brand="orange">',css:'/* Included in theme.css via [data-brand="orange"] */',attribute:"orange"}},ember:{name:"Ember",description:"Ember brand — Orange accent with dark neutral buttons and rectangular geometry",accent:{primary:"{color.brand.orange.500}",light:"{color.brand.orange.100}",dark:"{color.brand.orange.900}"},typography:{primary:"DM Sans",secondary:"Inter",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.md}",radiusContainer:"{radius.xl}",buttonStyle:"rounded"},semantic:{light:{interactivePrimary:"{color.neutral.900}",interactivePrimaryHover:"{color.neutral.700}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.neutral.100}",interactivePrimaryHover:"{color.neutral.0}",interactivePrimaryText:"{color.neutral.900}"}},usage:{html:'<html data-theme="light|dark" data-brand="ember">',css:'/* Included in theme.css via [data-brand="ember"] */',attribute:"ember"}},lemon:{name:"Lemon",description:"Lemon brand - Bright lime green with Anton typography and highly rounded design",accent:{primary:"{color.brand.lemon.600}",light:"{color.brand.lemon.100}",dark:"{color.brand.lemon.900}"},typography:{primary:"Anton",secondary:"Work Sans",mono:"JetBrains Mono"},geometry:{radiusControl:"{radius.lg}",radiusContainer:"{radius.lg}",buttonStyle:"pill"},semantic:{light:{interactivePrimary:"{color.brand.lemon.700}",interactivePrimaryHover:"{color.brand.lemon.800}",interactivePrimaryText:"{color.neutral.0}"},dark:{interactivePrimary:"{color.brand.lemon.500}",interactivePrimaryHover:"{color.brand.lemon.600}",interactivePrimaryText:"{color.neutral.900}"}},usage:{html:'<html data-theme="dark" data-brand="lemon">',css:'/* Included in theme.css via [data-brand="lemon"] */',attribute:"lemon"}}};exports.brands=r;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="_emptyState_6m57l_8",e="_sm_6m57l_21",s="_icon_6m57l_24",o="_title_6m57l_28",_="_description_6m57l_32",i="_actions_6m57l_37",c="_md_6m57l_43",l="_lg_6m57l_63",n={emptyState:t,sm:e,icon:s,title:o,description:_,actions:i,md:c,lg:l};exports.actions=i;exports.default=n;exports.description=_;exports.emptyState=t;exports.icon=s;exports.lg=l;exports.md=c;exports.sm=e;exports.title=o;