@televet/kibble-ui 4.0.1 → 5.0.0-beta.hotfix.1

package/dist/chunks/button.recipe-flk0XJTS.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.recipe-flk0XJTS.js","sources":["../../src/components/Button/button.recipe.ts"],"sourcesContent":["import { defineRecipe, SystemStyleObject } from '@chakra-ui/react/styled-system';\nimport { ButtonSize, ButtonConfigVariant } from './button.types';\n\nconst buttonSizeStyles: Record<ButtonSize, SystemStyleObject> = {\n  xs: {\n    fontSize: 'xs',\n    h: 6,\n    p: '3px 8px',\n    minW: 6,\n  },\n  sm: {\n    fontSize: 'sm',\n    h: 8,\n    p: '6px 12px',\n    minW: 8,\n  },\n  md: {\n    fontSize: 'md',\n    h: 10,\n    p: '8px 16px',\n    minW: 10,\n  },\n  lg: {\n    fontSize: 'lg',\n    h: 12,\n    p: '10px 20px',\n    minW: 12,\n  },\n};\n\nexport const secondarySubtleButtonStyles: SystemStyleObject = {\n  color: 'text.interactive',\n  bg: 'background.secondaryAlpha',\n};\n\nexport const secondarySubtleOnContrastButtonStyles: SystemStyleObject = {\n  color: 'text.interactive.contrast',\n  bg: 'background.secondaryAlpha.contrast',\n};\n\nexport const buttonVariantStyles: Record<ButtonConfigVariant, SystemStyleObject> = {\n  primary: {\n    bg: {\n      base: 'background.primary',\n      _hover: {\n        base: 'background.primary.hover',\n        _disabled: 'background.primary',\n      },\n      _active: {\n        base: 'background.primary.pressed',\n        _hover: 'background.primary.pressed',\n      },\n    },\n    color: {\n      base: 'text.contrast',\n      _icon: 'text.contrast',\n    },\n  },\n  primaryOnContrast: {\n    bg: {\n      base: 'background.primary.contrast',\n      _hover: {\n        base: 'background.primary.contrast.hover',\n        _disabled: 'background.primary.contrast',\n      },\n      _active: {\n        base: 'background.primary.contrast.pressed',\n        _hover: 'background.primary.contrast.pressed',\n      },\n    },\n    color: {\n      base: 'text',\n      _icon: 'text',\n    },\n  },\n  primaryAccent: {\n    bg: {\n      base: 'background.secondary',\n      _hover: {\n        base: 'background.secondary.hover',\n        _disabled: 'background.secondary',\n      },\n      _active: {\n        base: 'background.secondary.pressed',\n        _hover: 'background.secondary.pressed',\n      },\n    },\n    color: {\n      base: 'text.contrast',\n      _icon: 'text.contrast',\n    },\n  },\n  primaryAccentOnContrast: {\n    bg: {\n      base: 'background.secondary.contrast',\n      _hover: {\n        base: 'background.secondary.contrast.hover',\n        _disabled: 'background.secondary.contrast',\n      },\n      _active: {\n        base: 'background.secondary.contrast.pressed',\n        _hover: 'background.secondary.contrast.pressed',\n      },\n    },\n    color: {\n      base: 'text',\n      _icon: 'text',\n    },\n  },\n  primaryDestructive: {\n    bg: {\n      base: 'background.destructive',\n      _hover: {\n        base: 'background.destructive.hover',\n        _disabled: 'background.destructive',\n      },\n      _active: {\n        base: 'background.destructive.pressed',\n        _hover: 'background.destructive.pressed',\n      },\n    },\n    color: 'text.contrast',\n    _icon: {\n      color: 'text.contrast',\n    },\n  },\n  primaryDestructiveOnContrast: {\n    bg: {\n      base: 'background.destructive.contrast',\n      _hover: {\n        base: 'background.destructive.contrast.hover',\n        _disabled: 'background.destructive.contrast',\n      },\n      _active: {\n        base: 'background.destructive.contrast.pressed',\n        _hover: 'background.destructive.contrast.pressed',\n      },\n    },\n    color: {\n      base: 'text',\n      _icon: 'text',\n    },\n  },\n  primaryGradientFull: {\n    bg: {\n      base: 'background.gradientFull',\n      _hover: {\n        base: 'background.gradientFull.hover',\n        _disabled: 'background.gradientFull',\n      },\n      _active: {\n        base: 'background.gradientFull.pressed',\n        _hover: 'background.gradientFull.pressed',\n      },\n    },\n    color: {\n      base: 'text.interactive',\n      _icon: 'text.interactive',\n    },\n    borderWidth: '0',\n  },\n  primaryGradientFullOnContrast: {\n    bg: {\n      base: 'background.gradientFull.contrast',\n      _hover: {\n        base: 'background.gradientFull.contrast.hover',\n        _disabled: 'background.gradientFull.contrast',\n      },\n      _active: {\n        base: 'background.gradientFull.contrast.pressed',\n        _hover: 'background.gradientFull.contrast.pressed',\n      },\n    },\n    color: {\n      base: 'text.interactive.contrast',\n      _icon: 'text.interactive.contrast',\n    },\n    borderWidth: '0',\n  },\n  secondary: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.alpha.hover',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.secondaryAlpha.pressed',\n        _hover: 'background.secondaryAlpha.pressed',\n      },\n    },\n    borderColor: {\n      base: 'border.strong',\n      _active: 'border.focus',\n    },\n    color: {\n      base: 'text',\n      _active: 'text.interactive',\n      _icon: 'text',\n    },\n    _active: {\n      _icon: {\n        color: 'text.interactive',\n      },\n    },\n  },\n  secondaryOnContrast: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.alpha.contrast.hover',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.secondaryAlpha.contrast.pressed',\n        _hover: 'background.secondaryAlpha.contrast.pressed',\n      },\n    },\n    borderColor: {\n      base: 'border.strong.contrast',\n      _active: 'border.focus.contrast',\n    },\n    color: {\n      base: 'text.contrast',\n      _active: 'text.interactive.contrast',\n      _icon: 'text.contrast',\n    },\n    _active: {\n      _icon: {\n        color: 'text.interactive.contrast',\n      },\n    },\n  },\n  secondaryDestructive: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.alpha.hover',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.destructiveAlpha.pressed',\n        _hover: 'background.destructiveAlpha.pressed',\n      },\n    },\n    borderColor: 'border.danger',\n    color: 'text.danger',\n    _icon: {\n      color: 'text.danger',\n    },\n  },\n  secondaryDestructiveOnContrast: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.alpha.contrast.hover',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.destructiveAlpha.contrast.pressed',\n        _hover: 'background.destructiveAlpha.contrast.pressed',\n      },\n    },\n    borderColor: 'border.danger.contrast',\n    color: 'text.danger.contrast',\n    _icon: {\n      color: 'text.danger.contrast',\n    },\n  },\n  secondarySubtle: {\n    bg: {\n      base: 'background',\n      _hover: {\n        base: 'background.subtle',\n        _disabled: 'background',\n      },\n      _active: {\n        base: secondarySubtleButtonStyles.bg,\n        _hover: secondarySubtleButtonStyles.bg,\n      },\n    },\n    borderColor: {\n      base: 'border',\n      _active: 'border.focus.contrast',\n    },\n    color: {\n      base: 'text',\n      _active: secondarySubtleButtonStyles.color,\n      _icon: 'text',\n    },\n    _active: {\n      _icon: {\n        color: secondarySubtleButtonStyles.color,\n      },\n    },\n  },\n  secondarySubtleOnContrast: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.contrast.subtle',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: secondarySubtleOnContrastButtonStyles.bg,\n        _hover: secondarySubtleOnContrastButtonStyles.bg,\n      },\n    },\n    borderColor: {\n      base: 'border.contrast',\n      _active: 'border.focus',\n    },\n    color: {\n      base: 'text.contrast',\n      _active: secondarySubtleOnContrastButtonStyles.color,\n      _icon: 'text.contrast',\n    },\n    _active: {\n      _icon: {\n        color: secondarySubtleOnContrastButtonStyles.color,\n      },\n    },\n  },\n  secondarySubtleDestructive: {\n    bg: {\n      base: 'background',\n      _hover: {\n        base: 'background.subtle',\n        _disabled: 'background',\n      },\n      _active: {\n        base: 'background.destructiveAlpha',\n        _hover: 'background.destructiveAlpha',\n      },\n    },\n    color: 'text.danger',\n    borderColor: 'border',\n    _icon: {\n      color: 'text.danger',\n    },\n  },\n  secondarySubtleDestructiveOnContrast: {\n    bg: {\n      base: 'background.contrast',\n      _hover: {\n        base: 'background.contrast.subtle',\n        _disabled: 'background.contrast',\n      },\n      _active: {\n        base: 'background.destructiveAlpha.contrast',\n        _hover: 'background.destructiveAlpha.contrast',\n      },\n    },\n    color: 'text.danger.contrast',\n    borderColor: 'border.contrast',\n    _icon: {\n      color: 'text.danger.contrast',\n    },\n  },\n  secondaryGradientFull: {\n    borderWidth: '2px',\n    color: {\n      base: 'text.interactive',\n      _icon: 'text.interactive',\n    },\n    bg: {\n      base: 'linear-gradient({colors.background} 0 0) padding-box, {colors.background.gradientFull} border-box',\n      _hover: {\n        base: '{colors.background.gradientFull} border-box',\n        _disabled: 'linear-gradient({colors.background} 0 0) padding-box, {colors.background.gradientFull} border-box',\n      },\n      _active: {\n        base: '{colors.background.gradientFull.hover} border-box',\n        _hover: '{colors.background.gradientFull.hover} border-box',\n      },\n    },\n  },\n  secondaryGradientFullOnContrast: {\n    borderWidth: '2px',\n    color: {\n      base: 'text.interactive.contrast',\n      _icon: 'text.interactive.contrast',\n    },\n    bg: {\n      base: 'linear-gradient({colors.background.contrast} 0 0) padding-box, {colors.background.gradientFull.contrast} border-box',\n      _hover: {\n        base: '{colors.background.gradientFull.contrast} border-box',\n        _disabled:\n          'linear-gradient({colors.background.contrast} 0 0) padding-box, {colors.background.gradientFull.contrast} border-box',\n      },\n      _active: {\n        base: '{colors.background.gradientFull.contrast.hover} border-box',\n        _hover: '{colors.background.gradientFull.contrast.hover} border-box',\n      },\n    },\n  },\n  tertiary: {\n    bg: {\n      base: 'background.alpha',\n      _hover: {\n        base: 'background.alpha.hover',\n        _disabled: 'background.alpha',\n      },\n      _active: {\n        base: 'background.secondaryAlpha.pressed',\n        _hover: 'background.secondaryAlpha.pressed',\n      },\n    },\n    color: {\n      base: 'text',\n      _active: 'text.interactive',\n      _icon: 'text',\n    },\n    _active: {\n      _icon: {\n        color: 'text.interactive',\n      },\n    },\n  },\n  tertiaryOnContrast: {\n    bg: {\n      base: 'background.alpha.contrast',\n      _hover: {\n        base: 'background.alpha.contrast.hover',\n        _disabled: 'background.alpha.contrast',\n      },\n      _active: {\n        base: 'background.secondaryAlpha.contrast.pressed',\n        _hover: 'background.secondaryAlpha.contrast.pressed',\n      },\n    },\n    color: {\n      base: 'text.contrast',\n      _active: 'text.interactive.contrast',\n      _icon: 'text.contrast',\n    },\n    _active: {\n      _icon: {\n        color: 'text.interactive.contrast',\n      },\n    },\n  },\n  tertiaryDestructive: {\n    bg: {\n      base: 'background.destructiveAlpha',\n      _hover: {\n        base: 'background.destructiveAlpha.hover',\n        _disabled: 'background.destructiveAlpha',\n      },\n      _active: {\n        base: 'background.destructiveAlpha.pressed',\n        _hover: 'background.destructiveAlpha.pressed',\n      },\n    },\n    color: {\n      base: 'text.danger',\n      _icon: 'text.danger',\n    },\n  },\n  tertiaryDestructiveOnContrast: {\n    bg: {\n      base: 'background.destructiveAlpha.contrast',\n      _hover: {\n        base: 'background.destructiveAlpha.contrast.hover',\n        _disabled: 'background.destructiveAlpha.contrast',\n      },\n      _active: {\n        base: 'background.destructiveAlpha.contrast.pressed',\n        _hover: 'background.destructiveAlpha.contrast.pressed',\n      },\n    },\n    color: {\n      base: 'text.danger.contrast',\n      _icon: 'text.danger.contrast',\n    },\n  },\n  ghost: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.secondaryAlpha.pressed',\n        _hover: 'background.secondaryAlpha.pressed',\n      },\n    },\n    // Separating to override Chakra's variant\n    _hover: {\n      bg: 'background.secondaryAlpha.hover',\n    },\n    color: {\n      base: 'text.interactive',\n      _icon: 'text.interactive',\n    },\n  },\n  ghostOnContrast: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.secondaryAlpha.contrast.hover',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.secondaryAlpha.contrast.pressed',\n        _hover: 'background.secondaryAlpha.contrast.pressed',\n      },\n    },\n    color: {\n      base: 'text.interactive.contrast',\n      _icon: 'text.interactive.contrast',\n    },\n  },\n  ghostNeutral: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.alpha.hover',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.secondaryAlpha.pressed',\n        _hover: 'background.secondaryAlpha.pressed',\n      },\n    },\n    color: {\n      base: 'text',\n      _icon: 'text',\n    },\n    _active: {\n      color: 'text.interactive',\n      _icon: {\n        color: 'text.interactive',\n      },\n    },\n  },\n  ghostNeutralOnContrast: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.alpha.contrast.hover',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.secondaryAlpha.contrast.pressed',\n        _hover: 'background.secondaryAlpha.contrast.pressed',\n      },\n    },\n    color: {\n      base: 'text.contrast',\n      _icon: 'text.contrast',\n      _active: 'text.interactive.contrast',\n    },\n    _active: {\n      _icon: {\n        color: 'text.interactive.contrast',\n      },\n    },\n  },\n  ghostDestructive: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.destructiveAlpha.hover',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.destructiveAlpha.pressed',\n        _hover: 'background.destructiveAlpha.pressed',\n      },\n    },\n    color: {\n      base: 'text.danger',\n      _icon: 'text.danger',\n    },\n  },\n  ghostDestructiveOnContrast: {\n    bg: {\n      base: 'transparent',\n      _hover: {\n        base: 'background.destructiveAlpha.contrast.hover',\n        _disabled: 'transparent',\n      },\n      _active: {\n        base: 'background.destructiveAlpha.contrast.pressed',\n        _hover: 'background.destructiveAlpha.contrast.pressed',\n      },\n    },\n    color: {\n      base: 'text.danger.contrast',\n      _icon: 'text.danger.contrast',\n    },\n  },\n};\n\nexport const buttonRecipe = defineRecipe({\n  base: {\n    borderColor: 'transparent',\n    borderRadius: 'base',\n    borderWidth: '1px',\n    fontWeight: 'semibold',\n    letterSpacing: '0.12px',\n    lineHeight: '150%',\n    _focusVisible: {\n      boxShadow: 'none !important',\n      outline: 'none !important',\n    },\n  },\n  variants: {\n    variant: buttonVariantStyles,\n    size: buttonSizeStyles,\n  },\n  defaultVariants: {\n    size: 'md',\n    variant: 'primary',\n  },\n});\n"],"names":["buttonSizeStyles","secondarySubtleButtonStyles","secondarySubtleOnContrastButtonStyles","buttonVariantStyles","buttonRecipe","defineRecipe"],"mappings":"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"}

