@womp/kookie-ui 0.13.3 → 0.14.0

package/dist/cjs/components/icon-button.props.js

@@ -1,2 +1,2 @@
-"use strict";var r=Object.defineProperty;var i=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var c=(o,e)=>{for(var a in e)r(o,a,{get:e[a],enumerable:!0})},m=(o,e,a,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of u(e))!d.call(o,s)&&s!==a&&r(o,s,{get:()=>e[s],enumerable:!(t=i(e,s))||t.enumerable});return o};var y=o=>m(r({},"__esModule",{value:!0}),o);var h={};c(h,{iconButtonPropDefs:()=>f});module.exports=y(h);var n={asChild:{type:"boolean"}};var D=["gray","gold","bronze","brown","yellow","amber","orange","tomato","red","ruby","crimson","pink","plum","purple","violet","iris","indigo","blue","cyan","teal","jade","green","grass","lime","mint","sky"];var l={color:{type:"enum",values:D,default:""}};var P=["none","small","medium","large","full"],p={radius:{type:"enum",values:P,default:void 0}};var b=["1","2","3","4"],g=["classic","solid","soft","surface","outline","ghost","override"],v=["solid","translucent"],C=["solid","translucent"],f={...n,size:{type:"enum",className:"rt-r-size",values:b,default:"2",responsive:!0},variant:{type:"enum",className:"rt-variant",values:g,default:"solid"},...l,...p,loading:{type:"boolean",className:"rt-loading",default:!1},fullWidth:{type:"boolean",className:"rt-full-width",default:!1},material:{type:"enum",values:C,default:void 0},panelBackground:{type:"enum",values:v,default:void 0},flush:{type:"boolean",default:!1}};
+"use strict";var s=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var d=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var m=(e,o)=>{for(var a in o)s(e,a,{get:o[a],enumerable:!0})},y=(e,o,a,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of d(o))!c.call(e,r)&&r!==a&&s(e,r,{get:()=>o[r],enumerable:!(t=u(o,r))||t.enumerable});return e};var b=e=>y(s({},"__esModule",{value:!0}),e);var w={};m(w,{iconButtonPropDefs:()=>f});module.exports=b(w);function n(e){return e==="classic"?"raised":(e==="override"&&void 0,e)}var i={asChild:{type:"boolean"}};var D=["gray","gold","bronze","brown","yellow","amber","orange","tomato","red","ruby","crimson","pink","plum","purple","violet","iris","indigo","blue","cyan","teal","jade","green","grass","lime","mint","sky"];var l={color:{type:"enum",values:D,default:""}};var P=["none","small","medium","large","full"],p={radius:{type:"enum",values:P,default:void 0}};var v=["1","2","3","4"],g=["raised","solid","soft","surface","outline","ghost","override","classic"],C=["solid","translucent"],h=["solid","translucent"],f={...i,size:{type:"enum",className:"rt-r-size",values:v,default:"2",responsive:!0},variant:{type:"enum",className:"rt-variant",values:g,default:"raised",parseValue:n},...l,...p,loading:{type:"boolean",className:"rt-loading",default:!1},fullWidth:{type:"boolean",className:"rt-full-width",default:!1},material:{type:"enum",values:h,default:void 0},panelBackground:{type:"enum",values:C,default:void 0},flush:{type:"boolean",default:!1}};
 //# sourceMappingURL=icon-button.props.js.map

