npm - @orion-ds/react - Versions diffs - 4.2.11 → 4.2.14 - Mend

@orion-ds/react 4.2.11 → 4.2.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (303) hide show

package/dist/index98.mjs CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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;
1	+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l="_container_eaku9_16",a="_sm_eaku9_24",e="_track_eaku9_24",t="_input_eaku9_28",_="_md_eaku9_38",s="_lg_eaku9_52",i="_fill_eaku9_76",c="_valueDisplay_eaku9_165",n="_ticks_eaku9_190",u="_tick_eaku9_190",k="_labels_eaku9_205",o="_labelMin_eaku9_213",b="_labelMax_eaku9_214",d="_disabled_eaku9_219",r={container:l,sm:a,track:e,input:t,md:_,lg:s,fill:i,valueDisplay:c,ticks:n,tick:u,labels:k,labelMin:o,labelMax:b,disabled:d};exports.container=l;exports.default=r;exports.disabled=d;exports.fill=i;exports.input=t;exports.labelMax=b;exports.labelMin=o;exports.labels=k;exports.lg=s;exports.md=_;exports.sm=a;exports.tick=u;exports.ticks=n;exports.track=e;exports.valueDisplay=c;

package/dist/index99.mjs CHANGED Viewed

@@ -1,221 +1,33 @@
-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"
-    }
-  }
+const a = "_container_eaku9_16", _ = "_sm_eaku9_24", l = "_track_eaku9_24", e = "_input_eaku9_28", s = "_md_eaku9_38", t = "_lg_eaku9_52", c = "_fill_eaku9_76", n = "_valueDisplay_eaku9_165", i = "_ticks_eaku9_190", k = "_tick_eaku9_190", u = "_labels_eaku9_205", o = "_labelMin_eaku9_213", b = "_labelMax_eaku9_214", d = "_disabled_eaku9_219", p = {
+  container: a,
+  sm: _,
+  track: l,
+  input: e,
+  md: s,
+  lg: t,
+  fill: c,
+  valueDisplay: n,
+  ticks: i,
+  tick: k,
+  labels: u,
+  labelMin: o,
+  labelMax: b,
+  disabled: d
 };
 export {
-  r as brands
+  a as container,
+  p as default,
+  d as disabled,
+  c as fill,
+  e as input,
+  b as labelMax,
+  o as labelMin,
+  u as labels,
+  t as lg,
+  s as md,
+  _ as sm,
+  k as tick,
+  i as ticks,
+  l as track,
+  n as valueDisplay
 };

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@orion-ds/react",
-  "version": "4.2.11",
+  "version": "4.2.14",
   "type": "module",
   "description": "Orion Design System - React component library with 40+ AI-ready components and 9 templates",
   "author": "Orion Design System Team",