package/dist/chunks/button.types-3lHElsln.js

@@ -0,0 +1,2 @@
+"use strict";const t=["primary","primaryOnContrast","primaryAccent","primaryAccentOnContrast","primaryDestructive","primaryDestructiveOnContrast","primaryGradientFull","primaryGradientFullOnContrast","secondary","secondaryOnContrast","secondaryDestructive","secondaryDestructiveOnContrast","secondarySubtle","secondarySubtleOnContrast","secondarySubtleDestructive","secondarySubtleDestructiveOnContrast","secondaryGradientFull","secondaryGradientFullOnContrast","tertiary","tertiaryOnContrast","tertiaryDestructive","tertiaryDestructiveOnContrast","ghost","ghostOnContrast","ghostNeutral","ghostNeutralOnContrast","ghostDestructive","ghostDestructiveOnContrast"],r=["primary","primaryDestructive","primaryAccent","primaryGradientFull","secondary","secondaryDestructive","secondarySubtle","secondarySubtleDestructive","secondaryGradientFull","tertiary","tertiaryDestructive","ghost","ghostNeutral","ghostDestructive"],n=["xs","sm","md","lg"],e=["left","right"],s=["start","end"];exports.buttonConfigVariants=t;exports.buttonIconPositions=e;exports.buttonSizes=n;exports.buttonSpinnerPlacements=s;exports.buttonVariants=r;
+//# sourceMappingURL=button.types-3lHElsln.js.map

package/dist/chunks/button.types-3lHElsln.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.types-3lHElsln.js","sources":["../../src/components/Button/button.types.ts"],"sourcesContent":["export const buttonConfigVariants = [\n  'primary',\n  'primaryOnContrast',\n  'primaryAccent',\n  'primaryAccentOnContrast',\n  'primaryDestructive',\n  'primaryDestructiveOnContrast',\n  'primaryGradientFull',\n  'primaryGradientFullOnContrast',\n  'secondary',\n  'secondaryOnContrast',\n  'secondaryDestructive',\n  'secondaryDestructiveOnContrast',\n  'secondarySubtle',\n  'secondarySubtleOnContrast',\n  'secondarySubtleDestructive',\n  'secondarySubtleDestructiveOnContrast',\n  'secondaryGradientFull',\n  'secondaryGradientFullOnContrast',\n  'tertiary',\n  'tertiaryOnContrast',\n  'tertiaryDestructive',\n  'tertiaryDestructiveOnContrast',\n  'ghost',\n  'ghostOnContrast',\n  'ghostNeutral',\n  'ghostNeutralOnContrast',\n  'ghostDestructive',\n  'ghostDestructiveOnContrast',\n] as const;\nexport type ButtonConfigVariant = (typeof buttonConfigVariants)[number];\n\n// We are omitting onContrast variants from the variants list because we are setting the 'onContrast' boolean to determine this state\nexport const buttonVariants = [\n  'primary',\n  'primaryDestructive',\n  'primaryAccent',\n  'primaryGradientFull',\n  'secondary',\n  'secondaryDestructive',\n  'secondarySubtle',\n  'secondarySubtleDestructive',\n  'secondaryGradientFull',\n  'tertiary',\n  'tertiaryDestructive',\n  'ghost',\n  'ghostNeutral',\n  'ghostDestructive',\n] as const;\n\nexport type ButtonVariant = (typeof buttonVariants)[number];\n\nexport const buttonSizes = ['xs', 'sm', 'md', 'lg'] as const;\nexport type ButtonSize = (typeof buttonSizes)[number];\n\nexport const buttonIconPositions = ['left', 'right'] as const;\nexport type ButtonIconPosition = (typeof buttonIconPositions)[number];\n\nexport const buttonSpinnerPlacements = ['start', 'end'] as const;\nexport type ButtonSpinnerPlacement = (typeof buttonSpinnerPlacements)[number];\n"],"names":["buttonConfigVariants","buttonVariants","buttonSizes","buttonIconPositions","buttonSpinnerPlacements"],"mappings":"aAAO,MAAMA,EAAuB,CAClC,UACA,oBACA,gBACA,0BACA,qBACA,+BACA,sBACA,gCACA,YACA,sBACA,uBACA,iCACA,kBACA,4BACA,6BACA,uCACA,wBACA,kCACA,WACA,qBACA,sBACA,gCACA,QACA,kBACA,eACA,yBACA,mBACA,4BACF,EAIaC,EAAiB,CAC5B,UACA,qBACA,gBACA,sBACA,YACA,uBACA,kBACA,6BACA,wBACA,WACA,sBACA,QACA,eACA,kBACF,EAIaC,EAAc,CAAC,KAAM,KAAM,KAAM,IAAI,EAGrCC,EAAsB,CAAC,OAAQ,OAAO,EAGtCC,EAA0B,CAAC,QAAS,KAAK"}

package/dist/chunks/{button.types-BKXZNvN1.js → button.types-C9PpvmYR.js}