package/dist/cjs/components/icon-button.props.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/components/icon-button.props.tsx", "../../../src/props/as-child.prop.ts", "../../../src/props/color.prop.ts", "../../../src/props/radius.prop.ts", "../../../src/components/_internal/base-button.props.ts"],
-  "sourcesContent": ["export { baseButtonPropDefs as iconButtonPropDefs } from './_internal/base-button.props.js';\n", "import type { PropDef } from './prop-def.js';\n\nconst asChildPropDef = {\n  /**\n   * Composes the component into its immediate child instead of rendering its own HTML element.\n   * You\u2019ll have to provide a single React Element child.\n   */\n  asChild: {\n    type: 'boolean',\n  },\n} satisfies {\n  asChild: PropDef<boolean>;\n};\n\nexport { asChildPropDef };\n", "import type { PropDef } from './prop-def.js';\n\n// prettier-ignore\nconst accentColors = ['gray', 'gold', 'bronze', 'brown', 'yellow', 'amber', 'orange', 'tomato', 'red', 'ruby', 'crimson', 'pink', 'plum', 'purple', 'violet', 'iris', 'indigo', 'blue', 'cyan', 'teal', 'jade', 'green', 'grass', 'lime', 'mint', 'sky'] as const;\n\nconst grayColors = ['auto', 'gray', 'mauve', 'slate', 'sage', 'olive', 'sand'] as const;\n\nconst colorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: undefined as (typeof accentColors)[number] | undefined,\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\n// 1. When used on components that compose Text, sets the color of the text to the current accent.\n// 2. Re-declares the accent role tokens (`--accent-ink`, `--accent-solid`, ...) that descendants read.\nconst accentColorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: '' as (typeof accentColors)[number],\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\nexport {\n  accentColorPropDef,\n  colorPropDef,\n  //\n  accentColors,\n  grayColors,\n};\n", "import type { PropDef } from './prop-def.js';\n\nconst radii = ['none', 'small', 'medium', 'large', 'full'] as const;\n\nconst radiusPropDef = {\n  radius: {\n    type: 'enum',\n    values: radii,\n    default: undefined,\n  },\n} satisfies {\n  radius: PropDef<(typeof radii)[number]>;\n};\n\nexport { radiusPropDef, radii };\n", "import { asChildPropDef } from '../../props/as-child.prop.js';\nimport { accentColorPropDef } from '../../props/color.prop.js';\nimport { radiusPropDef } from '../../props/radius.prop.js';\n\nimport type { PropDef } from '../../props/prop-def.js';\n\n/**\n * Available button sizes for responsive design\n * Size 1: 24px - Compact for toolbars and dense interfaces\n * Size 2: 32px - Standard for most interface contexts\n * Size 3: 40px - Large for important actions and mobile touch targets\n * Size 4: 48px - Extra large for hero sections and maximum impact\n */\nconst sizes = ['1', '2', '3', '4'] as const;\n\n/**\n * Available button variants for different visual contexts\n * - classic: Premium, sophisticated appearance\n * - solid: Primary actions that should be noticed first\n * - soft: Content-heavy interfaces, natural integration\n * - surface: Elevated appearance with subtle depth\n * - outline: Secondary actions that support primary actions\n * - ghost: Utility functions that don't compete for attention\n */\nconst variants = ['classic', 'solid', 'soft', 'surface', 'outline', 'ghost', 'override'] as const;\n\n/**\n * Available panel background options (deprecated)\n * @deprecated Use `materials` instead\n */\nconst panelBackgrounds = ['solid', 'translucent'] as const;\n\n/**\n * Available material options for visual rendering\n * - solid: Opaque backgrounds and borders\n * - translucent: Elevated effects with depth and visual separation\n */\nconst materials = ['solid', 'translucent'] as const;\n\n/**\n * Base button prop definitions that define the component's API\n * \n * These props are used by all button variants (Button, IconButton, etc.)\n * to ensure consistent behavior and styling across the design system.\n * \n * Key features:\n * - Responsive sizing with mobile-first approach\n * - Six visual variants for different interface contexts\n * - Comprehensive color system with semantic meanings\n * - Loading states with automatic accessibility\n * - Material system for visual depth and elevation\n * - Polymorphic rendering support via asChild\n * \n * @example\n * ```tsx\n * // Basic button with default props\n * <BaseButton>Click me</BaseButton>\n * \n * // Button with custom size and variant\n * <BaseButton size=\"3\" variant=\"solid\">Primary Action</BaseButton>\n * \n * // Button with loading state\n * <BaseButton loading>Processing...</BaseButton>\n * \n * // Button with translucent material\n * <BaseButton material=\"translucent\">Elevated Button</BaseButton>\n * ```\n */\nconst baseButtonPropDefs = {\n  ...asChildPropDef,\n  /**\n   * Button size for responsive design and interface density\n   * Supports responsive objects: { initial: '1', sm: '2', md: '3', lg: '4' }\n   */\n  size: { type: 'enum', className: 'rt-r-size', values: sizes, default: '2', responsive: true },\n  /**\n   * Visual variant that determines the button's appearance and context\n   */\n  variant: { type: 'enum', className: 'rt-variant', values: variants, default: 'solid' },\n  ...accentColorPropDef,\n  ...radiusPropDef,\n  /**\n   * Loading state that shows a spinner and disables interaction\n   * Automatically sets disabled=true and provides accessibility announcements\n   */\n  loading: { type: 'boolean', className: 'rt-loading', default: false },\n  /**\n   * Full width mode that expands the button to fill its container\n   * Useful for mobile layouts and form submissions\n   */\n  fullWidth: { type: 'boolean', className: 'rt-full-width', default: false },\n  /**\n   * Material type for visual rendering and depth effects\n   * Controls how the button renders its visual elements\n   */\n  material: { type: 'enum', values: materials, default: undefined },\n  /**\n   * Panel background type (deprecated)\n   * @deprecated Use `material` prop instead. This prop will be removed in a future version.\n   */\n  panelBackground: { type: 'enum', values: panelBackgrounds, default: undefined },\n  /**\n   * Flush mode that removes visual padding for seamless text integration\n   * Only effective with ghost variant\n   */\n  flush: { type: 'boolean', default: false },\n} satisfies {\n  size: PropDef<(typeof sizes)[number]>;\n  variant: PropDef<(typeof variants)[number]>;\n  loading: PropDef<boolean>;\n  fullWidth: PropDef<boolean>;\n  material: PropDef<(typeof materials)[number] | undefined>;\n  panelBackground: PropDef<(typeof panelBackgrounds)[number] | undefined>;\n  flush: PropDef<boolean>;\n};\n\nexport { baseButtonPropDefs };\n"],
-  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,wBAAAE,IAAA,eAAAC,EAAAH,GCEA,IAAMI,EAAiB,CAKrB,QAAS,CACP,KAAM,SACR,CACF,ECPA,IAAMC,EAAe,CAAC,OAAQ,OAAQ,SAAU,QAAS,SAAU,QAAS,SAAU,SAAU,MAAO,OAAQ,UAAW,OAAQ,OAAQ,SAAU,SAAU,OAAQ,SAAU,OAAQ,OAAQ,OAAQ,OAAQ,QAAS,QAAS,OAAQ,OAAQ,KAAK,EAgBvP,IAAMC,EAAqB,CACzB,MAAO,CACL,KAAM,OACN,OAAQC,EACR,QAAS,EACX,CACF,ECvBA,IAAMC,EAAQ,CAAC,OAAQ,QAAS,SAAU,QAAS,MAAM,EAEnDC,EAAgB,CACpB,OAAQ,CACN,KAAM,OACN,OAAQD,EACR,QAAS,MACX,CACF,ECGA,IAAME,EAAQ,CAAC,IAAK,IAAK,IAAK,GAAG,EAW3BC,EAAW,CAAC,UAAW,QAAS,OAAQ,UAAW,UAAW,QAAS,UAAU,EAMjFC,EAAmB,CAAC,QAAS,aAAa,EAO1CC,EAAY,CAAC,QAAS,aAAa,EA+BnCC,EAAqB,CACzB,GAAGC,EAKH,KAAM,CAAE,KAAM,OAAQ,UAAW,YAAa,OAAQL,EAAO,QAAS,IAAK,WAAY,EAAK,EAI5F,QAAS,CAAE,KAAM,OAAQ,UAAW,aAAc,OAAQC,EAAU,QAAS,OAAQ,EACrF,GAAGK,EACH,GAAGC,EAKH,QAAS,CAAE,KAAM,UAAW,UAAW,aAAc,QAAS,EAAM,EAKpE,UAAW,CAAE,KAAM,UAAW,UAAW,gBAAiB,QAAS,EAAM,EAKzE,SAAU,CAAE,KAAM,OAAQ,OAAQJ,EAAW,QAAS,MAAU,EAKhE,gBAAiB,CAAE,KAAM,OAAQ,OAAQD,EAAkB,QAAS,MAAU,EAK9E,MAAO,CAAE,KAAM,UAAW,QAAS,EAAM,CAC3C",
-  "names": ["icon_button_props_exports", "__export", "baseButtonPropDefs", "__toCommonJS", "asChildPropDef", "accentColors", "accentColorPropDef", "accentColors", "radii", "radiusPropDef", "sizes", "variants", "panelBackgrounds", "materials", "baseButtonPropDefs", "asChildPropDef", "accentColorPropDef", "radiusPropDef"]
+  "sources": ["../../../src/components/icon-button.props.tsx", "../../../src/helpers/parse-variant.ts", "../../../src/props/as-child.prop.ts", "../../../src/props/color.prop.ts", "../../../src/props/radius.prop.ts", "../../../src/components/_internal/base-button.props.ts"],
+  "sourcesContent": ["export { baseButtonPropDefs as iconButtonPropDefs } from './_internal/base-button.props.js';\n", "import { warnDeprecated } from './warn-deprecated.js';\n\n/**\n * `classic` was renamed `raised` in 0.14.0. The old name still renders, as `raised`, with a\n * one-time warning in development. Button's `override` is not a look but a way out of the\n * styles, so it warns too. Both are removed in 0.15.0.\n */\nfunction parseVariant(value: string): string {\n  if (value === 'classic') {\n    warnDeprecated('`variant=\"classic\"` is deprecated and will be removed in 0.15.0. Use `variant=\"raised\"`.');\n    return 'raised';\n  }\n  if (value === 'override') {\n    warnDeprecated(\n      '`variant=\"override\"` is deprecated and will be removed in 0.15.0. Style the component with `className`, `style` or its CSS variables instead.',\n    );\n  }\n  return value;\n}\n\nexport { parseVariant };\n", "import type { PropDef } from './prop-def.js';\n\nconst asChildPropDef = {\n  /**\n   * Composes the component into its immediate child instead of rendering its own HTML element.\n   * You\u2019ll have to provide a single React Element child.\n   */\n  asChild: {\n    type: 'boolean',\n  },\n} satisfies {\n  asChild: PropDef<boolean>;\n};\n\nexport { asChildPropDef };\n", "import type { PropDef } from './prop-def.js';\n\n// prettier-ignore\nconst accentColors = ['gray', 'gold', 'bronze', 'brown', 'yellow', 'amber', 'orange', 'tomato', 'red', 'ruby', 'crimson', 'pink', 'plum', 'purple', 'violet', 'iris', 'indigo', 'blue', 'cyan', 'teal', 'jade', 'green', 'grass', 'lime', 'mint', 'sky'] as const;\n\nconst grayColors = ['auto', 'gray', 'mauve', 'slate', 'sage', 'olive', 'sand'] as const;\n\nconst colorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: undefined as (typeof accentColors)[number] | undefined,\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\n// 1. When used on components that compose Text, sets the color of the text to the current accent.\n// 2. Re-declares the accent role tokens (`--accent-ink`, `--accent-solid`, ...) that descendants read.\nconst accentColorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: '' as (typeof accentColors)[number],\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\n// For components whose colour comes from their content (Badge, Avatar, Code, Callout,\n// UserCard): they rest gray, and `color` picks a category when it means something.\nconst grayAccentColorPropDef = {\n  color: {\n    type: 'enum',\n    values: accentColors,\n    default: 'gray' as (typeof accentColors)[number],\n  },\n} satisfies {\n  color: PropDef<(typeof accentColors)[number]>;\n};\n\nexport {\n  accentColorPropDef,\n  grayAccentColorPropDef,\n  colorPropDef,\n  //\n  accentColors,\n  grayColors,\n};\n", "import type { PropDef } from './prop-def.js';\n\nconst radii = ['none', 'small', 'medium', 'large', 'full'] as const;\n\nconst radiusPropDef = {\n  radius: {\n    type: 'enum',\n    values: radii,\n    default: undefined,\n  },\n} satisfies {\n  radius: PropDef<(typeof radii)[number]>;\n};\n\nexport { radiusPropDef, radii };\n", "import { parseVariant } from '../../helpers/parse-variant.js';\nimport { asChildPropDef } from '../../props/as-child.prop.js';\nimport { accentColorPropDef } from '../../props/color.prop.js';\nimport { radiusPropDef } from '../../props/radius.prop.js';\n\nimport type { PropDef } from '../../props/prop-def.js';\n\n/**\n * Available button sizes for responsive design\n * Size 1: 24px - Compact for toolbars and dense interfaces\n * Size 2: 32px - Standard for most interface contexts\n * Size 3: 40px - Large for important actions and mobile touch targets\n * Size 4: 48px - Extra large for hero sections and maximum impact\n */\nconst sizes = ['1', '2', '3', '4'] as const;\n\n/**\n * Available button variants for different visual contexts\n * - raised: lifted off its ground, with an edge and a shadow (the default)\n * - solid: Primary actions that should be noticed first\n * - soft: Content-heavy interfaces, natural integration\n * - surface: Elevated appearance with subtle depth\n * - outline: Secondary actions that support primary actions\n * - ghost: Utility functions that don't compete for attention\n */\nconst variants = ['raised', 'solid', 'soft', 'surface', 'outline', 'ghost', 'override', 'classic'] as const;\n\n/**\n * Available panel background options (deprecated)\n * @deprecated Use `materials` instead\n */\nconst panelBackgrounds = ['solid', 'translucent'] as const;\n\n/**\n * Available material options for visual rendering\n * - solid: Opaque backgrounds and borders\n * - translucent: Elevated effects with depth and visual separation\n */\nconst materials = ['solid', 'translucent'] as const;\n\n/**\n * Base button prop definitions that define the component's API\n * \n * These props are used by all button variants (Button, IconButton, etc.)\n * to ensure consistent behavior and styling across the design system.\n * \n * Key features:\n * - Responsive sizing with mobile-first approach\n * - Six visual variants for different interface contexts\n * - Comprehensive color system with semantic meanings\n * - Loading states with automatic accessibility\n * - Material system for visual depth and elevation\n * - Polymorphic rendering support via asChild\n * \n * @example\n * ```tsx\n * // Basic button with default props\n * <BaseButton>Click me</BaseButton>\n * \n * // Button with custom size and variant\n * <BaseButton size=\"3\" variant=\"solid\">Primary Action</BaseButton>\n * \n * // Button with loading state\n * <BaseButton loading>Processing...</BaseButton>\n * \n * // Button with translucent material\n * <BaseButton material=\"translucent\">Elevated Button</BaseButton>\n * ```\n */\nconst baseButtonPropDefs = {\n  ...asChildPropDef,\n  /**\n   * Button size for responsive design and interface density\n   * Supports responsive objects: { initial: '1', sm: '2', md: '3', lg: '4' }\n   */\n  size: { type: 'enum', className: 'rt-r-size', values: sizes, default: '2', responsive: true },\n  /**\n   * Visual variant that determines the button's appearance and context\n   */\n  variant: { type: 'enum', className: 'rt-variant', values: variants, default: 'raised', parseValue: parseVariant },\n  ...accentColorPropDef,\n  ...radiusPropDef,\n  /**\n   * Loading state that shows a spinner and disables interaction\n   * Automatically sets disabled=true and provides accessibility announcements\n   */\n  loading: { type: 'boolean', className: 'rt-loading', default: false },\n  /**\n   * Full width mode that expands the button to fill its container\n   * Useful for mobile layouts and form submissions\n   */\n  fullWidth: { type: 'boolean', className: 'rt-full-width', default: false },\n  /**\n   * Material type for visual rendering and depth effects\n   * Controls how the button renders its visual elements\n   */\n  material: { type: 'enum', values: materials, default: undefined },\n  /**\n   * Panel background type (deprecated)\n   * @deprecated Use `material` prop instead. This prop will be removed in a future version.\n   */\n  panelBackground: { type: 'enum', values: panelBackgrounds, default: undefined },\n  /**\n   * Flush mode that removes visual padding for seamless text integration\n   * Only effective with ghost variant\n   */\n  flush: { type: 'boolean', default: false },\n} satisfies {\n  size: PropDef<(typeof sizes)[number]>;\n  variant: PropDef<(typeof variants)[number]>;\n  loading: PropDef<boolean>;\n  fullWidth: PropDef<boolean>;\n  material: PropDef<(typeof materials)[number] | undefined>;\n  panelBackground: PropDef<(typeof panelBackgrounds)[number] | undefined>;\n  flush: PropDef<boolean>;\n};\n\nexport { baseButtonPropDefs };\n"],
+  "mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,wBAAAE,IAAA,eAAAC,EAAAH,GCOA,SAASI,EAAaC,EAAuB,CAC3C,OAAIA,IAAU,UAEL,UAELA,IAAU,YACZ,OAIKA,EACT,CChBA,IAAMC,EAAiB,CAKrB,QAAS,CACP,KAAM,SACR,CACF,ECPA,IAAMC,EAAe,CAAC,OAAQ,OAAQ,SAAU,QAAS,SAAU,QAAS,SAAU,SAAU,MAAO,OAAQ,UAAW,OAAQ,OAAQ,SAAU,SAAU,OAAQ,SAAU,OAAQ,OAAQ,OAAQ,OAAQ,QAAS,QAAS,OAAQ,OAAQ,KAAK,EAgBvP,IAAMC,EAAqB,CACzB,MAAO,CACL,KAAM,OACN,OAAQC,EACR,QAAS,EACX,CACF,ECvBA,IAAMC,EAAQ,CAAC,OAAQ,QAAS,SAAU,QAAS,MAAM,EAEnDC,EAAgB,CACpB,OAAQ,CACN,KAAM,OACN,OAAQD,EACR,QAAS,MACX,CACF,ECIA,IAAME,EAAQ,CAAC,IAAK,IAAK,IAAK,GAAG,EAW3BC,EAAW,CAAC,SAAU,QAAS,OAAQ,UAAW,UAAW,QAAS,WAAY,SAAS,EAM3FC,EAAmB,CAAC,QAAS,aAAa,EAO1CC,EAAY,CAAC,QAAS,aAAa,EA+BnCC,EAAqB,CACzB,GAAGC,EAKH,KAAM,CAAE,KAAM,OAAQ,UAAW,YAAa,OAAQL,EAAO,QAAS,IAAK,WAAY,EAAK,EAI5F,QAAS,CAAE,KAAM,OAAQ,UAAW,aAAc,OAAQC,EAAU,QAAS,SAAU,WAAYK,CAAa,EAChH,GAAGC,EACH,GAAGC,EAKH,QAAS,CAAE,KAAM,UAAW,UAAW,aAAc,QAAS,EAAM,EAKpE,UAAW,CAAE,KAAM,UAAW,UAAW,gBAAiB,QAAS,EAAM,EAKzE,SAAU,CAAE,KAAM,OAAQ,OAAQL,EAAW,QAAS,MAAU,EAKhE,gBAAiB,CAAE,KAAM,OAAQ,OAAQD,EAAkB,QAAS,MAAU,EAK9E,MAAO,CAAE,KAAM,UAAW,QAAS,EAAM,CAC3C",
+  "names": ["icon_button_props_exports", "__export", "baseButtonPropDefs", "__toCommonJS", "parseVariant", "value", "asChildPropDef", "accentColors", "accentColorPropDef", "accentColors", "radii", "radiusPropDef", "sizes", "variants", "panelBackgrounds", "materials", "baseButtonPropDefs", "asChildPropDef", "parseVariant", "accentColorPropDef", "radiusPropDef"]
 }