@brightspot/ui 1.0.1-3 → 1.0.1-5

package/README.md

@@ -1,6 +1,7 @@
-Brightspot UI
-=======
+# Brightspot UI
+
 <a id="readme-top"></a>
+
 <div>
 <h2 align="center">brightspot-ui</h2>
   <p align="center">
@@ -52,7 +53,8 @@ _Note:_ To get the best developer experience we recommend using VSCode editor. T
 ### Prerequisites
 
 Your codebase needs to be compatible with
-* TailwindCSS **v3**
+
+- TailwindCSS **v3**
 
 ### Installation
 
@@ -88,6 +90,7 @@ Brightspot UI comes with a variety of TailwindCSS plugins to make styling simple
 To use our plugins, include them in your TailwindCSS config as usual. Plugin files are provided in both Typescript and Javascript variants and are available under the `dist` path in the brightspot-ui module.
 
 An example of including all the plugins:
+
 ```ts
 // your tailwind.config.ts
   ...
@@ -101,41 +104,43 @@ An example of including all the plugins:
     require('@brightspot/ui/dist/tailwind-plugin-scroll-shadow.ts')
     ...
 ```
+
 ### Available plugins:
 
 1. Badge
-    ```ts
-    require('@brightspot/ui/dist/tailwind-plugin-badge.ts')
-    ```
+   ```ts
+   require('@brightspot/ui/dist/tailwind-plugin-badge.ts')
+   ```
 2. Button
-    ```ts
-    require('@brightspot/ui/dist/tailwind-plugin-button.ts')
-    ```
-4. Heading
-    ```ts
-    require('@brightspot/ui/dist/tailwind-plugin-heading.ts')
-    ```
-5. Icon
-     ```ts
-    require('@brightspot/ui/dist/tailwind-plugin-icon.ts')
-    ```
-6. Loader
-     ```ts
-    require('@brightspot/ui/dist/tailwind-plugin-loader.ts')
-    ```
-7. ScrollShadow
-    ```ts
-    require('@brightspot/ui/dist/tailwind-plugin-scroll-shadow.ts')
-    ```
-8. Theme
-     ```ts
+   ```ts
+   require('@brightspot/ui/dist/tailwind-plugin-button.ts')
+   ```
+3. Heading
+   ```ts
+   require('@brightspot/ui/dist/tailwind-plugin-heading.ts')
+   ```
+4. Icon
+   ```ts
+   require('@brightspot/ui/dist/tailwind-plugin-icon.ts')
+   ```
+5. Loader
+   ```ts
+   require('@brightspot/ui/dist/tailwind-plugin-loader.ts')
+   ```
+6. ScrollShadow
+   ```ts
+   require('@brightspot/ui/dist/tailwind-plugin-scroll-shadow.ts')
+   ```
+7. Theme
+`ts
     require('@brightspot/ui/dist/tailwind-plugin-theme.ts')