@@ -1,8 +1,12 @@
 const t = [
   "primary",
   "primaryOnContrast",
+  "primaryAccent",
+  "primaryAccentOnContrast",
   "primaryDestructive",
   "primaryDestructiveOnContrast",
+  "primaryGradientFull",
+  "primaryGradientFullOnContrast",
   "secondary",
   "secondaryOnContrast",
   "secondaryDestructive",
@@ -11,6 +15,8 @@ const t = [
   "secondarySubtleOnContrast",
   "secondarySubtleDestructive",
   "secondarySubtleDestructiveOnContrast",
+  "secondaryGradientFull",
+  "secondaryGradientFullOnContrast",
   "tertiary",
   "tertiaryOnContrast",
   "tertiaryDestructive",
@@ -20,29 +26,28 @@ const t = [
   "ghostNeutral",
   "ghostNeutralOnContrast",
   "ghostDestructive",
-  "ghostDestructiveOnContrast",
-  "ai",
-  "aiSecondary"
+  "ghostDestructiveOnContrast"
 ], r = [
   "primary",
   "primaryDestructive",
+  "primaryAccent",
+  "primaryGradientFull",
   "secondary",
   "secondaryDestructive",
   "secondarySubtle",
   "secondarySubtleDestructive",
+  "secondaryGradientFull",
   "tertiary",
   "tertiaryDestructive",
   "ghost",
   "ghostNeutral",
-  "ghostDestructive",
-  "ai",
-  "aiSecondary"
-], e = ["xs", "sm", "md", "lg"], s = ["left", "right"], a = ["start", "end"];
+  "ghostDestructive"
+], e = ["xs", "sm", "md", "lg"], s = ["left", "right"], n = ["start", "end"];
 export {
   r as a,
   t as b,
   e as c,
   s as d,
-  a as e
+  n as e
 };
-//# sourceMappingURL=button.types-BKXZNvN1.js.map
+//# sourceMappingURL=button.types-C9PpvmYR.js.map

package/dist/chunks/button.types-C9PpvmYR.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.types-C9PpvmYR.js","sources":["../../src/components/Button/button.types.ts"],"sourcesContent":["export const buttonConfigVariants = [\n  'primary',\n  'primaryOnContrast',\n  'primaryAccent',\n  'primaryAccentOnContrast',\n  'primaryDestructive',\n  'primaryDestructiveOnContrast',\n  'primaryGradientFull',\n  'primaryGradientFullOnContrast',\n  'secondary',\n  'secondaryOnContrast',\n  'secondaryDestructive',\n  'secondaryDestructiveOnContrast',\n  'secondarySubtle',\n  'secondarySubtleOnContrast',\n  'secondarySubtleDestructive',\n  'secondarySubtleDestructiveOnContrast',\n  'secondaryGradientFull',\n  'secondaryGradientFullOnContrast',\n  'tertiary',\n  'tertiaryOnContrast',\n  'tertiaryDestructive',\n  'tertiaryDestructiveOnContrast',\n  'ghost',\n  'ghostOnContrast',\n  'ghostNeutral',\n  'ghostNeutralOnContrast',\n  'ghostDestructive',\n  'ghostDestructiveOnContrast',\n] as const;\nexport type ButtonConfigVariant = (typeof buttonConfigVariants)[number];\n\n// We are omitting onContrast variants from the variants list because we are setting the 'onContrast' boolean to determine this state\nexport const buttonVariants = [\n  'primary',\n  'primaryDestructive',\n  'primaryAccent',\n  'primaryGradientFull',\n  'secondary',\n  'secondaryDestructive',\n  'secondarySubtle',\n  'secondarySubtleDestructive',\n  'secondaryGradientFull',\n  'tertiary',\n  'tertiaryDestructive',\n  'ghost',\n  'ghostNeutral',\n  'ghostDestructive',\n] as const;\n\nexport type ButtonVariant = (typeof buttonVariants)[number];\n\nexport const buttonSizes = ['xs', 'sm', 'md', 'lg'] as const;\nexport type ButtonSize = (typeof buttonSizes)[number];\n\nexport const buttonIconPositions = ['left', 'right'] as const;\nexport type ButtonIconPosition = (typeof buttonIconPositions)[number];\n\nexport const buttonSpinnerPlacements = ['start', 'end'] as const;\nexport type ButtonSpinnerPlacement = (typeof buttonSpinnerPlacements)[number];\n"],"names":["buttonConfigVariants","buttonVariants","buttonSizes","buttonIconPositions","buttonSpinnerPlacements"],"mappings":"AAAO,MAAMA,IAAuB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAIaC,IAAiB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAIaC,IAAc,CAAC,MAAM,MAAM,MAAM,IAAI,GAGrCC,IAAsB,CAAC,QAAQ,OAAO,GAGtCC,IAA0B,CAAC,SAAS,KAAK;"}

package/dist/chunks/buttonGroup.component-CowJsbr7.js

@@ -0,0 +1,2 @@
+"use strict";const e=require("./jsx-runtime-BjDatQAs.js"),p=require("react"),q=require("./button.component-DjdgBXDC.js"),f=require("./menu.component-D4-4xRDj.js"),a=require("./use-recipe-DaPWl_pL.js"),y=require("./icon-button-B9rScw-E.js"),G=require("./group-_vcW9myt.js"),E=p.forwardRef(function(s,i){const t=a.useRecipe({key:"button"}),[o,u]=p.useMemo(()=>t.splitVariantProps(s),[s,t]);return e.jsxRuntimeExports.jsx(y.ButtonPropsProvider,{value:o,children:e.jsxRuntimeExports.jsx(G.Group,{ref:i,...u})})}),P=({attached:r=!0,borderColor:s,buttons:i,menuProps:t,onContrast:o=!1,size:u="md",variant:n="primary",["data-testid"]:d="kibble-button-group",...l})=>{const x=p.useMemo(()=>`${n}${o?"OnContrast":""}`,[o,n]),c=a.useRecipe({key:"button"})({variant:x})["@layer recipes"],b=c?.borderColor!=="var(--chakra-colors-transparent)"?c?.borderColor:c?.color,m={borderWidth:"1px",borderColor:s||b};return e.jsxRuntimeExports.jsxs(E,{className:"ButtonGroup","data-testid":d,attached:r,...l,children:[i.map(({key:R,...j},B)=>e.jsxRuntimeExports.jsx(q.Button,{size:u,variant:n,onContrast:o,...j,...r&&m},R||B)),t&&e.jsxRuntimeExports.jsx(f.Menu,{"data-testid":`${d}-menu`,positioning:{placement:"bottom"},...t,buttonProps:{...t.buttonProps,size:u,variant:n,onContrast:o,...r&&{...m,borderTopLeftRadius:0,borderBottomLeftRadius:0}}})]})};exports.ButtonGroup=P;
+//# sourceMappingURL=buttonGroup.component-CowJsbr7.js.map

package/dist/chunks/buttonGroup.component-CowJsbr7.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"buttonGroup.component-CowJsbr7.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/button/button-group.js","../../src/components/ButtonGroup/buttonGroup.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { forwardRef, useMemo } from 'react';\nimport { useRecipe } from '../../styled-system/use-recipe.js';\nimport { ButtonPropsProvider } from './button.js';\nimport { Group } from '../group/group.js';\n\nconst ButtonGroup = forwardRef(\n  function ButtonGroup2(props, ref) {\n    const recipe = useRecipe({ key: \"button\" });\n    const [variantProps, otherProps] = useMemo(\n      () => recipe.splitVariantProps(props),\n      [props, recipe]\n    );\n    return /* @__PURE__ */ jsx(ButtonPropsProvider, { value: variantProps, children: /* @__PURE__ */ jsx(Group, { ref, ...otherProps }) });\n  }\n);\n\nexport { ButtonGroup };\n","import React, { useMemo } from 'react';\nimport { ButtonGroup as CButtonGroup, ButtonGroupProps as CButtonGroupProps } from '@chakra-ui/react/button';\nimport { GroupedButton } from './buttonGroup.types';\nimport { ButtonConfigVariant, ButtonSize, ButtonVariant } from 'components/Button/button.types';\nimport { Button } from 'components/Button/button.component';\nimport { SystemStyleObject, useRecipe } from '@chakra-ui/react/styled-system';\nimport { Menu, MenuProps } from 'components/Menu/menu.component';\n\nexport interface ButtonGroupProps extends CButtonGroupProps {\n  /** An array of button objects to be rendered in the group. */\n  buttons: GroupedButton[];\n  /** Determines wether the button should render a contrasting variant. */\n  onContrast?: boolean;\n  /** Size of the button group.\n   * @default md\n   */\n  size?: ButtonSize;\n  /** Variants are used to adjust the button look and feel. Choose a variant that aligns with the button intent and role in the overall design. */\n  variant?: ButtonVariant;\n  /** If provided, a Menu will be rendered as the last element in the group. See `Menu` for more information. */\n  menuProps?: MenuProps;\n  /** Data test id for the button group.\n   * @default kibble-button-group\n   */\n  'data-testid'?: string;\n}\n\nexport const ButtonGroup = ({\n  attached = true,\n  borderColor,\n  buttons,\n  menuProps,\n  onContrast = false,\n  size = 'md',\n  variant = 'primary',\n  ['data-testid']: dataTestId = 'kibble-button-group',\n  ...rest\n}: ButtonGroupProps): React.JSX.Element => {\n  const computedVariant = useMemo(\n    () => `${variant}${onContrast ? 'OnContrast' : ''}` as ButtonConfigVariant,\n    [onContrast, variant],\n  );\n  const recipe = useRecipe({ key: 'button' });\n  const styles = recipe({ variant: computedVariant })['@layer recipes'];\n  const computedBorderColor =\n    styles?.borderColor !== 'var(--chakra-colors-transparent)' ? styles?.borderColor : styles?.color;\n\n  const buttonStyles: SystemStyleObject = {\n    borderWidth: '1px',\n    borderColor: borderColor || computedBorderColor,\n  };\n\n  return (\n    <CButtonGroup className=\"ButtonGroup\" data-testid={dataTestId} attached={attached} {...rest}>\n      {buttons.map(({ key, ...rest }, index) => (\n        <Button\n          key={key || index}\n          size={size}\n          variant={variant}\n          onContrast={onContrast}\n          {...rest}\n          {...(attached && buttonStyles)}\n        />\n      ))}\n      {menuProps && (\n        <Menu\n          data-testid={`${dataTestId}-menu`}\n          positioning={{ placement: 'bottom' }}\n          {...menuProps}\n          buttonProps={{\n            ...menuProps.buttonProps,\n            size,\n            variant,\n            onContrast,\n            ...(attached && {\n              ...buttonStyles,\n              borderTopLeftRadius: 0,\n              borderBottomLeftRadius: 0,\n            }),\n          }}\n        />\n      )}\n    </CButtonGroup>\n  );\n};\n"],"names":["ButtonGroup","forwardRef","props","ref","recipe","useRecipe","variantProps","otherProps","useMemo","jsx","ButtonPropsProvider","Group","attached","borderColor","buttons","menuProps","onContrast","size","variant","dataTestId","rest","computedVariant","styles","computedBorderColor","buttonStyles","jsxs","CButtonGroup","key","index","Button","Menu"],"mappings":"iRAQMA,EAAcC,EAAU,WAC5B,SAAsBC,EAAOC,EAAK,CAChC,MAAMC,EAASC,EAAS,UAAC,CAAE,IAAK,QAAQ,CAAE,EACpC,CAACC,EAAcC,CAAU,EAAIC,EAAO,QACxC,IAAMJ,EAAO,kBAAkBF,CAAK,EACpC,CAACA,EAAOE,CAAM,CACf,EACD,OAAuBK,EAAG,kBAAA,IAACC,EAAmB,oBAAE,CAAE,MAAOJ,EAAc,SAA0BG,wBAAIE,EAAAA,MAAO,CAAE,IAAAR,EAAK,GAAGI,CAAU,CAAE,CAAC,CAAE,CACzI,CACA,ECUaP,EAAc,CAAC,CAC1B,SAAAY,EAAW,GACX,YAAAC,EACA,QAAAC,EACA,UAAAC,EACA,WAAAC,EAAa,GACb,KAAAC,EAAO,KACP,QAAAC,EAAU,UACV,CAAC,eAAgBC,EAAa,sBAC9B,GAAGC,CACL,IAA2C,CACzC,MAAMC,EAAkBb,EAAA,QACtB,IAAM,GAAGU,CAAO,GAAGF,EAAa,aAAe,EAAE,GACjD,CAACA,EAAYE,CAAO,CACtB,EAEMI,EADSjB,EAAA,UAAU,CAAE,IAAK,SAAU,EACpB,CAAE,QAASgB,CAAgB,CAAC,EAAE,gBAAgB,EAC9DE,EACJD,GAAQ,cAAgB,mCAAqCA,GAAQ,YAAcA,GAAQ,MAEvFE,EAAkC,CACtC,YAAa,MACb,YAAaX,GAAeU,CAC9B,EAGE,OAAAE,yBAACC,GAAa,UAAU,cAAc,cAAaP,EAAY,SAAAP,EAAqB,GAAGQ,EACpF,SAAA,CAAAN,EAAQ,IAAI,CAAC,CAAE,IAAAa,EAAK,GAAGP,CAAAA,EAAQQ,IAC9BnB,EAAA,kBAAA,IAACoB,EAAA,OAAA,CAEC,KAAAZ,EACA,QAAAC,EACA,WAAAF,EACC,GAAGI,EACH,GAAIR,GAAYY,CAAA,EALZG,GAAOC,CAAA,CAOf,EACAb,GACCN,EAAA,kBAAA,IAACqB,EAAA,KAAA,CACC,cAAa,GAAGX,CAAU,QAC1B,YAAa,CAAE,UAAW,QAAS,EAClC,GAAGJ,EACJ,YAAa,CACX,GAAGA,EAAU,YACb,KAAAE,EACA,QAAAC,EACA,WAAAF,EACA,GAAIJ,GAAY,CACd,GAAGY,EACH,oBAAqB,EACrB,uBAAwB,CAAA,CAC1B,CACF,CAAA,CACF,EAEJ,CAEJ","x_google_ignoreList":[0]}

package/dist/chunks/buttonGroup.component-DUK2FgFn.js

@@ -0,0 +1,70 @@
+import { j as t } from "./jsx-runtime-C5mzlN2N.js";
+import { forwardRef as y, useMemo as c } from "react";
+import { B as G } from "./button.component-BO6oee_V.js";
+import { M as P } from "./menu.component-DwTen8Uv.js";
+import { u as d } from "./use-recipe-d63ABaZ3.js";
+import { a as R } from "./icon-button-CcZMCNUJ.js";
+import { G as k } from "./group-CplNJpRQ.js";
+const $ = y(
+  function(s, n) {
+    const o = d({ key: "button" }), [r, p] = c(
+      () => o.splitVariantProps(s),
+      [s, o]
+    );
+    return /* @__PURE__ */ t.jsx(R, { value: r, children: /* @__PURE__ */ t.jsx(k, { ref: n, ...p }) });
+  }
+), E = ({
+  attached: e = !0,
+  borderColor: s,
+  buttons: n,
+  menuProps: o,
+  onContrast: r = !1,
+  size: p = "md",
+  variant: u = "primary",
+  ["data-testid"]: a = "kibble-button-group",
+  ...l
+}) => {
+  const b = c(
+    () => `${u}${r ? "OnContrast" : ""}`,
+    [r, u]
+  ), i = d({ key: "button" })({ variant: b })["@layer recipes"], f = i?.borderColor !== "var(--chakra-colors-transparent)" ? i?.borderColor : i?.color, m = {
+    borderWidth: "1px",
+    borderColor: s || f
+  };
+  return /* @__PURE__ */ t.jsxs($, { className: "ButtonGroup", "data-testid": a, attached: e, ...l, children: [
+    n.map(({ key: B, ...x }, j) => /* @__PURE__ */ t.jsx(
+      G,
+      {
+        size: p,
+        variant: u,
+        onContrast: r,
+        ...x,
+        ...e && m
+      },
+      B || j
+    )),
+    o && /* @__PURE__ */ t.jsx(
+      P,
+      {
+        "data-testid": `${a}-menu`,
+        positioning: { placement: "bottom" },
+        ...o,
+        buttonProps: {
+          ...o.buttonProps,
+          size: p,
+          variant: u,
+          onContrast: r,
+          ...e && {
+            ...m,
+            borderTopLeftRadius: 0,
+            borderBottomLeftRadius: 0
+          }
+        }
+      }
+    )
+  ] });
+};
+export {
+  E as B
+};
+//# sourceMappingURL=buttonGroup.component-DUK2FgFn.js.map

package/dist/chunks/buttonGroup.component-DUK2FgFn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"buttonGroup.component-DUK2FgFn.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/button/button-group.js","../../src/components/ButtonGroup/buttonGroup.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { forwardRef, useMemo } from 'react';\nimport { useRecipe } from '../../styled-system/use-recipe.js';\nimport { ButtonPropsProvider } from './button.js';\nimport { Group } from '../group/group.js';\n\nconst ButtonGroup = forwardRef(\n  function ButtonGroup2(props, ref) {\n    const recipe = useRecipe({ key: \"button\" });\n    const [variantProps, otherProps] = useMemo(\n      () => recipe.splitVariantProps(props),\n      [props, recipe]\n    );\n    return /* @__PURE__ */ jsx(ButtonPropsProvider, { value: variantProps, children: /* @__PURE__ */ jsx(Group, { ref, ...otherProps }) });\n  }\n);\n\nexport { ButtonGroup };\n","import React, { useMemo } from 'react';\nimport { ButtonGroup as CButtonGroup, ButtonGroupProps as CButtonGroupProps } from '@chakra-ui/react/button';\nimport { GroupedButton } from './buttonGroup.types';\nimport { ButtonConfigVariant, ButtonSize, ButtonVariant } from 'components/Button/button.types';\nimport { Button } from 'components/Button/button.component';\nimport { SystemStyleObject, useRecipe } from '@chakra-ui/react/styled-system';\nimport { Menu, MenuProps } from 'components/Menu/menu.component';\n\nexport interface ButtonGroupProps extends CButtonGroupProps {\n  /** An array of button objects to be rendered in the group. */\n  buttons: GroupedButton[];\n  /** Determines wether the button should render a contrasting variant. */\n  onContrast?: boolean;\n  /** Size of the button group.\n   * @default md\n   */\n  size?: ButtonSize;\n  /** Variants are used to adjust the button look and feel. Choose a variant that aligns with the button intent and role in the overall design. */\n  variant?: ButtonVariant;\n  /** If provided, a Menu will be rendered as the last element in the group. See `Menu` for more information. */\n  menuProps?: MenuProps;\n  /** Data test id for the button group.\n   * @default kibble-button-group\n   */\n  'data-testid'?: string;\n}\n\nexport const ButtonGroup = ({\n  attached = true,\n  borderColor,\n  buttons,\n  menuProps,\n  onContrast = false,\n  size = 'md',\n  variant = 'primary',\n  ['data-testid']: dataTestId = 'kibble-button-group',\n  ...rest\n}: ButtonGroupProps): React.JSX.Element => {\n  const computedVariant = useMemo(\n    () => `${variant}${onContrast ? 'OnContrast' : ''}` as ButtonConfigVariant,\n    [onContrast, variant],\n  );\n  const recipe = useRecipe({ key: 'button' });\n  const styles = recipe({ variant: computedVariant })['@layer recipes'];\n  const computedBorderColor =\n    styles?.borderColor !== 'var(--chakra-colors-transparent)' ? styles?.borderColor : styles?.color;\n\n  const buttonStyles: SystemStyleObject = {\n    borderWidth: '1px',\n    borderColor: borderColor || computedBorderColor,\n  };\n\n  return (\n    <CButtonGroup className=\"ButtonGroup\" data-testid={dataTestId} attached={attached} {...rest}>\n      {buttons.map(({ key, ...rest }, index) => (\n        <Button\n          key={key || index}\n          size={size}\n          variant={variant}\n          onContrast={onContrast}\n          {...rest}\n          {...(attached && buttonStyles)}\n        />\n      ))}\n      {menuProps && (\n        <Menu\n          data-testid={`${dataTestId}-menu`}\n          positioning={{ placement: 'bottom' }}\n          {...menuProps}\n          buttonProps={{\n            ...menuProps.buttonProps,\n            size,\n            variant,\n            onContrast,\n            ...(attached && {\n              ...buttonStyles,\n              borderTopLeftRadius: 0,\n              borderBottomLeftRadius: 0,\n            }),\n          }}\n        />\n      )}\n    </CButtonGroup>\n  );\n};\n"],"names":["ButtonGroup","forwardRef","props","ref","recipe","useRecipe","variantProps","otherProps","useMemo","jsx","ButtonPropsProvider","Group","attached","borderColor","buttons","menuProps","onContrast","size","variant","dataTestId","rest","computedVariant","styles","computedBorderColor","buttonStyles","jsxs","CButtonGroup","key","index","Button","Menu"],"mappings":";;;;;;;AAQA,MAAMA,IAAcC;AAAA,EAClB,SAAsBC,GAAOC,GAAK;AAChC,UAAMC,IAASC,EAAU,EAAE,KAAK,SAAQ,CAAE,GACpC,CAACC,GAAcC,CAAU,IAAIC;AAAA,MACjC,MAAMJ,EAAO,kBAAkBF,CAAK;AAAA,MACpC,CAACA,GAAOE,CAAM;AAAA,IACf;AACD,WAAuBK,gBAAAA,EAAG,IAACC,GAAqB,EAAE,OAAOJ,GAAc,UAA0BG,gBAAAA,MAAIE,GAAO,EAAE,KAAAR,GAAK,GAAGI,EAAU,CAAE,EAAC,CAAE;AAAA,EACzI;AACA,GCUaP,IAAc,CAAC;AAAA,EAC1B,UAAAY,IAAW;AAAA,EACX,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,CAAC,gBAAgBC,IAAa;AAAA,EAC9B,GAAGC;AACL,MAA2C;AACzC,QAAMC,IAAkBb;AAAA,IACtB,MAAM,GAAGU,CAAO,GAAGF,IAAa,eAAe,EAAE;AAAA,IACjD,CAACA,GAAYE,CAAO;AAAA,EACtB,GAEMI,IADSjB,EAAU,EAAE,KAAK,UAAU,EACpB,EAAE,SAASgB,EAAgB,CAAC,EAAE,gBAAgB,GAC9DE,IACJD,GAAQ,gBAAgB,qCAAqCA,GAAQ,cAAcA,GAAQ,OAEvFE,IAAkC;AAAA,IACtC,aAAa;AAAA,IACb,aAAaX,KAAeU;AAAA,EAC9B;AAGE,SAAAE,gBAAAA,OAACC,KAAa,WAAU,eAAc,eAAaP,GAAY,UAAAP,GAAqB,GAAGQ,GACpF,UAAA;AAAA,IAAAN,EAAQ,IAAI,CAAC,EAAE,KAAAa,GAAK,GAAGP,EAAAA,GAAQQ,MAC9BnB,gBAAAA,EAAA;AAAA,MAACoB;AAAA,MAAA;AAAA,QAEC,MAAAZ;AAAA,QACA,SAAAC;AAAA,QACA,YAAAF;AAAA,QACC,GAAGI;AAAAA,QACH,GAAIR,KAAYY;AAAA,MAAA;AAAA,MALZG,KAAOC;AAAA,IAAA,CAOf;AAAA,IACAb,KACCN,gBAAAA,EAAA;AAAA,MAACqB;AAAA,MAAA;AAAA,QACC,eAAa,GAAGX,CAAU;AAAA,QAC1B,aAAa,EAAE,WAAW,SAAS;AAAA,QAClC,GAAGJ;AAAA,QACJ,aAAa;AAAA,UACX,GAAGA,EAAU;AAAA,UACb,MAAAE;AAAA,UACA,SAAAC;AAAA,UACA,YAAAF;AAAA,UACA,GAAIJ,KAAY;AAAA,YACd,GAAGY;AAAA,YACH,qBAAqB;AAAA,YACrB,wBAAwB;AAAA,UAAA;AAAA,QAC1B;AAAA,MACF;AAAA,IAAA;AAAA,EACF,GAEJ;AAEJ;","x_google_ignoreList":[0]}