-    ```
+    `
 <p align="right">(<a href="#readme-top">back to top</a>)</p>
 
 ## Examples
 
 We use [Storybook](https://storybook.js.org/) for interactive previewing of our ui components. Launch that in the browser by running:
+
 ```sh
   yarn storybook
 ```
@@ -155,17 +160,23 @@ For local development and testing, use `yarn link` to create a symlink between t
 #### Setting up the link
 
 1. **In the brightspot-ui package directory:**
+
    ```sh
    yarn link
    ```
+
    This registers the package globally on your system for linking.
 
 2. **In your consuming project directory:**
+
    ```sh
    yarn link @brightspot/ui
    ```
+
    This creates a symlink from your project's node_modules to the brightspot-ui package.
 
+   > **_Note_** Be sure this is done in the directory where the `package.json` file resides for the CMS UI. Currently that is at `/cms/tool-ui`. You will need to validate your changes via your locally running Brightspot Tool UI Webpack server. It will not work directly over Docker's Tomcat.
+
 #### Working with the linked package
 
 - From within _**this**_ module, run `yarn build` to ensure the `dist` folder is updated with your changes.
@@ -176,6 +187,7 @@ For local development and testing, use `yarn link` to create a symlink between t
 When you're done with local development:
 
 1. **In your consuming project:**
+
    ```sh
    yarn unlink @brightspot/ui
    yarn install --force
@@ -188,38 +200,54 @@ When you're done with local development:
 
 This restores your project to use the published version from npm.
 
-### Publishing
+### Commit Guidelines
 
-#### Prerelease (Testing)
+This project uses [Conventional Commits](https://www.conventionalcommits.org/) to ensure consistent commit messages. All commits are automatically validated using [commitlint](https://commitlint.js.org/) via [husky](https://typicode.github.io/husky/) git hooks. When you attempt to commit, the commit message will be checked against conventional commit standards, and the commit will be rejected if it doesn't conform.
 
-For testing changes before a full release, create a prerelease version:
+#### Using the `/git:commit` Command
+
+For contributors using Claude Code, use the custom `/git:commit` slash command to create properly formatted commits:
 
 ```sh
-yarn version --prerelease
-npm publish --tag beta
+/git:commit
 ```
 
-This automatically increments the version with a prerelease identifier (e.g., `1.2.3-0`) and publishes it under the `beta` tag. Users can install prereleases with:
+This command automatically:
 
-```sh
-yarn add @brightspot/ui@beta
-```
+- Analyzes your staged changes
+- Generates a conventional commit message
+- Creates the commit with proper formatting
 
-#### Full Release
+#### Manual Commits
 
-For a production release:
+If committing manually, follow this format:
 
-```sh
-yarn version --patch  # for bug fixes
-# or
-yarn version --minor  # for new features
-# or
-yarn version --major  # for breaking changes
+```
+type(scope): subject
 
-npm publish
+body (optional)
+
+footer (optional)
 ```
 
-The `yarn version` command automatically updates the version number in package.json and creates a git commit and tag. Choose the appropriate version bump based on the type of changes you're releasing.
+**Common types:**
+
+- `feat`: New feature
+- `fix`: Bug fix
+- `docs`: Documentation changes
+- `style`: Code style (formatting, whitespace)
+- `refactor`: Code restructuring
+- `test`: Adding or updating tests
+- `chore`: Maintenance tasks (deps, build tools)
+
+**Examples:**
+
+```
+feat(button): add icon support to primary button
+fix(theme): resolve color contrast in dark mode
+docs: update installation instructions
+chore(deps): upgrade tailwindcss to 3.4.0
+```
 
 <p align="right">(<a href="#readme-top">back to top</a>)</p>
 

package/dist/LucideDynamicLoader.d.ts

@@ -0,0 +1,5 @@
+export declare function getIcon(iconName: string): {
+    compat: string;
+    iconSvg: string;
+} | undefined;
+//# sourceMappingURL=LucideDynamicLoader.d.ts.map

package/dist/LucideDynamicLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LucideDynamicLoader.d.ts","sourceRoot":"","sources":["../src/LucideDynamicLoader.ts"],"names":[],"mappings":"AAKA,wBAAgB,OAAO,CAAC,QAAQ,EAAE,MAAM;;;cAiBvC"}

package/dist/LucideDynamicLoader.js

@@ -1,5 +1,5 @@
 import * as LucideIcons from 'lucide-static';
-import icons from 'lucide-static/font/info.json';
+import icons from 'lucide-static/font/info.json' with { type: 'json' };
 import { kebabToPascal } from '../src/util/string';
 import { addNameSpaceXML, encodeSVG } from '../src/util/svg';
 export function getIcon(iconName) {
@@ -19,3 +19,4 @@ export function getIcon(iconName) {
         console.error('Error loading Lucide icon ${iconName}:', e);
     }
 }
+//# sourceMappingURL=LucideDynamicLoader.js.map

package/dist/LucideDynamicLoader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LucideDynamicLoader.js","sourceRoot":"","sources":["../src/LucideDynamicLoader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,WAAW,MAAM,eAAe,CAAA;AAC5C,OAAO,KAAK,MAAM,8BAA8B,CAAC,OAAO,IAAI,EAAE,MAAM,EAAE,CAAA;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAClD,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAE5D,MAAM,UAAU,OAAO,CAAC,QAAgB;IACtC,IAAI,CAAC;QACH,MAAM,SAAS,GAAG,QAAQ,CAAC,OAAO,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC,WAAW,EAAE,CAAA;QAC5E,MAAM,UAAU,GAAG,aAAa,CAAC,SAAS,CAAC,CAAA;QAE3C,IAAI,WAAW,CAAC,UAAsC,CAAC,EAAE,CAAC;YACxD,MAAM,GAAG,GAAG,WAAW,CAAC,UAAsC,CAAW,CAAA;YACzE,MAAM,UAAU,GAAG,SAAS,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,CAAA;YAElD,OAAO;gBACL,MAAM,EAAE,KAAK,CAAC,SAA+B,CAAC,EAAE,WAAW,IAAI,EAAE;gBACjE,OAAO,EAAE,UAAU;aACpB,CAAA;QACH,CAAC;IACH,CAAC;IAAC,OAAO,CAAC,EAAE,CAAC;QACX,OAAO,CAAC,KAAK,CAAC,wCAAwC,EAAE,CAAC,CAAC,CAAA;IAC5D,CAAC;AACH,CAAC"}

package/dist/LucideDynamicLoader.ts

@@ -1,5 +1,5 @@
 import * as LucideIcons from 'lucide-static'
-import icons from 'lucide-static/font/info.json'
+import icons from 'lucide-static/font/info.json' with { type: 'json' }
 import { kebabToPascal } from '../src/util/string'
 import { addNameSpaceXML, encodeSVG } from '../src/util/svg'
 

package/dist/storybook/assets/{Badge.stories-Dm-U1QYO.js → Badge.stories-BUWscv-N.js}

@@ -1,13 +1,11 @@
-import{x as i}from"./iframe-DT_nhsJu.js";import"./preload-helper-PPVm8Dsz.js";const p=({color:e="gray",affordance:a,size:u="sm",customForegroundColor:n,customBackgroundColor:c,label:g})=>{let l=!1,d=!1;a==="dot"?l=!0:a==="icon"&&(d=!0);const o=[];return n&&o.push(`--badge-color-foreground: ${n}`),c&&o.push(`--badge-color-background: ${c}`),i`
+import{x as i}from"./iframe-D3S76tLX.js";import"./preload-helper-PPVm8Dsz.js";const p=({color:e="gray",affordance:a,size:u="sm",customForegroundColor:n,customBackgroundColor:c,label:g})=>{let l=!1,d=!1;a==="dot"?l=!0:a==="icon"&&(d=!0);const o=[];return n&&o.push(`--badge-color-foreground: ${n}`),c&&o.push(`--badge-color-background: ${c}`),i`
     <span
       class=${["btu-badge",`btu-badge-${u}`,`btu-badge-${e}`,l?"before:size-2 before:rounded-lg before:bg-[currentColor]":"",d?"before:btu-icon before:btu-icon-xs before:btu-icon-salad":""].join(" ")}
       style=${o.length>0?o.join("; "):""}
     >
       ${g}
     </span>
-  `},m=["black","white","primary","teal","gray","purple","rose","error","warning","success"],f={title:"Components/Badge",component:"btu-badge",tags:["autodocs"],parameters:{docs:{subtitle:"btu-badge"},controls:{expanded:!0}},render:e=>p(e),argTypes:{color:{control:{type:"select"},options:m},affordance:{control:{type:"select"},options:["dot","icon"],description:"Display a design affordance next to the label"},size:{control:{type:"select"},options:["sm","md","lg"]},customForegroundColor:{control:{type:"color"},description:"Custom foreground (text) color - overrides the theme color"},customBackgroundColor:{control:{type:"color"},description:"Custom background color - overrides the theme color"}},args:{color:"purple",affordance:"dot",size:"sm",customForegroundColor:"",customBackgroundColor:"",label:"Badge"}},r={args:{}},s={args:{color:"primary",size:"lg",label:"Custom Colors Badge",customForegroundColor:"#a04b4b",customBackgroundColor:"#dce34d"},parameters:{docs:{description:{story:"Badge supports custom colors using the btu-badge-foreground and btu-badge-background utilities. Setting these values will override any theme colors."}}}},t={args:{color:"success",size:"lg",label:"Linked Badge"},decorators:[e=>i`<a
-        href="#"
-        class="inline-flex items-center gap-2 hover:text-primary hover:underline"
+  `},m=["black","white","primary","teal","gray","purple","rose","error","warning","success"],f={title:"Components/Badge",component:"btu-badge",tags:["autodocs"],parameters:{docs:{subtitle:"btu-badge"},controls:{expanded:!0}},render:e=>p(e),argTypes:{color:{control:{type:"select"},options:m},affordance:{control:{type:"select"},options:["dot","icon"],description:"Display a design affordance next to the label"},size:{control:{type:"select"},options:["sm","md","lg"]},customForegroundColor:{control:{type:"color"},description:"Custom foreground (text) color - overrides the theme color"},customBackgroundColor:{control:{type:"color"},description:"Custom background color - overrides the theme color"}},args:{color:"purple",affordance:"dot",size:"sm",customForegroundColor:"",customBackgroundColor:"",label:"Badge"}},r={args:{}},s={args:{color:"primary",size:"lg",label:"Custom Colors Badge",customForegroundColor:"#a04b4b",customBackgroundColor:"#dce34d"},parameters:{docs:{description:{story:"Badge supports custom colors using the btu-badge-foreground and btu-badge-background utilities. Setting these values will override any theme colors."}}}},t={args:{color:"success",size:"lg",label:"Linked Badge"},decorators:[e=>i`<a href="#" class="hover:text-primary inline-flex items-center gap-2 hover:underline"
         >Hover over me to see the ${e()} in action.</a
       >`],parameters:{docs:{description:{story:"Badges inside anchor elements automatically handle underlines properly. The underline uses the badge background color instead of the default link color, ensuring proper visual hierarchy when badges are used as clickable elements."}}}};r.parameters={...r.parameters,docs:{...r.parameters?.docs,source:{originalSource:`{
   args: {}
@@ -32,9 +30,7 @@ import{x as i}from"./iframe-DT_nhsJu.js";import"./preload-helper-PPVm8Dsz.js";co
     size: 'lg',
     label: 'Linked Badge'
   },
-  decorators: [story => html\`<a
-        href="#"
-        class="inline-flex items-center gap-2 hover:text-primary hover:underline"
+  decorators: [story => html\`<a href="#" class="hover:text-primary inline-flex items-center gap-2 hover:underline"
         >Hover over me to see the \${story()} in action.</a
       >\`],
   parameters: {

package/dist/storybook/assets/{Button.stories-1cb_EUIC.js → Button.stories-BxwD2JsV.js}

@@ -1,4 +1,4 @@
-import{x as v}from"./iframe-DT_nhsJu.js";import"./preload-helper-PPVm8Dsz.js";const I=({color:r="primary",pressed:a,fill:i,contained:c,outlined:l,size:d="sm",label:u,icon:b,hideText:p,disabled:m})=>{const g=i?"":"btu-button-fill-none",y=c?"":"btu-button-container-none",h=l?"btu-button-outline":"",f=p?"btu-button-text-hidden":"",x=b?["before:btu-icon","before:btu-icon-smile"]:[];return v`
+import{x as v}from"./iframe-D3S76tLX.js";import"./preload-helper-PPVm8Dsz.js";const I=({color:r="primary",pressed:a,fill:i,contained:c,outlined:l,size:d="sm",label:u,icon:b,hideText:p,disabled:m})=>{const g=i?"":"btu-button-fill-none",y=c?"":"btu-button-container-none",h=l?"btu-button-outline":"",f=p?"btu-button-text-hidden":"",x=b?["before:btu-icon","before:btu-icon-smile"]:[];return v`
     <button
       type="button"
       class=${["btu-button",`btu-button-${r}`,`btu-button-${d}`,g,y,h,f,...x].join(" ")}
@@ -7,7 +7,7 @@ import{x as v}from"./iframe-DT_nhsJu.js";import"./preload-helper-PPVm8Dsz.js";co
     >
       ${u}
     </button>
-  `},B=["black","white","primary","teal","gray","purple","rose","error","warning","success"],S={title:"Components/Button",component:"btu-button",tags:["autodocs"],parameters:{docs:{subtitle:"btu-button"},controls:{expanded:!0}},render:r=>I(r),argTypes:{color:{control:{type:"select"},options:B},contained:{control:{type:"boolean"},description:"Does the button have a container?"},disabled:{control:{type:"boolean"},description:"Is the button disabled?"},fill:{control:{type:"boolean"},description:"Is the button filled?"},hideText:{control:{type:"boolean"},description:"Icon only mode (hides label)"},icon:{table:{disable:!0}},label:{control:{type:"text"},description:"Button label text"},outlined:{control:{type:"boolean"},description:"Is the button outlined?"},pressed:{control:{type:"boolean"},description:"Is the button pressed?"},size:{control:{type:"select"},options:["sm","md","lg","xl","2xl"]}},args:{color:"primary",contained:!0,disabled:!1,fill:!0,hideText:!1,icon:"",label:"Button",outlined:!1,pressed:!1,size:"md"}},e={args:{}},t={args:{label:"Search",icon:"before:btu-icon-smile"},parameters:{docs:{description:{story:"Button with an icon alongside text."}}}},o={args:{icon:"before:btu-icon-smile",hideText:!0},parameters:{docs:{description:{story:"Icon-only button. Uses `btu-button-text-hidden` to hide the label."}}}},s={args:{label:"Disabled Button",disabled:!0},parameters:{docs:{description:{story:"Disabled button state. Uses the `[disabled]` attribute to trigger disabled styling with reduced opacity and pointer events disabled."}}}},n={args:{label:"Active Button",pressed:!0,fill:!1,icon:"before:btu-icon-smile",hideText:!0},parameters:{docs:{description:{story:'Active/pressed button state. Uses `[aria-pressed="true"]` attribute to trigger the pressed styling, typically used for toggle buttons or to show an active state.'}}}};e.parameters={...e.parameters,docs:{...e.parameters?.docs,source:{originalSource:`{
+  `},B=["ai","black","white","primary","teal","gray","purple","rose","error","warning","success"],S={title:"Components/Button",component:"btu-button",tags:["autodocs"],parameters:{docs:{subtitle:"btu-button"},controls:{expanded:!0}},render:r=>I(r),argTypes:{color:{control:{type:"select"},options:B},contained:{control:{type:"boolean"},description:"Does the button have a container?"},disabled:{control:{type:"boolean"},description:"Is the button disabled?"},fill:{control:{type:"boolean"},description:"Is the button filled?"},hideText:{control:{type:"boolean"},description:"Icon only mode (hides label)"},icon:{table:{disable:!0}},label:{control:{type:"text"},description:"Button label text"},outlined:{control:{type:"boolean"},description:"Is the button outlined?"},pressed:{control:{type:"boolean"},description:"Is the button pressed?"},size:{control:{type:"select"},options:["sm","md","lg","xl","2xl"]}},args:{color:"primary",contained:!0,disabled:!1,fill:!0,hideText:!1,icon:"",label:"Button",outlined:!1,pressed:!1,size:"md"}},e={args:{}},t={args:{label:"Search",icon:"before:btu-icon-smile"},parameters:{docs:{description:{story:"Button with an icon alongside text."}}}},o={args:{icon:"before:btu-icon-smile",hideText:!0},parameters:{docs:{description:{story:"Icon-only button. Uses `btu-button-text-hidden` to hide the label."}}}},s={args:{label:"Disabled Button",disabled:!0},parameters:{docs:{description:{story:"Disabled button state. Uses the `[disabled]` attribute to trigger disabled styling with reduced opacity and pointer events disabled."}}}},n={args:{label:"Active Button",pressed:!0,fill:!1,icon:"before:btu-icon-smile",hideText:!0},parameters:{docs:{description:{story:'Active/pressed button state. Uses `[aria-pressed="true"]` attribute to trigger the pressed styling, typically used for toggle buttons or to show an active state.'}}}};e.parameters={...e.parameters,docs:{...e.parameters?.docs,source:{originalSource:`{
   args: {}
 }`,...e.parameters?.docs?.source}}};t.parameters={...t.parameters,docs:{...t.parameters?.docs,source:{originalSource:`{
   args: {

package/dist/storybook/assets/Color-64QXVMR3-tXPJkzyM.js

@@ -0,0 +1 @@
+import{r as x,R as b,s as E,W as J,g as me,T as ye,F as xe,M as we}from"./WithTooltip-SK46ZJ2J-BQsmdHUK.js";import{_ as d,a as ke,b as q}from"./iframe-D3S76tLX.js";import"./preload-helper-PPVm8Dsz.js";var _e=q({"../../node_modules/color-name/index.js"(t,l){l.exports={aliceblue:[240,248,255],antiquewhite:[250,235,215],aqua:[0,255,255],aquamarine:[127,255,212],azure:[240,255,255],beige:[245,245,220],bisque:[255,228,196],black:[0,0,0],blanchedalmond:[255,235,205],blue:[0,0,255],blueviolet:[138,43,226],brown:[165,42,42],burlywood:[222,184,135],cadetblue:[95,158,160],chartreuse:[127,255,0],chocolate:[210,105,30],coral:[255,127,80],cornflowerblue:[100,149,237],cornsilk:[255,248,220],crimson:[220,20,60],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgoldenrod:[184,134,11],darkgray:[169,169,169],darkgreen:[0,100,0],darkgrey:[169,169,169],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkseagreen:[143,188,143],darkslateblue:[72,61,139],darkslategray:[47,79,79],darkslategrey:[47,79,79],darkturquoise:[0,206,209],darkviolet:[148,0,211],deeppink:[255,20,147],deepskyblue:[0,191,255],dimgray:[105,105,105],dimgrey:[105,105,105],dodgerblue:[30,144,255],firebrick:[178,34,34],floralwhite:[255,250,240],forestgreen:[34,139,34],fuchsia:[255,0,255],gainsboro:[220,220,220],ghostwhite:[248,248,255],gold:[255,215,0],goldenrod:[218,165,32],gray:[128,128,128],green:[0,128,0],greenyellow:[173,255,47],grey:[128,128,128],honeydew:[240,255,240],hotpink:[255,105,180],indianred:[205,92,92],indigo:[75,0,130],ivory:[255,255,240],khaki:[240,230,140],lavender:[230,230,250],lavenderblush:[255,240,245],lawngreen:[124,252,0],lemonchiffon:[255,250,205],lightblue:[173,216,230],lightcoral:[240,128,128],lightcyan:[224,255,255],lightgoldenrodyellow:[250,250,210],lightgray:[211,211,211],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightsalmon:[255,160,122],lightseagreen:[32,178,170],lightskyblue:[135,206,250],lightslategray:[119,136,153],lightslategrey:[119,136,153],lightsteelblue:[176,196,222],lightyellow:[255,255,224],lime:[0,255,0],limegreen:[50,205,50],linen:[250,240,230],magenta:[255,0,255],maroon:[128,0,0],mediumaquamarine:[102,205,170],mediumblue:[0,0,205],mediumorchid:[186,85,211],mediumpurple:[147,112,219],mediumseagreen:[60,179,113],mediumslateblue:[123,104,238],mediumspringgreen:[0,250,154],mediumturquoise:[72,209,204],mediumvioletred:[199,21,133],midnightblue:[25,25,112],mintcream:[245,255,250],mistyrose:[255,228,225],moccasin:[255,228,181],navajowhite:[255,222,173],navy:[0,0,128],oldlace:[253,245,230],olive:[128,128,0],olivedrab:[107,142,35],orange:[255,165,0],orangered:[255,69,0],orchid:[218,112,214],palegoldenrod:[238,232,170],palegreen:[152,251,152],paleturquoise:[175,238,238],palevioletred:[219,112,147],papayawhip:[255,239,213],peachpuff:[255,218,185],peru:[205,133,63],pink:[255,192,203],plum:[221,160,221],powderblue:[176,224,230],purple:[128,0,128],rebeccapurple:[102,51,153],red:[255,0,0],rosybrown:[188,143,143],royalblue:[65,105,225],saddlebrown:[139,69,19],salmon:[250,128,114],sandybrown:[244,164,96],seagreen:[46,139,87],seashell:[255,245,238],sienna:[160,82,45],silver:[192,192,192],skyblue:[135,206,235],slateblue:[106,90,205],slategray:[112,128,144],slategrey:[112,128,144],snow:[255,250,250],springgreen:[0,255,127],steelblue:[70,130,180],tan:[210,180,140],teal:[0,128,128],thistle:[216,191,216],tomato:[255,99,71],turquoise:[64,224,208],violet:[238,130,238],wheat:[245,222,179],white:[255,255,255],whitesmoke:[245,245,245],yellow:[255,255,0],yellowgreen:[154,205,50]}}}),Q=q({"../../node_modules/color-convert/conversions.js"(t,l){var i=_e(),f={};for(const e of Object.keys(i))f[i[e]]=e;var s={rgb:{channels:3,labels:"rgb"},hsl:{channels:3,labels:"hsl"},hsv:{channels:3,labels:"hsv"},hwb:{channels:3,labels:"hwb"},cmyk:{channels:4,labels:"cmyk"},xyz:{channels:3,labels:"xyz"},lab:{channels:3,labels:"lab"},lch:{channels:3,labels:"lch"},hex:{channels:1,labels:["hex"]},keyword:{channels:1,labels:["keyword"]},ansi16:{channels:1,labels:["ansi16"]},ansi256:{channels:1,labels:["ansi256"]},hcg:{channels:3,labels:["h","c","g"]},apple:{channels:3,labels:["r16","g16","b16"]},gray:{channels:1,labels:["gray"]}};l.exports=s;for(const e of Object.keys(s)){if(!("channels"in s[e]))throw new Error("missing channels property: "+e);if(!("labels"in s[e]))throw new Error("missing channel labels property: "+e);if(s[e].labels.length!==s[e].channels)throw new Error("channel and label counts mismatch: "+e);const{channels:r,labels:n}=s[e];delete s[e].channels,delete s[e].labels,Object.defineProperty(s[e],"channels",{value:r}),Object.defineProperty(s[e],"labels",{value:n})}s.rgb.hsl=function(e){const r=e[0]/255,n=e[1]/255,o=e[2]/255,a=Math.min(r,n,o),c=Math.max(r,n,o),u=c-a;let h,g;c===a?h=0:r===c?h=(n-o)/u:n===c?h=2+(o-r)/u:o===c&&(h=4+(r-n)/u),h=Math.min(h*60,360),h<0&&(h+=360);const p=(a+c)/2;return c===a?g=0:p<=.5?g=u/(c+a):g=u/(2-c-a),[h,g*100,p*100]},s.rgb.hsv=function(e){let r,n,o,a,c;const u=e[0]/255,h=e[1]/255,g=e[2]/255,p=Math.max(u,h,g),y=p-Math.min(u,h,g),m=d(function(_){return(p-_)/6/y+1/2},"diffc");return y===0?(a=0,c=0):(c=y/p,r=m(u),n=m(h),o=m(g),u===p?a=o-n:h===p?a=1/3+r-o:g===p&&(a=2/3+n-r),a<0?a+=1:a>1&&(a-=1)),[a*360,c*100,p*100]},s.rgb.hwb=function(e){const r=e[0],n=e[1];let o=e[2];const a=s.rgb.hsl(e)[0],c=1/255*Math.min(r,Math.min(n,o));return o=1-1/255*Math.max(r,Math.max(n,o)),[a,c*100,o*100]},s.rgb.cmyk=function(e){const r=e[0]/255,n=e[1]/255,o=e[2]/255,a=Math.min(1-r,1-n,1-o),c=(1-r-a)/(1-a)||0,u=(1-n-a)/(1-a)||0,h=(1-o-a)/(1-a)||0;return[c*100,u*100,h*100,a*100]};function v(e,r){return(e[0]-r[0])**2+(e[1]-r[1])**2+(e[2]-r[2])**2}d(v,"comparativeDistance"),s.rgb.keyword=function(e){const r=f[e];if(r)return r;let n=1/0,o;for(const a of Object.keys(i)){const c=i[a],u=v(e,c);u<n&&(n=u,o=a)}return o},s.keyword.rgb=function(e){return i[e]},s.rgb.xyz=function(e){let r=e[0]/255,n=e[1]/255,o=e[2]/255;r=r>.04045?((r+.055)/1.055)**2.4:r/12.92,n=n>.04045?((n+.055)/1.055)**2.4:n/12.92,o=o>.04045?((o+.055)/1.055)**2.4:o/12.92;const a=r*.4124+n*.3576+o*.1805,c=r*.2126+n*.7152+o*.0722,u=r*.0193+n*.1192+o*.9505;return[a*100,c*100,u*100]},s.rgb.lab=function(e){const r=s.rgb.xyz(e);let n=r[0],o=r[1],a=r[2];n/=95.047,o/=100,a/=108.883,n=n>.008856?n**(1/3):7.787*n+16/116,o=o>.008856?o**(1/3):7.787*o+16/116,a=a>.008856?a**(1/3):7.787*a+16/116;const c=116*o-16,u=500*(n-o),h=200*(o-a);return[c,u,h]},s.hsl.rgb=function(e){const r=e[0]/360,n=e[1]/100,o=e[2]/100;let a,c,u;if(n===0)return u=o*255,[u,u,u];o<.5?a=o*(1+n):a=o+n-o*n;const h=2*o-a,g=[0,0,0];for(let p=0;p<3;p++)c=r+1/3*-(p-1),c<0&&c++,c>1&&c--,6*c<1?u=h+(a-h)*6*c:2*c<1?u=a:3*c<2?u=h+(a-h)*(2/3-c)*6:u=h,g[p]=u*255;return g},s.hsl.hsv=function(e){const r=e[0];let n=e[1]/100,o=e[2]/100,a=n;const c=Math.max(o,.01);o*=2,n*=o<=1?o:2-o,a*=c<=1?c:2-c;const u=(o+n)/2,h=o===0?2*a/(c+a):2*n/(o+n);return[r,h*100,u*100]},s.hsv.rgb=function(e){const r=e[0]/60,n=e[1]/100;let o=e[2]/100;const a=Math.floor(r)%6,c=r-Math.floor(r),u=255*o*(1-n),h=255*o*(1-n*c),g=255*o*(1-n*(1-c));switch(o*=255,a){case 0:return[o,g,u];case 1:return[h,o,u];case 2:return[u,o,g];case 3:return[u,h,o];case 4:return[g,u,o];case 5:return[o,u,h]}},s.hsv.hsl=function(e){const r=e[0],n=e[1]/100,o=e[2]/100,a=Math.max(o,.01);let c,u;u=(2-n)*o;const h=(2-n)*a;return c=n*a,c/=h<=1?h:2-h,c=c||0,u/=2,[r,c*100,u*100]},s.hwb.rgb=function(e){const r=e[0]/360;let n=e[1]/100,o=e[2]/100;const a=n+o;let c;a>1&&(n/=a,o/=a);const u=Math.floor(6*r),h=1-o;c=6*r-u,(u&1)!==0&&(c=1-c);const g=n+c*(h-n);let p,y,m;switch(u){default:case 6:case 0:p=h,y=g,m=n;break;case 1:p=g,y=h,m=n;break;case 2:p=n,y=h,m=g;break;case 3:p=n,y=g,m=h;break;case 4:p=g,y=n,m=h;break;case 5:p=h,y=n,m=g;break}return[p*255,y*255,m*255]},s.cmyk.rgb=function(e){const r=e[0]/100,n=e[1]/100,o=e[2]/100,a=e[3]/100,c=1-Math.min(1,r*(1-a)+a),u=1-Math.min(1,n*(1-a)+a),h=1-Math.min(1,o*(1-a)+a);return[c*255,u*255,h*255]},s.xyz.rgb=function(e){const r=e[0]/100,n=e[1]/100,o=e[2]/100;let a,c,u;return a=r*3.2406+n*-1.5372+o*-.4986,c=r*-.9689+n*1.8758+o*.0415,u=r*.0557+n*-.204+o*1.057,a=a>.0031308?1.055*a**(1/2.4)-.055:a*12.92,c=c>.0031308?1.055*c**(1/2.4)-.055:c*12.92,u=u>.0031308?1.055*u**(1/2.4)-.055:u*12.92,a=Math.min(Math.max(0,a),1),c=Math.min(Math.max(0,c),1),u=Math.min(Math.max(0,u),1),[a*255,c*255,u*255]},s.xyz.lab=function(e){let r=e[0],n=e[1],o=e[2];r/=95.047,n/=100,o/=108.883,r=r>.008856?r**(1/3):7.787*r+16/116,n=n>.008856?n**(1/3):7.787*n+16/116,o=o>.008856?o**(1/3):7.787*o+16/116;const a=116*n-16,c=500*(r-n),u=200*(n-o);return[a,c,u]},s.lab.xyz=function(e){const r=e[0],n=e[1],o=e[2];let a,c,u;c=(r+16)/116,a=n/500+c,u=c-o/200;const h=c**3,g=a**3,p=u**3;return c=h>.008856?h:(c-16/116)/7.787,a=g>.008856?g:(a-16/116)/7.787,u=p>.008856?p:(u-16/116)/7.787,a*=95.047,c*=100,u*=108.883,[a,c,u]},s.lab.lch=function(e){const r=e[0],n=e[1],o=e[2];let a;a=Math.atan2(o,n)*360/2/Math.PI,a<0&&(a+=360);const u=Math.sqrt(n*n+o*o);return[r,u,a]},s.lch.lab=function(e){const r=e[0],n=e[1],a=e[2]/360*2*Math.PI,c=n*Math.cos(a),u=n*Math.sin(a);return[r,c,u]},s.rgb.ansi16=function(e,r=null){const[n,o,a]=e;let c=r===null?s.rgb.hsv(e)[2]:r;if(c=Math.round(c/50),c===0)return 30;let u=30+(Math.round(a/255)<<2|Math.round(o/255)<<1|Math.round(n/255));return c===2&&(u+=60),u},s.hsv.ansi16=function(e){return s.rgb.ansi16(s.hsv.rgb(e),e[2])},s.rgb.ansi256=function(e){const r=e[0],n=e[1],o=e[2];return r===n&&n===o?r<8?16:r>248?231:Math.round((r-8)/247*24)+232:16+36*Math.round(r/255*5)+6*Math.round(n/255*5)+Math.round(o/255*5)},s.ansi16.rgb=function(e){let r=e%10;if(r===0||r===7)return e>50&&(r+=3.5),r=r/10.5*255,[r,r,r];const n=(~~(e>50)+1)*.5,o=(r&1)*n*255,a=(r>>1&1)*n*255,c=(r>>2&1)*n*255;return[o,a,c]},s.ansi256.rgb=function(e){if(e>=232){const c=(e-232)*10+8;return[c,c,c]}e-=16;let r;const n=Math.floor(e/36)/5*255,o=Math.floor((r=e%36)/6)/5*255,a=r%6/5*255;return[n,o,a]},s.rgb.hex=function(e){const n=(((Math.round(e[0])&255)<<16)+((Math.round(e[1])&255)<<8)+(Math.round(e[2])&255)).toString(16).toUpperCase();return"000000".substring(n.length)+n},s.hex.rgb=function(e){const r=e.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);if(!r)return[0,0,0];let n=r[0];r[0].length===3&&(n=n.split("").map(h=>h+h).join(""));const o=parseInt(n,16),a=o>>16&255,c=o>>8&255,u=o&255;return[a,c,u]},s.rgb.hcg=function(e){const r=e[0]/255,n=e[1]/255,o=e[2]/255,a=Math.max(Math.max(r,n),o),c=Math.min(Math.min(r,n),o),u=a-c;let h,g;return u<1?h=c/(1-u):h=0,u<=0?g=0:a===r?g=(n-o)/u%6:a===n?g=2+(o-r)/u:g=4+(r-n)/u,g/=6,g%=1,[g*360,u*100,h*100]},s.hsl.hcg=function(e){const r=e[1]/100,n=e[2]/100,o=n<.5?2*r*n:2*r*(1-n);let a=0;return o<1&&(a=(n-.5*o)/(1-o)),[e[0],o*100,a*100]},s.hsv.hcg=function(e){const r=e[1]/100,n=e[2]/100,o=r*n;let a=0;return o<1&&(a=(n-o)/(1-o)),[e[0],o*100,a*100]},s.hcg.rgb=function(e){const r=e[0]/360,n=e[1]/100,o=e[2]/100;if(n===0)return[o*255,o*255,o*255];const a=[0,0,0],c=r%1*6,u=c%1,h=1-u;let g=0;switch(Math.floor(c)){case 0:a[0]=1,a[1]=u,a[2]=0;break;case 1:a[0]=h,a[1]=1,a[2]=0;break;case 2:a[0]=0,a[1]=1,a[2]=u;break;case 3:a[0]=0,a[1]=h,a[2]=1;break;case 4:a[0]=u,a[1]=0,a[2]=1;break;default:a[0]=1,a[1]=0,a[2]=h}return g=(1-n)*o,[(n*a[0]+g)*255,(n*a[1]+g)*255,(n*a[2]+g)*255]},s.hcg.hsv=function(e){const r=e[1]/100,n=e[2]/100,o=r+n*(1-r);let a=0;return o>0&&(a=r/o),[e[0],a*100,o*100]},s.hcg.hsl=function(e){const r=e[1]/100,o=e[2]/100*(1-r)+.5*r;let a=0;return o>0&&o<.5?a=r/(2*o):o>=.5&&o<1&&(a=r/(2*(1-o))),[e[0],a*100,o*100]},s.hcg.hwb=function(e){const r=e[1]/100,n=e[2]/100,o=r+n*(1-r);return[e[0],(o-r)*100,(1-o)*100]},s.hwb.hcg=function(e){const r=e[1]/100,o=1-e[2]/100,a=o-r;let c=0;return a<1&&(c=(o-a)/(1-a)),[e[0],a*100,c*100]},s.apple.rgb=function(e){return[e[0]/65535*255,e[1]/65535*255,e[2]/65535*255]},s.rgb.apple=function(e){return[e[0]/255*65535,e[1]/255*65535,e[2]/255*65535]},s.gray.rgb=function(e){return[e[0]/100*255,e[0]/100*255,e[0]/100*255]},s.gray.hsl=function(e){return[0,0,e[0]]},s.gray.hsv=s.gray.hsl,s.gray.hwb=function(e){return[0,100,e[0]]},s.gray.cmyk=function(e){return[0,0,0,e[0]]},s.gray.lab=function(e){return[e[0],0,0]},s.gray.hex=function(e){const r=Math.round(e[0]/100*255)&255,o=((r<<16)+(r<<8)+r).toString(16).toUpperCase();return"000000".substring(o.length)+o},s.rgb.gray=function(e){return[(e[0]+e[1]+e[2])/3/255*100]}}}),Me=q({"../../node_modules/color-convert/route.js"(t,l){var i=Q();function f(){const r={},n=Object.keys(i);for(let o=n.length,a=0;a<o;a++)r[n[a]]={distance:-1,parent:null};return r}d(f,"buildGraph");function s(r){const n=f(),o=[r];for(n[r].distance=0;o.length;){const a=o.pop(),c=Object.keys(i[a]);for(let u=c.length,h=0;h<u;h++){const g=c[h],p=n[g];p.distance===-1&&(p.distance=n[a].distance+1,p.parent=a,o.unshift(g))}}return n}d(s,"deriveBFS");function v(r,n){return function(o){return n(r(o))}}d(v,"link");function e(r,n){const o=[n[r].parent,r];let a=i[n[r].parent][r],c=n[r].parent;for(;n[c].parent;)o.unshift(n[c].parent),a=v(i[n[c].parent][c],a),c=n[c].parent;return a.conversion=o,a}d(e,"wrapConversion"),l.exports=function(r){const n=s(r),o={},a=Object.keys(n);for(let c=a.length,u=0;u<c;u++){const h=a[u];n[h].parent!==null&&(o[h]=e(h,n))}return o}}}),Ee=q({"../../node_modules/color-convert/index.js"(t,l){var i=Q(),f=Me(),s={},v=Object.keys(i);function e(n){const o=d(function(...a){const c=a[0];return c==null?c:(c.length>1&&(a=c),n(a))},"wrappedFn");return"conversion"in n&&(o.conversion=n.conversion),o}d(e,"wrapRaw");function r(n){const o=d(function(...a){const c=a[0];if(c==null)return c;c.length>1&&(a=c);const u=n(a);if(typeof u=="object")for(let h=u.length,g=0;g<h;g++)u[g]=Math.round(u[g]);return u},"wrappedFn");return"conversion"in n&&(o.conversion=n.conversion),o}d(r,"wrapRounded"),v.forEach(n=>{s[n]={},Object.defineProperty(s[n],"channels",{value:i[n].channels}),Object.defineProperty(s[n],"labels",{value:i[n].labels});const o=f(n);Object.keys(o).forEach(c=>{const u=o[c];s[n][c]=r(u),s[n][c].raw=e(u)})}),l.exports=s}}),M=ke(Ee());function Z(t,l,{signal:i,edges:f}={}){let s,v=null;const e=f!=null&&f.includes("leading"),r=f==null||f.includes("trailing"),n=d(()=>{v!==null&&(t.apply(s,v),s=void 0,v=null)},"invoke"),o=d(()=>{r&&n(),h()},"onTimerEnd");let a=null;const c=d(()=>{a!=null&&clearTimeout(a),a=setTimeout(()=>{a=null,o()},l)},"schedule"),u=d(()=>{a!==null&&(clearTimeout(a),a=null)},"cancelTimer"),h=d(()=>{u(),s=void 0,v=null},"cancel"),g=d(()=>{n()},"flush"),p=d(function(...y){if(i?.aborted)return;s=this,v=y;const m=a==null;c(),e&&m&&n()},"debounced");return p.schedule=c,p.cancel=h,p.flush=g,i?.addEventListener("abort",h,{once:!0}),p}d(Z,"debounce");function ee(t,...l){return te(t,ne,...l)}d(ee,"partial");function te(t,l,...i){const f=d(function(...s){let v=0;const e=i.slice().map(n=>n===l?s[v++]:n),r=s.slice(v);return t.apply(this,e.concat(r))},"partialed");return t.prototype&&(f.prototype=Object.create(t.prototype)),f}d(te,"partialImpl");var ne=Symbol("partial.placeholder");ee.placeholder=ne;function re(t,...l){return oe(t,ae,...l)}d(re,"partialRight");function oe(t,l,...i){const f=d(function(...s){const v=i.filter(a=>a===l).length,e=Math.max(s.length-v,0),r=s.slice(0,e);let n=e;const o=i.slice().map(a=>a===l?s[n++]:a);return t.apply(this,r.concat(o))},"partialedRight");return t.prototype&&(f.prototype=Object.create(t.prototype)),f}d(oe,"partialRightImpl");var ae=Symbol("partialRight.placeholder");re.placeholder=ae;function C(){return(C=Object.assign||function(t){for(var l=1;l<arguments.length;l++){var i=arguments[l];for(var f in i)Object.prototype.hasOwnProperty.call(i,f)&&(t[f]=i[f])}return t}).apply(this,arguments)}d(C,"u");function T(t,l){if(t==null)return{};var i,f,s={},v=Object.keys(t);for(f=0;f<v.length;f++)l.indexOf(i=v[f])>=0||(s[i]=t[i]);return s}d(T,"c");function z(t){var l=x.useRef(t),i=x.useRef(function(f){l.current&&l.current(f)});return l.current=t,i.current}d(z,"i");var R=d(function(t,l,i){return l===void 0&&(l=0),i===void 0&&(i=1),t>i?i:t<l?l:t},"s"),S=d(function(t){return"touches"in t},"f"),K=d(function(t){return t&&t.ownerDocument.defaultView||self},"v"),A=d(function(t,l,i){var f=t.getBoundingClientRect(),s=S(l)?(function(v,e){for(var r=0;r<v.length;r++)if(v[r].identifier===e)return v[r];return v[0]})(l.touches,i):l;return{left:R((s.pageX-(f.left+K(t).pageXOffset))/f.width),top:R((s.pageY-(f.top+K(t).pageYOffset))/f.height)}},"d"),W=d(function(t){!S(t)&&t.preventDefault()},"h"),X=b.memo(function(t){var l=t.onMove,i=t.onKey,f=T(t,["onMove","onKey"]),s=x.useRef(null),v=z(l),e=z(i),r=x.useRef(null),n=x.useRef(!1),o=x.useMemo(function(){var h=d(function(y){W(y),(S(y)?y.touches.length>0:y.buttons>0)&&s.current?v(A(s.current,y,r.current)):p(!1)},"e"),g=d(function(){return p(!1)},"r");function p(y){var m=n.current,_=K(s.current),w=y?_.addEventListener:_.removeEventListener;w(m?"touchmove":"mousemove",h),w(m?"touchend":"mouseup",g)}return d(p,"t"),[function(y){var m=y.nativeEvent,_=s.current;if(_&&(W(m),!(function(I,be){return be&&!S(I)})(m,n.current)&&_)){if(S(m)){n.current=!0;var w=m.changedTouches||[];w.length&&(r.current=w[0].identifier)}_.focus(),v(A(_,m,r.current)),p(!0)}},function(y){var m=y.which||y.keyCode;m<37||m>40||(y.preventDefault(),e({left:m===39?.05:m===37?-.05:0,top:m===40?.05:m===38?-.05:0}))},p]},[e,v]),a=o[0],c=o[1],u=o[2];return x.useEffect(function(){return u},[u]),b.createElement("div",C({},f,{onTouchStart:a,onMouseDown:a,className:"react-colorful__interactive",ref:s,onKeyDown:c,tabIndex:0,role:"slider"}))}),O=d(function(t){return t.filter(Boolean).join(" ")},"g"),D=d(function(t){var l=t.color,i=t.left,f=t.top,s=f===void 0?.5:f,v=O(["react-colorful__pointer",t.className]);return b.createElement("div",{className:v,style:{top:100*s+"%",left:100*i+"%"}},b.createElement("div",{className:"react-colorful__pointer-fill",style:{backgroundColor:l}}))},"p"),k=d(function(t,l,i){return l===void 0&&(l=0),i===void 0&&(i=Math.pow(10,l)),Math.round(i*t)/i},"b"),Ce={grad:.9,turn:360,rad:360/(2*Math.PI)},$e=d(function(t){return ce(F(t))},"x"),F=d(function(t){return t[0]==="#"&&(t=t.substring(1)),t.length<6?{r:parseInt(t[0]+t[0],16),g:parseInt(t[1]+t[1],16),b:parseInt(t[2]+t[2],16),a:t.length===4?k(parseInt(t[3]+t[3],16)/255,2):1}:{r:parseInt(t.substring(0,2),16),g:parseInt(t.substring(2,4),16),b:parseInt(t.substring(4,6),16),a:t.length===8?k(parseInt(t.substring(6,8),16)/255,2):1}},"C"),Re=d(function(t,l){return l===void 0&&(l="deg"),Number(t)*(Ce[l]||1)},"E"),Se=d(function(t){var l=/hsla?\(?\s*(-?\d*\.?\d+)(deg|rad|grad|turn)?[,\s]+(-?\d*\.?\d+)%?[,\s]+(-?\d*\.?\d+)%?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(t);return l?Oe({h:Re(l[1],l[2]),s:Number(l[3]),l:Number(l[4]),a:l[5]===void 0?1:Number(l[5])/(l[6]?100:1)}):{h:0,s:0,v:0,a:1}},"H"),Oe=d(function(t){var l=t.s,i=t.l;return{h:t.h,s:(l*=(i<50?i:100-i)/100)>0?2*l/(i+l)*100:0,v:i+l,a:t.a}},"N"),Ie=d(function(t){return He(se(t))},"w"),le=d(function(t){var l=t.s,i=t.v,f=t.a,s=(200-l)*i/100;return{h:k(t.h),s:k(s>0&&s<200?l*i/100/(s<=100?s:200-s)*100:0),l:k(s/2),a:k(f,2)}},"y"),B=d(function(t){var l=le(t);return"hsl("+l.h+", "+l.s+"%, "+l.l+"%)"},"q"),j=d(function(t){var l=le(t);return"hsla("+l.h+", "+l.s+"%, "+l.l+"%, "+l.a+")"},"k"),se=d(function(t){var l=t.h,i=t.s,f=t.v,s=t.a;l=l/360*6,i/=100,f/=100;var v=Math.floor(l),e=f*(1-i),r=f*(1-(l-v)*i),n=f*(1-(1-l+v)*i),o=v%6;return{r:k(255*[f,r,e,e,n,f][o]),g:k(255*[n,f,f,r,e,e][o]),b:k(255*[e,e,n,f,f,r][o]),a:k(s,2)}},"I"),Ne=d(function(t){var l=/rgba?\(?\s*(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?[,\s]+(-?\d*\.?\d+)(%)?,?\s*[/\s]*(-?\d*\.?\d+)?(%)?\s*\)?/i.exec(t);return l?ce({r:Number(l[1])/(l[2]?100/255:1),g:Number(l[3])/(l[4]?100/255:1),b:Number(l[5])/(l[6]?100/255:1),a:l[7]===void 0?1:Number(l[7])/(l[8]?100:1)}):{h:0,s:0,v:0,a:1}},"z"),N=d(function(t){var l=t.toString(16);return l.length<2?"0"+l:l},"D"),He=d(function(t){var l=t.r,i=t.g,f=t.b,s=t.a,v=s<1?N(k(255*s)):"";return"#"+N(l)+N(i)+N(f)+v},"K"),ce=d(function(t){var l=t.r,i=t.g,f=t.b,s=t.a,v=Math.max(l,i,f),e=v-Math.min(l,i,f),r=e?v===l?(i-f)/e:v===i?2+(f-l)/e:4+(l-i)/e:0;return{h:k(60*(r<0?r+6:r)),s:k(v?e/v*100:0),v:k(v/255*100),a:s}},"L"),ie=b.memo(function(t){var l=t.hue,i=t.onChange,f=O(["react-colorful__hue",t.className]);return b.createElement("div",{className:f},b.createElement(X,{onMove:d(function(s){i({h:360*s.left})},"onMove"),onKey:d(function(s){i({h:R(l+360*s.left,0,360)})},"onKey"),"aria-label":"Hue","aria-valuenow":k(l),"aria-valuemax":"360","aria-valuemin":"0"},b.createElement(D,{className:"react-colorful__hue-pointer",left:l/360,color:B({h:l,s:100,v:100,a:1})})))}),ue=b.memo(function(t){var l=t.hsva,i=t.onChange,f={backgroundColor:B({h:l.h,s:100,v:100,a:1})};return b.createElement("div",{className:"react-colorful__saturation",style:f},b.createElement(X,{onMove:d(function(s){i({s:100*s.left,v:100-100*s.top})},"onMove"),onKey:d(function(s){i({s:R(l.s+100*s.left,0,100),v:R(l.v-100*s.top,0,100)})},"onKey"),"aria-label":"Color","aria-valuetext":"Saturation "+k(l.s)+"%, Brightness "+k(l.v)+"%"},b.createElement(D,{className:"react-colorful__saturation-pointer",top:1-l.v/100,left:l.s/100,color:B(l)})))}),fe=d(function(t,l){if(t===l)return!0;for(var i in t)if(t[i]!==l[i])return!1;return!0},"F"),he=d(function(t,l){return t.replace(/\s/g,"")===l.replace(/\s/g,"")},"P"),je=d(function(t,l){return t.toLowerCase()===l.toLowerCase()||fe(F(t),F(l))},"X");function G(t,l,i){var f=z(i),s=x.useState(function(){return t.toHsva(l)}),v=s[0],e=s[1],r=x.useRef({color:l,hsva:v});x.useEffect(function(){if(!t.equal(l,r.current.color)){var o=t.toHsva(l);r.current={hsva:o,color:l},e(o)}},[l,t]),x.useEffect(function(){var o;fe(v,r.current.hsva)||t.equal(o=t.fromHsva(v),r.current.color)||(r.current={hsva:v,color:o},f(o))},[v,t,f]);var n=x.useCallback(function(o){e(function(a){return Object.assign({},a,o)})},[]);return[v,n]}d(G,"Y");var ze=typeof window<"u"?x.useLayoutEffect:x.useEffect,Pe=d(function(){return typeof __webpack_nonce__<"u"?__webpack_nonce__:void 0},"$"),U=new Map,de=d(function(t){ze(function(){var l=t.current?t.current.ownerDocument:document;if(l!==void 0&&!U.has(l)){var i=l.createElement("style");i.innerHTML=`.react-colorful{position:relative;display:flex;flex-direction:column;width:200px;height:200px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}.react-colorful__saturation{position:relative;flex-grow:1;border-color:transparent;border-bottom:12px solid #000;border-radius:8px 8px 0 0;background-image:linear-gradient(0deg,#000,transparent),linear-gradient(90deg,#fff,hsla(0,0%,100%,0))}.react-colorful__alpha-gradient,.react-colorful__pointer-fill{content:"";position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;border-radius:inherit}.react-colorful__alpha-gradient,.react-colorful__saturation{box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}.react-colorful__alpha,.react-colorful__hue{position:relative;height:24px}.react-colorful__hue{background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red)}.react-colorful__last-control{border-radius:0 0 8px 8px}.react-colorful__interactive{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:inherit;outline:none;touch-action:none}.react-colorful__pointer{position:absolute;z-index:1;box-sizing:border-box;width:28px;height:28px;transform:translate(-50%,-50%);background-color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.2)}.react-colorful__interactive:focus .react-colorful__pointer{transform:translate(-50%,-50%) scale(1.1)}.react-colorful__alpha,.react-colorful__alpha-pointer{background-color:#fff;background-image:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')}.react-colorful__saturation-pointer{z-index:3}.react-colorful__hue-pointer{z-index:2}`,U.set(l,i);var f=Pe();f&&i.setAttribute("nonce",f),l.head.appendChild(i)}},[])},"Q"),qe=d(function(t){var l=t.className,i=t.colorModel,f=t.color,s=f===void 0?i.defaultColor:f,v=t.onChange,e=T(t,["className","colorModel","color","onChange"]),r=x.useRef(null);de(r);var n=G(i,s,v),o=n[0],a=n[1],c=O(["react-colorful",l]);return b.createElement("div",C({},e,{ref:r,className:c}),b.createElement(ue,{hsva:o,onChange:a}),b.createElement(ie,{hue:o.h,onChange:a,className:"react-colorful__last-control"}))},"U"),Te={defaultColor:"000",toHsva:$e,fromHsva:d(function(t){return Ie({h:t.h,s:t.s,v:t.v,a:1})},"fromHsva"),equal:je},Le=d(function(t){return b.createElement(qe,C({},t,{colorModel:Te}))},"Z"),Ke=d(function(t){var l=t.className,i=t.hsva,f=t.onChange,s={backgroundImage:"linear-gradient(90deg, "+j(Object.assign({},i,{a:0}))+", "+j(Object.assign({},i,{a:1}))+")"},v=O(["react-colorful__alpha",l]),e=k(100*i.a);return b.createElement("div",{className:v},b.createElement("div",{className:"react-colorful__alpha-gradient",style:s}),b.createElement(X,{onMove:d(function(r){f({a:r.left})},"onMove"),onKey:d(function(r){f({a:R(i.a+r.left)})},"onKey"),"aria-label":"Alpha","aria-valuetext":e+"%","aria-valuenow":e,"aria-valuemin":"0","aria-valuemax":"100"},b.createElement(D,{className:"react-colorful__alpha-pointer",left:i.a,color:j(i)})))},"ee"),ve=d(function(t){var l=t.className,i=t.colorModel,f=t.color,s=f===void 0?i.defaultColor:f,v=t.onChange,e=T(t,["className","colorModel","color","onChange"]),r=x.useRef(null);de(r);var n=G(i,s,v),o=n[0],a=n[1],c=O(["react-colorful",l]);return b.createElement("div",C({},e,{ref:r,className:c}),b.createElement(ue,{hsva:o,onChange:a}),b.createElement(ie,{hue:o.h,onChange:a}),b.createElement(Ke,{hsva:o,onChange:a,className:"react-colorful__last-control"}))},"re"),Fe={defaultColor:"hsla(0, 0%, 0%, 1)",toHsva:Se,fromHsva:j,equal:he},Be=d(function(t){return b.createElement(ve,C({},t,{colorModel:Fe}))},"ue"),Ve={defaultColor:"rgba(0, 0, 0, 1)",toHsva:Ne,fromHsva:d(function(t){var l=se(t);return"rgba("+l.r+", "+l.g+", "+l.b+", "+l.a+")"},"fromHsva"),equal:he},Xe=d(function(t){return b.createElement(ve,C({},t,{colorModel:Ve}))},"He"),De=E.div({position:"relative",maxWidth:250,'&[aria-readonly="true"]':{opacity:.5}}),Ge=E(J)({position:"absolute",zIndex:1,top:4,left:4,"[aria-readonly=true] &":{cursor:"not-allowed"}}),Ae=E.div({width:200,margin:5,".react-colorful__saturation":{borderRadius:"4px 4px 0 0"},".react-colorful__hue":{boxShadow:"inset 0 0 0 1px rgb(0 0 0 / 5%)"},".react-colorful__last-control":{borderRadius:"0 0 4px 4px"}}),We=E(ye)(({theme:t})=>({fontFamily:t.typography.fonts.base})),Ue=E.div({display:"grid",gridTemplateColumns:"repeat(9, 16px)",gap:6,padding:3,marginTop:5,width:200}),Ye=E.div(({theme:t,active:l})=>({width:16,height:16,boxShadow:l?`${t.appBorderColor} 0 0 0 1px inset, ${t.textMutedColor}50 0 0 0 4px`:`${t.appBorderColor} 0 0 0 1px inset`,borderRadius:t.appBorderRadius})),Je=`url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill-opacity=".05"><path d="M8 0h8v8H8zM0 8h8v8H0z"/></svg>')`,Y=d(({value:t,style:l,...i})=>{const f=`linear-gradient(${t}, ${t}), ${Je}, linear-gradient(#fff, #fff)`;return b.createElement(Ye,{...i,style:{...l,backgroundImage:f}})},"Swatch"),Qe=E(xe.Input)(({theme:t,readOnly:l})=>({width:"100%",paddingLeft:30,paddingRight:30,boxSizing:"border-box",fontFamily:t.typography.fonts.base})),Ze=E(we)(({theme:t})=>({position:"absolute",zIndex:1,top:6,right:7,width:20,height:20,padding:4,boxSizing:"border-box",cursor:"pointer",color:t.input.color})),ge=(t=>(t.RGB="rgb",t.HSL="hsl",t.HEX="hex",t))(ge||{}),L=Object.values(ge),et=/\(([0-9]+),\s*([0-9]+)%?,\s*([0-9]+)%?,?\s*([0-9.]+)?\)/,tt=/^\s*rgba?\(([0-9]+),\s*([0-9]+),\s*([0-9]+),?\s*([0-9.]+)?\)\s*$/i,nt=/^\s*hsla?\(([0-9]+),\s*([0-9]+)%,\s*([0-9]+)%,?\s*([0-9.]+)?\)\s*$/i,V=/^\s*#?([0-9a-f]{3}|[0-9a-f]{6})\s*$/i,rt=/^\s*#?([0-9a-f]{3})\s*$/i,ot={hex:Le,rgb:Xe,hsl:Be},H={hex:"transparent",rgb:"rgba(0, 0, 0, 0)",hsl:"hsla(0, 0%, 0%, 0)"},pe=d(t=>{const l=t?.match(et);if(!l)return[0,0,0,1];const[,i,f,s,v=1]=l;return[i,f,s,v].map(Number)},"stringToArgs"),at=d(t=>{const[l,i,f,s]=pe(t),[v,e,r]=M.default.rgb.hsl([l,i,f])||[0,0,0];return{valid:!0,value:t,keyword:M.default.rgb.keyword([l,i,f]),colorSpace:"rgb",rgb:t,hsl:`hsla(${v}, ${e}%, ${r}%, ${s})`,hex:`#${M.default.rgb.hex([l,i,f]).toLowerCase()}`}},"parseRgb"),lt=d(t=>{const[l,i,f,s]=pe(t),[v,e,r]=M.default.hsl.rgb([l,i,f])||[0,0,0];return{valid:!0,value:t,keyword:M.default.hsl.keyword([l,i,f]),colorSpace:"hsl",rgb:`rgba(${v}, ${e}, ${r}, ${s})`,hsl:t,hex:`#${M.default.hsl.hex([l,i,f]).toLowerCase()}`}},"parseHsl"),st=d(t=>{const l=t.replace("#",""),i=M.default.keyword.rgb(l)||M.default.hex.rgb(l),f=M.default.rgb.hsl(i);let s=t;/[^#a-f0-9]/i.test(t)?s=l:V.test(t)&&(s=`#${l}`);let v=!0;if(s.startsWith("#"))v=V.test(s);else try{M.default.keyword.hex(s)}catch{v=!1}return{valid:v,value:s,keyword:M.default.rgb.keyword(i),colorSpace:"hex",rgb:`rgba(${i[0]}, ${i[1]}, ${i[2]}, 1)`,hsl:`hsla(${f[0]}, ${f[1]}%, ${f[2]}%, 1)`,hex:s}},"parseHexOrKeyword"),$=d(t=>{if(t)return tt.test(t)?at(t):nt.test(t)?lt(t):st(t)},"parseValue"),ct=d((t,l,i)=>{if(!t||!l?.valid)return H[i];if(i!=="hex")return l?.[i]||H[i];if(!l.hex.startsWith("#"))try{return`#${M.default.keyword.hex(l.hex)}`}catch{return H.hex}const f=l.hex.match(rt);if(!f)return V.test(l.hex)?l.hex:H.hex;const[s,v,e]=f[1].split("");return`#${s}${s}${v}${v}${e}${e}`},"getRealValue"),it=d((t,l)=>{const[i,f]=x.useState(t||""),[s,v]=x.useState(()=>$(i)),[e,r]=x.useState(s?.colorSpace||"hex");x.useEffect(()=>{const c=t||"",u=$(c);f(c),v(u),r(u?.colorSpace||"hex")},[t]);const n=x.useMemo(()=>ct(i,s,e).toLowerCase(),[i,s,e]),o=x.useCallback(c=>{const u=$(c),h=u?.value||c||"";f(h),h===""&&(v(void 0),l(void 0)),u&&(v(u),r(u.colorSpace),l(u.value))},[l]),a=x.useCallback(()=>{const u=(L.indexOf(e)+1)%L.length,h=L[u];r(h);const g=s?.[h]||"";f(g),l(g)},[s,e,l]);return{value:i,realValue:n,updateValue:o,color:s,colorSpace:e,cycleColorSpace:a}},"useColorInput"),P=d(t=>t.replace(/\s*/,"").toLowerCase(),"id"),ut=d((t,l,i)=>{const[f,s]=x.useState(l?.valid?[l]:[]);x.useEffect(()=>{l===void 0&&s([])},[l]);const v=x.useMemo(()=>(t||[]).map(n=>typeof n=="string"?$(n):n.title?{...$(n.color),keyword:n.title}:$(n.color)).concat(f).filter(Boolean).slice(-27),[t,f]),e=x.useCallback(r=>{r?.valid&&(v.some(n=>n&&n[i]&&P(n[i]||"")===P(r[i]||""))||s(n=>n.concat(r)))},[i,v]);return{presets:v,addPreset:e}},"usePresets"),ft=d(({name:t,value:l,onChange:i,onFocus:f,onBlur:s,presetColors:v,startOpen:e=!1,argType:r})=>{const n=x.useCallback(Z(i,200),[i]),{value:o,realValue:a,updateValue:c,color:u,colorSpace:h,cycleColorSpace:g}=it(l,n),{presets:p,addPreset:y}=ut(v??[],u,h),m=ot[h],_=!!r?.table?.readonly;return b.createElement(De,{"aria-readonly":_},b.createElement(Ge,{startOpen:e,trigger:_?null:void 0,closeOnOutsideClick:!0,onVisibleChange:()=>u&&y(u),tooltip:b.createElement(Ae,null,b.createElement(m,{color:a==="transparent"?"#000000":a,onChange:c,onFocus:f,onBlur:s}),p.length>0&&b.createElement(Ue,null,p.map((w,I)=>b.createElement(J,{key:`${w?.value||I}-${I}`,hasChrome:!1,tooltip:b.createElement(We,{note:w?.keyword||w?.value||""})},b.createElement(Y,{value:w?.[h]||"",active:!!(u&&w&&w[h]&&P(w[h]||"")===P(u[h])),onClick:()=>w&&c(w.value||"")})))))},b.createElement(Y,{value:a,style:{margin:4}})),b.createElement(Qe,{id:me(t),value:o,onChange:w=>c(w.target.value),onFocus:w=>w.target.select(),readOnly:_,placeholder:"Choose color..."}),o?b.createElement(Ze,{onClick:g}):null)},"ColorControl"),gt=ft;export{ft as ColorControl,gt as default};

package/dist/storybook/assets/Colors.stories-Cmp-AEM5.js

@@ -0,0 +1,83 @@
+import{x as a}from"./iframe-D3S76tLX.js";import"./preload-helper-PPVm8Dsz.js";const b=c=>{const r=[...c.palette?.entries()??[]];return r.length>0&&r[0][1].includes("-gradient")?a`
+      <div class="my-10 flex flex-wrap gap-4">
+        ${r.map(([e,d])=>a`
+            <div class="w-[200px] overflow-clip rounded-lg bg-white shadow-md">
+              <div class="${d} h-[120px] w-full"></div>
+              <div class="p-3">
+                <h3 class="text-sm font-semibold capitalize text-black">${e}</h3>
+                <p class="text-xs text-gray-600">${e} gradient</p>
+              </div>
+            </div>
+          `)}
+      </div>
+    `:a`
+    <div class="my-10 flex flex-wrap gap-2">
+      ${r.map(([e,d])=>a`
+          <div class="flex flex-col overflow-clip rounded-lg shadow-md">
+            <div class="${d} size-16"></div>
+            <div class="grid h-7 place-items-center bg-white">
+              <div class="text-[10px] font-semibold text-gray-700">${e}</div>
+            </div>
+          </div>
+        `)}
+    </div>
+  `},m={title:"Design System/Colors",component:"btu-theme",tags:["autodocs"],parameters:{controls:{exclude:["palette"]},docs:{subtitle:"We've replaced the default Tailwind colors with our own palette to match the design vocabulary. Specifically replacing 'blue' with 'primary', 'green' with 'success', 'yellow' with 'warning', and 'red' with 'error'. For example, instead of 'bg-blue-400', use 'bg-primary-400'."}},render:c=>b(c)},s={parameters:{docs:{description:{story:"Used for primary call to actions, visual UI elements, active and clicked states, and focused containers."}}},args:{palette:new Map([["25","bg-primary-25"],["50","bg-primary-50"],["100","bg-primary-100"],["200","bg-primary-200"],["300","bg-primary-300"],["400","bg-primary-400"],["500","bg-primary-500"],["600","bg-primary-600"],["700","bg-primary-700"],["800","bg-primary-800"],["900","bg-primary-900"]])}},t={parameters:{docs:{description:{story:"Success colors communicate a positive action, postive trend, or a successful confirmation. If you're using green as your primary color, it can be helpful to introduce a different hue for your success green."}}},args:{palette:new Map([["25","bg-success-25"],["50","bg-success-50"],["100","bg-success-100"],["200","bg-success-200"],["300","bg-success-300"],["400","bg-success-400"],["500","bg-success-500"],["600","bg-success-600"],["700","bg-success-700"],["800","bg-success-800"],["900","bg-success-900"]])}},o={parameters:{docs:{description:{story:`Warning colors can communicate that an action is potentially destructive or "on-hold". These colors are commonly used in confirmations to grab the users' attention.`}}},args:{palette:new Map([["25","bg-warning-25"],["50","bg-warning-50"],["100","bg-warning-100"],["200","bg-warning-200"],["300","bg-warning-300"],["400","bg-warning-400"],["500","bg-warning-500"],["600","bg-warning-600"],["700","bg-warning-700"],["800","bg-warning-800"],["900","bg-warning-900"]])}},n={parameters:{docs:{description:{story:'Error colors are used across error states and in "destructive" actions. They communicate a destructive/negative action, such as deleting or archiving an object.'}}},args:{palette:new Map([["25","bg-error-25"],["50","bg-error-50"],["100","bg-error-100"],["200","bg-error-200"],["300","bg-error-300"],["400","bg-error-400"],["500","bg-error-500"],["600","bg-error-600"],["700","bg-error-700"],["800","bg-error-800"],["900","bg-error-900"]])}},i={parameters:{docs:{description:{story:"Gray is a neutral color and is the foundation of the color system. Almost everything in UI design — text, form fields, backgrounds, dividers — are usually gray."}}},args:{palette:new Map([["25","bg-gray-25"],["50","bg-gray-50"],["100","bg-gray-100"],["200","bg-gray-200"],["300","bg-gray-300"],["400","bg-gray-400"],["500","bg-gray-500"],["600","bg-gray-600"],["700","bg-gray-700"],["800","bg-gray-800"],["900","bg-gray-900"]])}},g={args:{palette:new Map([["ai","bg-ai-gradient"],["error","bg-error-gradient"],["gray","bg-gray-gradient"],["primary","bg-primary-gradient"],["purple","bg-purple-gradient"],["rose","bg-rose-gradient"],["success","bg-success-gradient"],["teal","bg-teal-gradient"],["warning","bg-warning-gradient"]])}};s.parameters={...s.parameters,docs:{...s.parameters?.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: 'Used for primary call to actions, visual UI elements, active and clicked states, and focused containers.'
+      }
+    }
+  },
+  args: {
+    palette: new Map([['25', 'bg-primary-25'], ['50', 'bg-primary-50'], ['100', 'bg-primary-100'], ['200', 'bg-primary-200'], ['300', 'bg-primary-300'], ['400', 'bg-primary-400'], ['500', 'bg-primary-500'], ['600', 'bg-primary-600'], ['700', 'bg-primary-700'], ['800', 'bg-primary-800'], ['900', 'bg-primary-900']])
+  }
+}`,...s.parameters?.docs?.source}}};t.parameters={...t.parameters,docs:{...t.parameters?.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: "Success colors communicate a positive action, postive trend, or a successful confirmation. If you're using green as your primary color, it can be helpful to introduce a different hue for your success green."
+      }
+    }
+  },
+  args: {
+    palette: new Map([['25', 'bg-success-25'], ['50', 'bg-success-50'], ['100', 'bg-success-100'], ['200', 'bg-success-200'], ['300', 'bg-success-300'], ['400', 'bg-success-400'], ['500', 'bg-success-500'], ['600', 'bg-success-600'], ['700', 'bg-success-700'], ['800', 'bg-success-800'], ['900', 'bg-success-900']])
+  }
+}`,...t.parameters?.docs?.source}}};o.parameters={...o.parameters,docs:{...o.parameters?.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: 'Warning colors can communicate that an action is potentially destructive or "on-hold". These colors are commonly used in confirmations to grab the users\\' attention.'
+      }
+    }
+  },
+  args: {
+    palette: new Map([['25', 'bg-warning-25'], ['50', 'bg-warning-50'], ['100', 'bg-warning-100'], ['200', 'bg-warning-200'], ['300', 'bg-warning-300'], ['400', 'bg-warning-400'], ['500', 'bg-warning-500'], ['600', 'bg-warning-600'], ['700', 'bg-warning-700'], ['800', 'bg-warning-800'], ['900', 'bg-warning-900']])
+  }
+}`,...o.parameters?.docs?.source}}};n.parameters={...n.parameters,docs:{...n.parameters?.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: 'Error colors are used across error states and in "destructive" actions. They communicate a destructive/negative action, such as deleting or archiving an object.'
+      }
+    }
+  },
+  args: {
+    palette: new Map([['25', 'bg-error-25'], ['50', 'bg-error-50'], ['100', 'bg-error-100'], ['200', 'bg-error-200'], ['300', 'bg-error-300'], ['400', 'bg-error-400'], ['500', 'bg-error-500'], ['600', 'bg-error-600'], ['700', 'bg-error-700'], ['800', 'bg-error-800'], ['900', 'bg-error-900']])
+  }
+}`,...n.parameters?.docs?.source}}};i.parameters={...i.parameters,docs:{...i.parameters?.docs,source:{originalSource:`{
+  parameters: {
+    docs: {
+      description: {
+        story: 'Gray is a neutral color and is the foundation of the color system. Almost everything in UI design — text, form fields, backgrounds, dividers — are usually gray.'
+      }
+    }
+  },
+  args: {
+    palette: new Map([['25', 'bg-gray-25'], ['50', 'bg-gray-50'], ['100', 'bg-gray-100'], ['200', 'bg-gray-200'], ['300', 'bg-gray-300'], ['400', 'bg-gray-400'], ['500', 'bg-gray-500'], ['600', 'bg-gray-600'], ['700', 'bg-gray-700'], ['800', 'bg-gray-800'], ['900', 'bg-gray-900']])
+  }
+}`,...i.parameters?.docs?.source}}};g.parameters={...g.parameters,docs:{...g.parameters?.docs,source:{originalSource:`{
+  args: {
+    palette: new Map([['ai', 'bg-ai-gradient'], ['error', 'bg-error-gradient'], ['gray', 'bg-gray-gradient'], ['primary', 'bg-primary-gradient'], ['purple', 'bg-purple-gradient'], ['rose', 'bg-rose-gradient'], ['success', 'bg-success-gradient'], ['teal', 'bg-teal-gradient'], ['warning', 'bg-warning-gradient']])
+  }
+}`,...g.parameters?.docs?.source}}};const y=["Primary","Success","Warning","Error","Gray","Gradients"];export{n as Error,g as Gradients,i as Gray,s as Primary,t as Success,o as Warning,y as __namedExportsOrder,m as default};