package/dist/chunks/calendar.component-CHIhplfO.js

@@ -0,0 +1,18 @@
+import { j as a } from "./jsx-runtime-C5mzlN2N.js";
+import { B as i } from "./index-9BerxEcw.js";
+import { a as d, b as o, c as m } from "./datePicker.provider-BWHE-9FA.js";
+import { D as n } from "./divider.component-CFOh4Nw3.js";
+const p = ({
+  ["data-testid"]: r = "kibble-calendar",
+  withDateRange: e = !0,
+  withHeaderTriggers: s = !1,
+  ...t
+}) => /* @__PURE__ */ a.jsx(i, { className: "Calendar", "data-testid": r, maxW: "340px", children: /* @__PURE__ */ a.jsxs(d, { withDateRange: e, ...t, standalone: !0, children: [
+  /* @__PURE__ */ a.jsx(o, { withTriggers: s }),
+  /* @__PURE__ */ a.jsx(n, {}),
+  /* @__PURE__ */ a.jsx(m, {})
+] }) });
+export {
+  p as C
+};
+//# sourceMappingURL=calendar.component-CHIhplfO.js.map

package/dist/chunks/calendar.component-CHIhplfO.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.component-CHIhplfO.js","sources":["../../src/components/Calendar/calendar.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { DatePickerCalendar } from 'components/DatePicker/components/DatePickerCalendar/datePickerCalendar.component';\nimport { DatePickerHeader } from 'components/DatePicker/components/DatePickerHeader/datePickerHeader.component';\nimport { Divider } from 'components/Divider';\nimport { DatePickerProvider } from 'components/DatePicker/context/datePicker.provider';\nimport { DateProps } from 'components/DatePicker/datePicker.types';\n\nexport interface CalendarProps extends DateProps {\n  /** Data test id for the calendar.\n   * @default kibble-calendar\n   */\n  'data-testid'?: string;\n  /**\n   * If true, the calendar will allow for a date range selection.\n   * @default true\n   */\n  withDateRange?: boolean;\n  /**\n   * If true, the calendar will show the month and year selectors in the header.\n   * @default false\n   */\n  withHeaderTriggers?: boolean;\n}\n\nexport const Calendar = ({\n  ['data-testid']: dataTestId = 'kibble-calendar',\n  withDateRange = true,\n  withHeaderTriggers = false,\n  ...rest\n}: CalendarProps): React.JSX.Element => {\n  return (\n    <Box className=\"Calendar\" data-testid={dataTestId} maxW=\"340px\">\n      <DatePickerProvider withDateRange={withDateRange} {...rest} standalone>\n        <DatePickerHeader withTriggers={withHeaderTriggers} />\n        <Divider />\n        <DatePickerCalendar />\n      </DatePickerProvider>\n    </Box>\n  );\n};\n"],"names":["Calendar","dataTestId","withDateRange","withHeaderTriggers","rest","jsx","Box","jsxs","DatePickerProvider","DatePickerHeader","Divider","DatePickerCalendar"],"mappings":";;;;AAyBO,MAAMA,IAAW,CAAC;AAAA,EACvB,CAAC,gBAAgBC,IAAa;AAAA,EAC9B,eAAAC,IAAgB;AAAA,EAChB,oBAAAC,IAAqB;AAAA,EACrB,GAAGC;AACL,MAEKC,gBAAAA,EAAAA,IAAAC,GAAA,EAAI,WAAU,YAAW,eAAaL,GAAY,MAAK,SACtD,UAAAM,gBAAAA,EAAA,KAACC,GAAmB,EAAA,eAAAN,GAA+B,GAAGE,GAAM,YAAU,IACpE,UAAA;AAAA,EAACC,gBAAAA,EAAAA,IAAAI,GAAA,EAAiB,cAAcN,EAAoB,CAAA;AAAA,wBACnDO,GAAQ,EAAA;AAAA,wBACRC,GAAmB,CAAA,CAAA;AAAA,EAAA,CACtB,EACF,CAAA;"}

package/dist/chunks/calendar.component-tOoK1NrU.js

@@ -0,0 +1,2 @@
+"use strict";const e=require("./jsx-runtime-BjDatQAs.js"),n=require("./index-BQRnVsAg.js"),r=require("./datePicker.provider-DgarjPPd.js"),d=require("./divider.component-BX3zyB7O.js"),x=({["data-testid"]:t="kibble-calendar",withDateRange:s=!0,withHeaderTriggers:i=!1,...a})=>e.jsxRuntimeExports.jsx(n.Box,{className:"Calendar","data-testid":t,maxW:"340px",children:e.jsxRuntimeExports.jsxs(r.DatePickerProvider,{withDateRange:s,...a,standalone:!0,children:[e.jsxRuntimeExports.jsx(r.DatePickerHeader,{withTriggers:i}),e.jsxRuntimeExports.jsx(d.Divider,{}),e.jsxRuntimeExports.jsx(r.DatePickerCalendar,{})]})});exports.Calendar=x;
+//# sourceMappingURL=calendar.component-tOoK1NrU.js.map

package/dist/chunks/calendar.component-tOoK1NrU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.component-tOoK1NrU.js","sources":["../../src/components/Calendar/calendar.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { DatePickerCalendar } from 'components/DatePicker/components/DatePickerCalendar/datePickerCalendar.component';\nimport { DatePickerHeader } from 'components/DatePicker/components/DatePickerHeader/datePickerHeader.component';\nimport { Divider } from 'components/Divider';\nimport { DatePickerProvider } from 'components/DatePicker/context/datePicker.provider';\nimport { DateProps } from 'components/DatePicker/datePicker.types';\n\nexport interface CalendarProps extends DateProps {\n  /** Data test id for the calendar.\n   * @default kibble-calendar\n   */\n  'data-testid'?: string;\n  /**\n   * If true, the calendar will allow for a date range selection.\n   * @default true\n   */\n  withDateRange?: boolean;\n  /**\n   * If true, the calendar will show the month and year selectors in the header.\n   * @default false\n   */\n  withHeaderTriggers?: boolean;\n}\n\nexport const Calendar = ({\n  ['data-testid']: dataTestId = 'kibble-calendar',\n  withDateRange = true,\n  withHeaderTriggers = false,\n  ...rest\n}: CalendarProps): React.JSX.Element => {\n  return (\n    <Box className=\"Calendar\" data-testid={dataTestId} maxW=\"340px\">\n      <DatePickerProvider withDateRange={withDateRange} {...rest} standalone>\n        <DatePickerHeader withTriggers={withHeaderTriggers} />\n        <Divider />\n        <DatePickerCalendar />\n      </DatePickerProvider>\n    </Box>\n  );\n};\n"],"names":["Calendar","dataTestId","withDateRange","withHeaderTriggers","rest","jsx","Box","jsxs","DatePickerProvider","DatePickerHeader","Divider","DatePickerCalendar"],"mappings":"uLAyBaA,EAAW,CAAC,CACvB,CAAC,eAAgBC,EAAa,kBAC9B,cAAAC,EAAgB,GAChB,mBAAAC,EAAqB,GACrB,GAAGC,CACL,IAEKC,EAAAA,kBAAAA,IAAAC,EAAAA,IAAA,CAAI,UAAU,WAAW,cAAaL,EAAY,KAAK,QACtD,SAAAM,EAAA,kBAAA,KAACC,EAAmB,mBAAA,CAAA,cAAAN,EAA+B,GAAGE,EAAM,WAAU,GACpE,SAAA,CAACC,EAAAA,kBAAAA,IAAAI,EAAA,iBAAA,CAAiB,aAAcN,CAAoB,CAAA,0BACnDO,EAAQ,QAAA,EAAA,0BACRC,EAAmB,mBAAA,CAAA,CAAA,CAAA,CAAA,CACtB,CACF,CAAA"}

package/dist/chunks/card.component-B1AznjWF.js

@@ -0,0 +1,55 @@
+import { j as l } from "./jsx-runtime-C5mzlN2N.js";
+import { B as m } from "./index-9BerxEcw.js";
+const x = {
+  lg: 7,
+  md: 5,
+  sm: 3,
+  xs: 2
+}, g = ({
+  active: a = !1,
+  fullWidth: e = !0,
+  interactive: o = !1,
+  invalid: d = !1,
+  onClick: s,
+  onContrast: r = !1,
+  size: t = "md",
+  children: b,
+  ["data-testid"]: i = "kibble-card",
+  ...n
+}) => /* @__PURE__ */ l.jsx(
+  m,
+  {
+    className: "Card",
+    "data-testid": i,
+    bg: r ? "background.contrast" : "background",
+    p: x[t],
+    border: "1px",
+    borderColor: r ? "border.contrast" : "border",
+    borderRadius: "lg",
+    ...d && { "aria-invalid": !0 },
+    ...o && {
+      borderColor: {
+        base: `${a ? "transparent" : r ? "border.contrast" : "border"}`,
+        _invalid: `${r ? "border.danger.contrast" : "border.danger"}`
+      },
+      boxShadow: {
+        base: `${a ? r ? "active.contrast" : "active" : "none"}`,
+        ...!a && {
+          _hover: r ? "hover.contrast" : "hover"
+        }
+      },
+      cursor: "pointer",
+      transition: ".1s all ease-in-out"
+    },
+    ...e ? { w: "100%" } : { maxW: "max-content" },
+    onClick: (c) => {
+      s?.(c);
+    },
+    ...n,
+    children: b
+  }
+);
+export {
+  g as C
+};
+//# sourceMappingURL=card.component-B1AznjWF.js.map