package/dist/storybook/assets/{Heading.stories-tM9cqImg.js → Heading.stories-C_fXiWQt.js}

@@ -1,3 +1,3 @@
-import{x as s}from"./iframe-DT_nhsJu.js";import"./preload-helper-PPVm8Dsz.js";const a=({size:t})=>s` <div class=${[`btu-heading-${t}`].join(" ")}>Heading</div> `,n={title:"Components/Heading",component:"btu-heading",tags:["autodocs"],parameters:{docs:{subtitle:"btu-heading"},controls:{expanded:!0}},render:t=>a(t),argTypes:{size:{control:{type:"range",min:1,max:5,step:1},description:"Heading size from 1 to 5, where 1 is the largest and 5 is the smallest."}},args:{size:1}},e={args:{}};e.parameters={...e.parameters,docs:{...e.parameters?.docs,source:{originalSource:`{
+import{x as s}from"./iframe-D3S76tLX.js";import"./preload-helper-PPVm8Dsz.js";const a=({size:t})=>s` <div class=${[`btu-heading-${t}`].join(" ")}>Heading</div> `,n={title:"Components/Heading",component:"btu-heading",tags:["autodocs"],parameters:{docs:{subtitle:"btu-heading"},controls:{expanded:!0}},render:t=>a(t),argTypes:{size:{control:{type:"range",min:1,max:5,step:1},description:"Heading size from 1 to 5, where 1 is the largest and 5 is the smallest."}},args:{size:1}},e={args:{}};e.parameters={...e.parameters,docs:{...e.parameters?.docs,source:{originalSource:`{
   args: {}
 }`,...e.parameters?.docs?.source}}};const i=["Default"];export{e as Default,i as __namedExportsOrder,n as default};