package/dist/chunks/card.component-B1AznjWF.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.component-B1AznjWF.js","sources":["../../src/components/Card/card.records.ts","../../src/components/Card/card.component.tsx"],"sourcesContent":["import { CardSize } from './card.types';\n\nexport const CardPaddingMap: Record<CardSize, number> = {\n  lg: 7,\n  md: 5,\n  sm: 3,\n  xs: 2,\n};\n","import React from 'react';\nimport { Box, BoxProps } from '@chakra-ui/react/box';\nimport { CardSize } from './card.types';\nimport { CardPaddingMap } from './card.records';\n\nexport interface BaseCardProps {\n  /**\n   * If `false`, the max width will be set to `max-content` and will not take up the full width of the parent.\n   * @default true\n   */\n  fullWidth?: boolean;\n  /**\n   * If `true`, the card will use a contrasting variant.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * Size of the card. This mostly determines the amount of padding around the inside edge of the card.\n   * @default md\n   */\n  size?: CardSize;\n  /** Data test id for the card.\n   * @default kibble-card\n   */\n  'data-testid'?: string;\n}\n\nexport interface DefaultCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: never;\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.\n   * @default false\n   */\n  invalid?: never;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: false;\n}\n\nexport interface InteractiveCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: boolean;\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: true;\n}\n\nexport type KCardProps = InteractiveCardProps | DefaultCardProps;\n\nexport type CardProps = KCardProps & BoxProps;\n\nexport const Card = ({\n  active = false,\n  fullWidth = true,\n  interactive = false,\n  invalid = false,\n  onClick,\n  onContrast = false,\n  size = 'md',\n  children,\n  ['data-testid']: dataTestId = 'kibble-card',\n  ...rest\n}: CardProps): React.JSX.Element => {\n  return (\n    <Box\n      className=\"Card\"\n      data-testid={dataTestId}\n      bg={onContrast ? 'background.contrast' : 'background'}\n      p={CardPaddingMap[size]}\n      border=\"1px\"\n      borderColor={onContrast ? 'border.contrast' : 'border'}\n      borderRadius=\"lg\"\n      {...(invalid && { 'aria-invalid': true })}\n      {...(interactive && {\n        borderColor: {\n          base: `${active ? 'transparent' : onContrast ? 'border.contrast' : 'border'}`,\n          _invalid: `${onContrast ? 'border.danger.contrast' : 'border.danger'}`,\n        },\n        boxShadow: {\n          base: `${active ? (onContrast ? 'active.contrast' : 'active') : 'none'}`,\n          ...(!active && {\n            _hover: onContrast ? 'hover.contrast' : 'hover',\n          }),\n        },\n        cursor: 'pointer',\n        transition: '.1s all ease-in-out',\n      })}\n      {...(!fullWidth ? { maxW: 'max-content' } : { w: '100%' })}\n      onClick={(e) => {\n        onClick?.(e);\n      }}\n      {...rest}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"names":["CardPaddingMap","Card","active","fullWidth","interactive","invalid","onClick","onContrast","size","children","dataTestId","rest","jsx","Box","e"],"mappings":";;AAEO,MAAMA,IAA2C;AAAA,EACtD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GC4DaC,IAAO,CAAC;AAAA,EACnB,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,aAAAC,IAAc;AAAA,EACd,SAAAC,IAAU;AAAA,EACV,SAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,CAAC,gBAAgBC,IAAa;AAAA,EAC9B,GAAGC;AACL,MAEIC,gBAAAA,EAAA;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,eAAaH;AAAA,IACb,IAAIH,IAAa,wBAAwB;AAAA,IACzC,GAAGP,EAAeQ,CAAI;AAAA,IACtB,QAAO;AAAA,IACP,aAAaD,IAAa,oBAAoB;AAAA,IAC9C,cAAa;AAAA,IACZ,GAAIF,KAAW,EAAE,gBAAgB,GAAK;AAAA,IACtC,GAAID,KAAe;AAAA,MAClB,aAAa;AAAA,QACX,MAAM,GAAGF,IAAS,gBAAgBK,IAAa,oBAAoB,QAAQ;AAAA,QAC3E,UAAU,GAAGA,IAAa,2BAA2B,eAAe;AAAA,MACtE;AAAA,MACA,WAAW;AAAA,QACT,MAAM,GAAGL,IAAUK,IAAa,oBAAoB,WAAY,MAAM;AAAA,QACtE,GAAI,CAACL,KAAU;AAAA,UACb,QAAQK,IAAa,mBAAmB;AAAA,QAAA;AAAA,MAE5C;AAAA,MACA,QAAQ;AAAA,MACR,YAAY;AAAA,IACd;AAAA,IACC,GAAKJ,IAAsC,EAAE,GAAG,OAAO,IAAtC,EAAE,MAAM,cAAc;AAAA,IACxC,SAAS,CAACW,MAAM;AACd,MAAAR,IAAUQ,CAAC;AAAA,IACb;AAAA,IACC,GAAGH;AAAA,IAEH,UAAAF;AAAA,EAAA;AACH;"}

package/dist/chunks/card.component-BmBiYbMV.js

@@ -0,0 +1,2 @@
+"use strict";const l=require("./jsx-runtime-BjDatQAs.js"),u=require("./index-BQRnVsAg.js"),x={lg:7,md:5,sm:3,xs:2},g=({active:e=!1,fullWidth:a=!0,interactive:d=!1,invalid:o=!1,onClick:s,onContrast:r=!1,size:t="md",children:n,["data-testid"]:i="kibble-card",...b})=>l.jsxRuntimeExports.jsx(u.Box,{className:"Card","data-testid":i,bg:r?"background.contrast":"background",p:x[t],border:"1px",borderColor:r?"border.contrast":"border",borderRadius:"lg",...o&&{"aria-invalid":!0},...d&&{borderColor:{base:`${e?"transparent":r?"border.contrast":"border"}`,_invalid:`${r?"border.danger.contrast":"border.danger"}`},boxShadow:{base:`${e?r?"active.contrast":"active":"none"}`,...!e&&{_hover:r?"hover.contrast":"hover"}},cursor:"pointer",transition:".1s all ease-in-out"},...a?{w:"100%"}:{maxW:"max-content"},onClick:c=>{s?.(c)},...b,children:n});exports.Card=g;
+//# sourceMappingURL=card.component-BmBiYbMV.js.map

package/dist/chunks/card.component-BmBiYbMV.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.component-BmBiYbMV.js","sources":["../../src/components/Card/card.records.ts","../../src/components/Card/card.component.tsx"],"sourcesContent":["import { CardSize } from './card.types';\n\nexport const CardPaddingMap: Record<CardSize, number> = {\n  lg: 7,\n  md: 5,\n  sm: 3,\n  xs: 2,\n};\n","import React from 'react';\nimport { Box, BoxProps } from '@chakra-ui/react/box';\nimport { CardSize } from './card.types';\nimport { CardPaddingMap } from './card.records';\n\nexport interface BaseCardProps {\n  /**\n   * If `false`, the max width will be set to `max-content` and will not take up the full width of the parent.\n   * @default true\n   */\n  fullWidth?: boolean;\n  /**\n   * If `true`, the card will use a contrasting variant.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * Size of the card. This mostly determines the amount of padding around the inside edge of the card.\n   * @default md\n   */\n  size?: CardSize;\n  /** Data test id for the card.\n   * @default kibble-card\n   */\n  'data-testid'?: string;\n}\n\nexport interface DefaultCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: never;\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.\n   * @default false\n   */\n  invalid?: never;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: false;\n}\n\nexport interface InteractiveCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: boolean;\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: true;\n}\n\nexport type KCardProps = InteractiveCardProps | DefaultCardProps;\n\nexport type CardProps = KCardProps & BoxProps;\n\nexport const Card = ({\n  active = false,\n  fullWidth = true,\n  interactive = false,\n  invalid = false,\n  onClick,\n  onContrast = false,\n  size = 'md',\n  children,\n  ['data-testid']: dataTestId = 'kibble-card',\n  ...rest\n}: CardProps): React.JSX.Element => {\n  return (\n    <Box\n      className=\"Card\"\n      data-testid={dataTestId}\n      bg={onContrast ? 'background.contrast' : 'background'}\n      p={CardPaddingMap[size]}\n      border=\"1px\"\n      borderColor={onContrast ? 'border.contrast' : 'border'}\n      borderRadius=\"lg\"\n      {...(invalid && { 'aria-invalid': true })}\n      {...(interactive && {\n        borderColor: {\n          base: `${active ? 'transparent' : onContrast ? 'border.contrast' : 'border'}`,\n          _invalid: `${onContrast ? 'border.danger.contrast' : 'border.danger'}`,\n        },\n        boxShadow: {\n          base: `${active ? (onContrast ? 'active.contrast' : 'active') : 'none'}`,\n          ...(!active && {\n            _hover: onContrast ? 'hover.contrast' : 'hover',\n          }),\n        },\n        cursor: 'pointer',\n        transition: '.1s all ease-in-out',\n      })}\n      {...(!fullWidth ? { maxW: 'max-content' } : { w: '100%' })}\n      onClick={(e) => {\n        onClick?.(e);\n      }}\n      {...rest}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"names":["CardPaddingMap","Card","active","fullWidth","interactive","invalid","onClick","onContrast","size","children","dataTestId","rest","jsx","Box","e"],"mappings":"2FAEaA,EAA2C,CACtD,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,CACN,EC4DaC,EAAO,CAAC,CACnB,OAAAC,EAAS,GACT,UAAAC,EAAY,GACZ,YAAAC,EAAc,GACd,QAAAC,EAAU,GACV,QAAAC,EACA,WAAAC,EAAa,GACb,KAAAC,EAAO,KACP,SAAAC,EACA,CAAC,eAAgBC,EAAa,cAC9B,GAAGC,CACL,IAEIC,EAAA,kBAAA,IAACC,EAAA,IAAA,CACC,UAAU,OACV,cAAaH,EACb,GAAIH,EAAa,sBAAwB,aACzC,EAAGP,EAAeQ,CAAI,EACtB,OAAO,MACP,YAAaD,EAAa,kBAAoB,SAC9C,aAAa,KACZ,GAAIF,GAAW,CAAE,eAAgB,EAAK,EACtC,GAAID,GAAe,CAClB,YAAa,CACX,KAAM,GAAGF,EAAS,cAAgBK,EAAa,kBAAoB,QAAQ,GAC3E,SAAU,GAAGA,EAAa,yBAA2B,eAAe,EACtE,EACA,UAAW,CACT,KAAM,GAAGL,EAAUK,EAAa,kBAAoB,SAAY,MAAM,GACtE,GAAI,CAACL,GAAU,CACb,OAAQK,EAAa,iBAAmB,OAAA,CAE5C,EACA,OAAQ,UACR,WAAY,qBACd,EACC,GAAKJ,EAAsC,CAAE,EAAG,MAAO,EAAtC,CAAE,KAAM,aAAc,EACxC,QAAUW,GAAM,CACdR,IAAUQ,CAAC,CACb,EACC,GAAGH,EAEH,SAAAF,CAAA,CACH"}

package/dist/chunks/center-Dmlzv1BW.js

@@ -0,0 +1,20 @@
+import { c as e } from "./factory-BQshv7_b.js";
+const n = e("div", {
+  base: {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  variants: {
+    inline: {
+      true: {
+        display: "inline-flex"
+      }
+    }
+  }
+});
+n.displayName = "Center";
+export {
+  n as C
+};
+//# sourceMappingURL=center-Dmlzv1BW.js.map

package/dist/chunks/center-Dmlzv1BW.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"center-Dmlzv1BW.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/center/center.js"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { chakra } from '../../styled-system/factory.js';\n\nconst Center = chakra(\"div\", {\n  base: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\"\n  },\n  variants: {\n    inline: {\n      true: {\n        display: \"inline-flex\"\n      }\n    }\n  }\n});\nCenter.displayName = \"Center\";\n\nexport { Center };\n"],"names":["Center","chakra"],"mappings":";AAIK,MAACA,IAASC,EAAO,OAAO;AAAA,EAC3B,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,EACjB;AAAA,EACD,UAAU;AAAA,IACR,QAAQ;AAAA,MACN,MAAM;AAAA,QACJ,SAAS;AAAA,MACjB;AAAA,IACA;AAAA,EACA;AACA,CAAC;AACDD,EAAO,cAAc;","x_google_ignoreList":[0]}

package/dist/chunks/center-kk61ArhQ.js

@@ -0,0 +1,2 @@
+"use strict";const t=require("./factory-a2SJjEvR.js"),e=t.chakra("div",{base:{display:"flex",alignItems:"center",justifyContent:"center"},variants:{inline:{true:{display:"inline-flex"}}}});e.displayName="Center";exports.Center=e;
+//# sourceMappingURL=center-kk61ArhQ.js.map

package/dist/chunks/center-kk61ArhQ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"center-kk61ArhQ.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/center/center.js"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { chakra } from '../../styled-system/factory.js';\n\nconst Center = chakra(\"div\", {\n  base: {\n    display: \"flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\"\n  },\n  variants: {\n    inline: {\n      true: {\n        display: \"inline-flex\"\n      }\n    }\n  }\n});\nCenter.displayName = \"Center\";\n\nexport { Center };\n"],"names":["Center","chakra"],"mappings":"sDAIMA,EAASC,EAAM,OAAC,MAAO,CAC3B,KAAM,CACJ,QAAS,OACT,WAAY,SACZ,eAAgB,QACjB,EACD,SAAU,CACR,OAAQ,CACN,KAAM,CACJ,QAAS,aACjB,CACA,CACA,CACA,CAAC,EACDD,EAAO,YAAc","x_google_ignoreList":[0]}

package/dist/chunks/characterCounter.component-CKDigkoD.js

@@ -0,0 +1,2 @@
+"use strict";const s=require("./jsx-runtime-BjDatQAs.js"),l=require("react"),a=require("./text.component-CeioUl0G.js"),d=require("./config-jChwZPSv.js"),x=require("./create-slot-recipe-context-HXE1VazG.js"),p=require("./flex-BOU6tYUd.js"),C=d.defineSlotRecipe({slots:["root","count","limit"],base:{root:{gap:.5}},variants:{variant:{default:{root:{background:"background"},count:{color:"text.subtle"},limit:{color:"text.subtle"}},onContrast:{root:{background:"background.contrast"},count:{color:"text.subtle.contrast"},limit:{color:"text.subtle.contrast"}}},invalid:{true:{count:{color:"text.danger"}},false:{}}},compoundVariants:[{invalid:!0,variant:"onContrast",css:{count:{color:"text.danger.contrast"}}}],defaultVariants:{variant:"default",invalid:!1}}),m=({currentCount:e,onContrast:n=!1,limit:t,withLimit:c=!0,["data-testid"]:r="kibble-character-counter"})=>{const i=n?"onContrast":"default",u=l.useMemo(()=>t?e>t:!1,[e,t]),o=x.useSlotRecipe({recipe:C})({variant:i,invalid:u});return s.jsxRuntimeExports.jsxs(p.Flex,{className:"CharacterCount","data-testid":r,css:o.root,children:[s.jsxRuntimeExports.jsx(a.WrappedText,{className:"CharacterCount__Count","data-testid":`${r}-count`,size:"xs",css:o.count,children:e}),c&&s.jsxRuntimeExports.jsxs(a.WrappedText,{className:"CharacterCount__Limit","data-testid":`${r}-limit`,size:"xs",css:o.limit,children:["/ ",t]})]})};exports.CharacterCounter=m;
+//# sourceMappingURL=characterCounter.component-CKDigkoD.js.map

package/dist/chunks/characterCounter.component-CKDigkoD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"characterCounter.component-CKDigkoD.js","sources":["../../src/components/CharacterCounter/characterCounter.recipe.ts","../../src/components/CharacterCounter/characterCounter.component.tsx"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nexport const characterCounterRecipe = defineSlotRecipe({\n  slots: ['root', 'count', 'limit'],\n  base: {\n    root: {\n      gap: 0.5,\n    },\n  },\n  variants: {\n    variant: {\n      default: {\n        root: {\n          background: 'background',\n        },\n        count: {\n          color: 'text.subtle',\n        },\n        limit: {\n          color: 'text.subtle',\n        },\n      },\n      onContrast: {\n        root: {\n          background: 'background.contrast',\n        },\n        count: {\n          color: 'text.subtle.contrast',\n        },\n        limit: {\n          color: 'text.subtle.contrast',\n        },\n      },\n    },\n    invalid: {\n      true: {\n        count: {\n          color: 'text.danger',\n        },\n      },\n      false: {},\n    },\n  },\n  compoundVariants: [\n    {\n      invalid: true,\n      variant: 'onContrast',\n      css: {\n        count: {\n          color: 'text.danger.contrast',\n        },\n      },\n    },\n  ],\n  defaultVariants: {\n    variant: 'default',\n    invalid: false,\n  },\n});\n","import React, { useMemo } from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Text } from 'components/Text/text.component';\nimport { useSlotRecipe } from '@chakra-ui/react';\nimport { characterCounterRecipe } from './characterCounter.recipe';\n\nexport interface BaseCharacterCounterProps {\n  /** Current character count. */\n  currentCount: number;\n  /** If true, the character counter will use a contrasting variant. */\n  onContrast?: boolean;\n  /** Data test id for the character counter. */\n  'data-testid'?: string;\n}\n\ninterface CharacterCounterWithLimitProps extends BaseCharacterCounterProps {\n  /** Character limit for the field. */\n  limit: number;\n  /** Whether to show the character limit. */\n  withLimit?: true;\n}\n\ninterface OnlyCharacterCounterProps extends BaseCharacterCounterProps {\n  /** Character limit for the field. */\n  limit?: never;\n  /** Whether to show the character limit. */\n  withLimit?: false;\n}\n\nexport type CharacterCounterProps = CharacterCounterWithLimitProps | OnlyCharacterCounterProps;\n\nexport const CharacterCounter = ({\n  currentCount,\n  onContrast = false,\n  limit,\n  withLimit = true,\n  ['data-testid']: dataTestId = 'kibble-character-counter',\n}: CharacterCounterProps): React.JSX.Element => {\n  const variant = onContrast ? 'onContrast' : 'default';\n  const invalid = useMemo(() => {\n    if (!limit) return false;\n    return currentCount > limit;\n  }, [currentCount, limit]);\n  const recipe = useSlotRecipe({ recipe: characterCounterRecipe });\n  const styles = recipe({ variant, invalid });\n\n  return (\n    <Flex className=\"CharacterCount\" data-testid={dataTestId} css={styles.root}>\n      <Text className=\"CharacterCount__Count\" data-testid={`${dataTestId}-count`} size=\"xs\" css={styles.count}>\n        {currentCount}\n      </Text>\n      {withLimit && (\n        <Text className=\"CharacterCount__Limit\" data-testid={`${dataTestId}-limit`} size=\"xs\" css={styles.limit}>\n          / {limit}\n        </Text>\n      )}\n    </Flex>\n  );\n};\n"],"names":["characterCounterRecipe","defineSlotRecipe","CharacterCounter","currentCount","onContrast","limit","withLimit","dataTestId","variant","invalid","useMemo","styles","useSlotRecipe","jsxs","Flex","jsx","Text"],"mappings":"+OAEaA,EAAyBC,EAAAA,iBAAiB,CACrD,MAAO,CAAC,OAAQ,QAAS,OAAO,EAChC,KAAM,CACJ,KAAM,CACJ,IAAK,EAAA,CAET,EACA,SAAU,CACR,QAAS,CACP,QAAS,CACP,KAAM,CACJ,WAAY,YACd,EACA,MAAO,CACL,MAAO,aACT,EACA,MAAO,CACL,MAAO,aAAA,CAEX,EACA,WAAY,CACV,KAAM,CACJ,WAAY,qBACd,EACA,MAAO,CACL,MAAO,sBACT,EACA,MAAO,CACL,MAAO,sBAAA,CACT,CAEJ,EACA,QAAS,CACP,KAAM,CACJ,MAAO,CACL,MAAO,aAAA,CAEX,EACA,MAAO,CAAA,CAAC,CAEZ,EACA,iBAAkB,CAChB,CACE,QAAS,GACT,QAAS,aACT,IAAK,CACH,MAAO,CACL,MAAO,sBAAA,CACT,CACF,CAEJ,EACA,gBAAiB,CACf,QAAS,UACT,QAAS,EAAA,CAEb,CAAC,EC3BYC,EAAmB,CAAC,CAC/B,aAAAC,EACA,WAAAC,EAAa,GACb,MAAAC,EACA,UAAAC,EAAY,GACZ,CAAC,eAAgBC,EAAa,0BAChC,IAAgD,CACxC,MAAAC,EAAUJ,EAAa,aAAe,UACtCK,EAAUC,EAAAA,QAAQ,IACjBL,EACEF,EAAeE,EADH,GAElB,CAACF,EAAcE,CAAK,CAAC,EAElBM,EADSC,EAAA,cAAc,CAAE,OAAQZ,EAAwB,EACzC,CAAE,QAAAQ,EAAS,QAAAC,EAAS,EAGxC,OAAAI,yBAACC,EAAAA,MAAK,UAAU,iBAAiB,cAAaP,EAAY,IAAKI,EAAO,KACpE,SAAA,CAAAI,EAAA,kBAAA,IAACC,EAAK,YAAA,CAAA,UAAU,wBAAwB,cAAa,GAAGT,CAAU,SAAU,KAAK,KAAK,IAAKI,EAAO,MAC/F,SACHR,EAAA,EACCG,GACCO,EAAA,kBAAA,KAACG,EAAK,YAAA,CAAA,UAAU,wBAAwB,cAAa,GAAGT,CAAU,SAAU,KAAK,KAAK,IAAKI,EAAO,MAAO,SAAA,CAAA,KACpGN,CAAA,CACL,CAAA,CAAA,EAEJ,CAEJ"}

package/dist/chunks/characterCounter.component-Ch3P3GqC.js

@@ -0,0 +1,82 @@
+import { j as e } from "./jsx-runtime-C5mzlN2N.js";
+import { useMemo as u } from "react";
+import { W as s } from "./text.component-CdTyTFds.js";
+import { d } from "./config-Djkl1N81.js";
+import { u as m } from "./create-slot-recipe-context-D_FXDJGp.js";
+import { F as p } from "./flex-CX-8gE9T.js";
+const f = d({
+  slots: ["root", "count", "limit"],
+  base: {
+    root: {
+      gap: 0.5
+    }
+  },
+  variants: {
+    variant: {
+      default: {
+        root: {
+          background: "background"
+        },
+        count: {
+          color: "text.subtle"
+        },
+        limit: {
+          color: "text.subtle"
+        }
+      },
+      onContrast: {
+        root: {
+          background: "background.contrast"
+        },
+        count: {
+          color: "text.subtle.contrast"
+        },
+        limit: {
+          color: "text.subtle.contrast"
+        }
+      }
+    },
+    invalid: {
+      true: {
+        count: {
+          color: "text.danger"
+        }
+      },
+      false: {}
+    }
+  },
+  compoundVariants: [
+    {
+      invalid: !0,
+      variant: "onContrast",
+      css: {
+        count: {
+          color: "text.danger.contrast"
+        }
+      }
+    }
+  ],
+  defaultVariants: {
+    variant: "default",
+    invalid: !1
+  }
+}), k = ({
+  currentCount: o,
+  onContrast: n = !1,
+  limit: t,
+  withLimit: c = !0,
+  ["data-testid"]: r = "kibble-character-counter"
+}) => {
+  const i = n ? "onContrast" : "default", l = u(() => t ? o > t : !1, [o, t]), a = m({ recipe: f })({ variant: i, invalid: l });
+  return /* @__PURE__ */ e.jsxs(p, { className: "CharacterCount", "data-testid": r, css: a.root, children: [
+    /* @__PURE__ */ e.jsx(s, { className: "CharacterCount__Count", "data-testid": `${r}-count`, size: "xs", css: a.count, children: o }),
+    c && /* @__PURE__ */ e.jsxs(s, { className: "CharacterCount__Limit", "data-testid": `${r}-limit`, size: "xs", css: a.limit, children: [
+      "/ ",
+      t
+    ] })
+  ] });
+};
+export {
+  k as C
+};
+//# sourceMappingURL=characterCounter.component-Ch3P3GqC.js.map

package/dist/chunks/characterCounter.component-Ch3P3GqC.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"characterCounter.component-Ch3P3GqC.js","sources":["../../src/components/CharacterCounter/characterCounter.recipe.ts","../../src/components/CharacterCounter/characterCounter.component.tsx"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nexport const characterCounterRecipe = defineSlotRecipe({\n  slots: ['root', 'count', 'limit'],\n  base: {\n    root: {\n      gap: 0.5,\n    },\n  },\n  variants: {\n    variant: {\n      default: {\n        root: {\n          background: 'background',\n        },\n        count: {\n          color: 'text.subtle',\n        },\n        limit: {\n          color: 'text.subtle',\n        },\n      },\n      onContrast: {\n        root: {\n          background: 'background.contrast',\n        },\n        count: {\n          color: 'text.subtle.contrast',\n        },\n        limit: {\n          color: 'text.subtle.contrast',\n        },\n      },\n    },\n    invalid: {\n      true: {\n        count: {\n          color: 'text.danger',\n        },\n      },\n      false: {},\n    },\n  },\n  compoundVariants: [\n    {\n      invalid: true,\n      variant: 'onContrast',\n      css: {\n        count: {\n          color: 'text.danger.contrast',\n        },\n      },\n    },\n  ],\n  defaultVariants: {\n    variant: 'default',\n    invalid: false,\n  },\n});\n","import React, { useMemo } from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Text } from 'components/Text/text.component';\nimport { useSlotRecipe } from '@chakra-ui/react';\nimport { characterCounterRecipe } from './characterCounter.recipe';\n\nexport interface BaseCharacterCounterProps {\n  /** Current character count. */\n  currentCount: number;\n  /** If true, the character counter will use a contrasting variant. */\n  onContrast?: boolean;\n  /** Data test id for the character counter. */\n  'data-testid'?: string;\n}\n\ninterface CharacterCounterWithLimitProps extends BaseCharacterCounterProps {\n  /** Character limit for the field. */\n  limit: number;\n  /** Whether to show the character limit. */\n  withLimit?: true;\n}\n\ninterface OnlyCharacterCounterProps extends BaseCharacterCounterProps {\n  /** Character limit for the field. */\n  limit?: never;\n  /** Whether to show the character limit. */\n  withLimit?: false;\n}\n\nexport type CharacterCounterProps = CharacterCounterWithLimitProps | OnlyCharacterCounterProps;\n\nexport const CharacterCounter = ({\n  currentCount,\n  onContrast = false,\n  limit,\n  withLimit = true,\n  ['data-testid']: dataTestId = 'kibble-character-counter',\n}: CharacterCounterProps): React.JSX.Element => {\n  const variant = onContrast ? 'onContrast' : 'default';\n  const invalid = useMemo(() => {\n    if (!limit) return false;\n    return currentCount > limit;\n  }, [currentCount, limit]);\n  const recipe = useSlotRecipe({ recipe: characterCounterRecipe });\n  const styles = recipe({ variant, invalid });\n\n  return (\n    <Flex className=\"CharacterCount\" data-testid={dataTestId} css={styles.root}>\n      <Text className=\"CharacterCount__Count\" data-testid={`${dataTestId}-count`} size=\"xs\" css={styles.count}>\n        {currentCount}\n      </Text>\n      {withLimit && (\n        <Text className=\"CharacterCount__Limit\" data-testid={`${dataTestId}-limit`} size=\"xs\" css={styles.limit}>\n          / {limit}\n        </Text>\n      )}\n    </Flex>\n  );\n};\n"],"names":["characterCounterRecipe","defineSlotRecipe","CharacterCounter","currentCount","onContrast","limit","withLimit","dataTestId","variant","invalid","useMemo","styles","useSlotRecipe","jsxs","Flex","jsx","Text"],"mappings":";;;;;;AAEO,MAAMA,IAAyBC,EAAiB;AAAA,EACrD,OAAO,CAAC,QAAQ,SAAS,OAAO;AAAA,EAChC,MAAM;AAAA,IACJ,MAAM;AAAA,MACJ,KAAK;AAAA,IAAA;AAAA,EAET;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,QACP,MAAM;AAAA,UACJ,YAAY;AAAA,QACd;AAAA,QACA,OAAO;AAAA,UACL,OAAO;AAAA,QACT;AAAA,QACA,OAAO;AAAA,UACL,OAAO;AAAA,QAAA;AAAA,MAEX;AAAA,MACA,YAAY;AAAA,QACV,MAAM;AAAA,UACJ,YAAY;AAAA,QACd;AAAA,QACA,OAAO;AAAA,UACL,OAAO;AAAA,QACT;AAAA,QACA,OAAO;AAAA,UACL,OAAO;AAAA,QAAA;AAAA,MACT;AAAA,IAEJ;AAAA,IACA,SAAS;AAAA,MACP,MAAM;AAAA,QACJ,OAAO;AAAA,UACL,OAAO;AAAA,QAAA;AAAA,MAEX;AAAA,MACA,OAAO,CAAA;AAAA,IAAC;AAAA,EAEZ;AAAA,EACA,kBAAkB;AAAA,IAChB;AAAA,MACE,SAAS;AAAA,MACT,SAAS;AAAA,MACT,KAAK;AAAA,QACH,OAAO;AAAA,UACL,OAAO;AAAA,QAAA;AAAA,MACT;AAAA,IACF;AAAA,EAEJ;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,SAAS;AAAA,EAAA;AAEb,CAAC,GC3BYC,IAAmB,CAAC;AAAA,EAC/B,cAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,OAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,CAAC,gBAAgBC,IAAa;AAChC,MAAgD;AACxC,QAAAC,IAAUJ,IAAa,eAAe,WACtCK,IAAUC,EAAQ,MACjBL,IACEF,IAAeE,IADH,IAElB,CAACF,GAAcE,CAAK,CAAC,GAElBM,IADSC,EAAc,EAAE,QAAQZ,GAAwB,EACzC,EAAE,SAAAQ,GAAS,SAAAC,GAAS;AAGxC,SAAAI,gBAAAA,OAACC,KAAK,WAAU,kBAAiB,eAAaP,GAAY,KAAKI,EAAO,MACpE,UAAA;AAAA,IAAAI,gBAAAA,EAAA,IAACC,GAAK,EAAA,WAAU,yBAAwB,eAAa,GAAGT,CAAU,UAAU,MAAK,MAAK,KAAKI,EAAO,OAC/F,UACHR,GAAA;AAAA,IACCG,KACCO,gBAAAA,EAAA,KAACG,GAAK,EAAA,WAAU,yBAAwB,eAAa,GAAGT,CAAU,UAAU,MAAK,MAAK,KAAKI,EAAO,OAAO,UAAA;AAAA,MAAA;AAAA,MACpGN;AAAA,IAAA,EACL,CAAA;AAAA,EAAA,GAEJ;AAEJ;"}