@televet/kibble-ui 5.0.28-rb.0 → 5.0.29-sc.1

package/dist/chunks/{alert.component-nhRTQ5KK.js → alert.component-B0gDwaKQ.js}

@@ -1,2 +1,2 @@
-"use strict";const e=require("./jsx-runtime-BjDatQAs.js"),j=require("react"),y=require("./heading.component-DnoZOXdz.js"),C=require("./icon.component-B1hr5lLa.js"),q=require("./text.component-BDDz5KQP.js"),g=require("./button.component-DjdgBXDC.js"),A=require("./flex-BOU6tYUd.js"),f=require("../cjs/shared/records/index.cjs"),N=require("./provider-NDo8kOkE.js"),S=require("./create-slot-recipe-context-HXE1VazG.js"),w=require("./factory-a2SJjEvR.js"),l=require("./icons-B6Nwr9di.js"),k=t=>t&&t.__esModule?t:{default:t},I=k(j),[B,W]=N.createContext({name:"AlertStatusContext",hookName:"useAlertStatusContext",providerName:"<Alert />"}),{withProvider:z,withContext:R,useStyles:$}=S.createSlotRecipeContext({key:"alert"}),F=z("div","root",{forwardAsChild:!0,wrapElement(t,s){return e.jsxRuntimeExports.jsx(B,{value:{status:s.status||"info"},children:t})}}),M=R("div","title"),D=R("div","description"),b=R("div","content"),H={info:l.InfoIcon,warning:l.WarningIcon,success:l.CheckCircleIcon,error:l.WarningIcon,neutral:l.InfoIcon},T=j.forwardRef(function(s,a){const i=W(),r=$(),x=typeof i.status=="string"?H[i.status]:j.Fragment,{children:u=e.jsxRuntimeExports.jsx(x,{}),...n}=s;return e.jsxRuntimeExports.jsx(w.chakra.span,{ref:a,...n,css:[r.indicator,s.css],children:u})}),p=({buttonPosition:t="topRight",buttonText:s,status:a,["data-testid"]:i="kibble-alert-button",...r})=>e.jsxRuntimeExports.jsx(A.Flex,{className:"Alert__Button","data-testid":i,...t!=="topRight"&&{pt:2,pb:1},...t==="bottomRight"&&{justifyContent:"flex-end"},children:e.jsxRuntimeExports.jsx(g.Button,{size:"xs",variant:a==="default"?"primary":"secondary",w:"max-content",...r,children:s})}),G=({buttonProps:t,description:s,descriptionProps:a,hideCloseButton:i=!1,hideIcon:r=!1,iconProps:x,onClose:u,onContrast:n=!1,status:o="success",title:d,titleProps:_,closeButtonIcon:E="close",["data-testid"]:c="kibble-alert",...v})=>{t&&!t.buttonPosition&&(t.buttonPosition="topRight");const m=t&&t.buttonPosition==="topRight",h=m?A.Flex:I.default.Fragment;return e.jsxRuntimeExports.jsxs(F,{className:"Alert","data-testid":c,...v,variant:o,hideIcon:r,onContrast:n,children:[!r&&e.jsxRuntimeExports.jsx(T,{className:"Alert__Icon","data-testid":`${c}-icon`,children:e.jsxRuntimeExports.jsx(C.Icon,{variant:n?"onContrast":f.StatusTypographyMap[o],name:x?.name||f.StatusIconMap[o],size:"lg",...x})}),e.jsxRuntimeExports.jsxs(b,{className:"Alert__Content","data-testid":`${c}-content`,children:[d&&e.jsxRuntimeExports.jsxs(h,{...m&&{justifyContent:"space-between",gap:2},children:[e.jsxRuntimeExports.jsx(M,{className:"Alert__Title","data-testid":`${c}-title`,children:e.jsxRuntimeExports.jsx(y.WrappedHeading,{size:"sm",variant:n?"onContrast":"default",..._,children:d})}),t&&t.buttonPosition==="topRight"&&e.jsxRuntimeExports.jsx(p,{status:o,onContrast:n,...t})]}),s&&e.jsxRuntimeExports.jsxs(h,{...m&&{justifyContent:"space-between"},children:[e.jsxRuntimeExports.jsx(D,{className:"Alert__Description","data-testid":`${c}-description`,children:typeof s=="string"?e.jsxRuntimeExports.jsx(q.WrappedText,{size:"md",variant:n?"onContrast":"default",...a,children:s}):s}),t&&t.buttonPosition==="topRight"&&!d&&e.jsxRuntimeExports.jsx(p,{status:o,onContrast:n,...t})]}),t&&t?.buttonPosition!=="topRight"&&e.jsxRuntimeExports.jsx(p,{status:o,onContrast:n,...t})]}),!i&&e.jsxRuntimeExports.jsx(g.Button,{className:"Alert__CloseTrigger","data-testid":`${c}-close-trigger`,iconName:E,size:"xs",variant:"ghostNeutral",onContrast:n,onClick:u})]})};exports.Alert=G;
-//# sourceMappingURL=alert.component-nhRTQ5KK.js.map
+"use strict";const e=require("./jsx-runtime-BjDatQAs.js"),j=require("react"),y=require("./heading.component-DeM4h5rY.js"),C=require("./icon.component-B1hr5lLa.js"),q=require("./text.component-D5GpbfNx.js"),g=require("./button.component-DjdgBXDC.js"),A=require("./flex-BOU6tYUd.js"),f=require("../cjs/shared/records/index.cjs"),N=require("./provider-NDo8kOkE.js"),S=require("./create-slot-recipe-context-HXE1VazG.js"),w=require("./factory-a2SJjEvR.js"),l=require("./icons-B6Nwr9di.js"),k=t=>t&&t.__esModule?t:{default:t},I=k(j),[B,W]=N.createContext({name:"AlertStatusContext",hookName:"useAlertStatusContext",providerName:"<Alert />"}),{withProvider:z,withContext:R,useStyles:$}=S.createSlotRecipeContext({key:"alert"}),F=z("div","root",{forwardAsChild:!0,wrapElement(t,s){return e.jsxRuntimeExports.jsx(B,{value:{status:s.status||"info"},children:t})}}),M=R("div","title"),D=R("div","description"),b=R("div","content"),H={info:l.InfoIcon,warning:l.WarningIcon,success:l.CheckCircleIcon,error:l.WarningIcon,neutral:l.InfoIcon},T=j.forwardRef(function(s,a){const i=W(),r=$(),x=typeof i.status=="string"?H[i.status]:j.Fragment,{children:u=e.jsxRuntimeExports.jsx(x,{}),...n}=s;return e.jsxRuntimeExports.jsx(w.chakra.span,{ref:a,...n,css:[r.indicator,s.css],children:u})}),p=({buttonPosition:t="topRight",buttonText:s,status:a,["data-testid"]:i="kibble-alert-button",...r})=>e.jsxRuntimeExports.jsx(A.Flex,{className:"Alert__Button","data-testid":i,...t!=="topRight"&&{pt:2,pb:1},...t==="bottomRight"&&{justifyContent:"flex-end"},children:e.jsxRuntimeExports.jsx(g.Button,{size:"xs",variant:a==="default"?"primary":"secondary",w:"max-content",...r,children:s})}),G=({buttonProps:t,description:s,descriptionProps:a,hideCloseButton:i=!1,hideIcon:r=!1,iconProps:x,onClose:u,onContrast:n=!1,status:o="success",title:d,titleProps:_,closeButtonIcon:E="close",["data-testid"]:c="kibble-alert",...v})=>{t&&!t.buttonPosition&&(t.buttonPosition="topRight");const m=t&&t.buttonPosition==="topRight",h=m?A.Flex:I.default.Fragment;return e.jsxRuntimeExports.jsxs(F,{className:"Alert","data-testid":c,...v,variant:o,hideIcon:r,onContrast:n,children:[!r&&e.jsxRuntimeExports.jsx(T,{className:"Alert__Icon","data-testid":`${c}-icon`,children:e.jsxRuntimeExports.jsx(C.Icon,{variant:n?"onContrast":f.StatusTypographyMap[o],name:x?.name||f.StatusIconMap[o],size:"lg",...x})}),e.jsxRuntimeExports.jsxs(b,{className:"Alert__Content","data-testid":`${c}-content`,children:[d&&e.jsxRuntimeExports.jsxs(h,{...m&&{justifyContent:"space-between",gap:2},children:[e.jsxRuntimeExports.jsx(M,{className:"Alert__Title","data-testid":`${c}-title`,children:e.jsxRuntimeExports.jsx(y.WrappedHeading,{size:"sm",variant:n?"onContrast":"default",..._,children:d})}),t&&t.buttonPosition==="topRight"&&e.jsxRuntimeExports.jsx(p,{status:o,onContrast:n,...t})]}),s&&e.jsxRuntimeExports.jsxs(h,{...m&&{justifyContent:"space-between"},children:[e.jsxRuntimeExports.jsx(D,{className:"Alert__Description","data-testid":`${c}-description`,children:typeof s=="string"?e.jsxRuntimeExports.jsx(q.WrappedText,{size:"md",variant:n?"onContrast":"default",...a,children:s}):s}),t&&t.buttonPosition==="topRight"&&!d&&e.jsxRuntimeExports.jsx(p,{status:o,onContrast:n,...t})]}),t&&t?.buttonPosition!=="topRight"&&e.jsxRuntimeExports.jsx(p,{status:o,onContrast:n,...t})]}),!i&&e.jsxRuntimeExports.jsx(g.Button,{className:"Alert__CloseTrigger","data-testid":`${c}-close-trigger`,iconName:E,size:"xs",variant:"ghostNeutral",onContrast:n,onClick:u})]})};exports.Alert=G;
+//# sourceMappingURL=alert.component-B0gDwaKQ.js.map

package/dist/chunks/{alert.component-nhRTQ5KK.js.map → alert.component-B0gDwaKQ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"alert.component-nhRTQ5KK.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/alert/alert.js","../../src/components/Alert/components/AlertButton/alertButton.component.tsx","../../src/components/Alert/alert.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { forwardRef, Fragment } from 'react';\nimport { createContext } from '../../create-context.js';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\nimport { chakra } from '../../styled-system/factory.js';\nimport { InfoIcon, WarningIcon, CheckCircleIcon } from '../icons.js';\n\nconst [AlertStatusProvider, useAlertStatusContext] = createContext({\n  name: \"AlertStatusContext\",\n  hookName: \"useAlertStatusContext\",\n  providerName: \"<Alert />\"\n});\nconst {\n  withProvider,\n  withContext,\n  useStyles: useAlertStyles,\n  PropsProvider\n} = createSlotRecipeContext({ key: \"alert\" });\nconst AlertRoot = withProvider(\n  \"div\",\n  \"root\",\n  {\n    forwardAsChild: true,\n    wrapElement(element, props) {\n      return (\n        // @ts-ignore fix later\n        /* @__PURE__ */ jsx(AlertStatusProvider, { value: { status: props.status || \"info\" }, children: element })\n      );\n    }\n  }\n);\nconst AlertPropsProvider = PropsProvider;\nconst AlertTitle = withContext(\n  \"div\",\n  \"title\"\n);\nconst AlertDescription = withContext(\"div\", \"description\");\nconst AlertContent = withContext(\n  \"div\",\n  \"content\"\n);\nconst iconMap = {\n  info: InfoIcon,\n  warning: WarningIcon,\n  success: CheckCircleIcon,\n  error: WarningIcon,\n  neutral: InfoIcon\n};\nconst AlertIndicator = forwardRef(\n  function AlertIndicator2(props, ref) {\n    const api = useAlertStatusContext();\n    const styles = useAlertStyles();\n    const Icon = typeof api.status === \"string\" ? iconMap[api.status] : Fragment;\n    const { children = /* @__PURE__ */ jsx(Icon, {}), ...rest } = props;\n    return /* @__PURE__ */ jsx(chakra.span, { ref, ...rest, css: [styles.indicator, props.css], children });\n  }\n);\n\nexport { AlertContent, AlertDescription, AlertIndicator, AlertPropsProvider, AlertRoot, AlertStatusProvider, AlertTitle, useAlertStatusContext, useAlertStyles };\n","import React from 'react';\nimport { AlertButtonPosition } from 'components/Alert/alert.types';\nimport { Button, ButtonProps } from 'components/Button/button.component';\nimport { Status } from 'shared/types/status';\nimport { Flex } from '@chakra-ui/react/flex';\n\nexport interface AlertButtonProps extends Omit<ButtonProps, 'children'> {\n  /** Position of the button.\n   * @default topRight\n   */\n  buttonPosition?: AlertButtonPosition;\n  /** Text to display in the button. */\n  buttonText: string;\n  /** Data test id for the button.\n   * @default kibble-alert-button\n   */\n  'data-testid'?: string;\n}\n\ninterface InternalAlertButtonProps extends AlertButtonProps {\n  /** Status of the alert.\n   * @internal\n   */\n  status: Status;\n}\n\nexport const AlertButton = ({\n  buttonPosition = 'topRight',\n  buttonText,\n  status,\n  ['data-testid']: dataTestId = 'kibble-alert-button',\n  ...rest\n}: InternalAlertButtonProps): React.JSX.Element => {\n  return (\n    <Flex\n      className=\"Alert__Button\"\n      data-testid={dataTestId}\n      {...(buttonPosition !== 'topRight' && { pt: 2, pb: 1 })}\n      {...(buttonPosition === 'bottomRight' && { justifyContent: 'flex-end' })}\n    >\n      <Button size=\"xs\" variant={status === 'default' ? 'primary' : 'secondary'} w=\"max-content\" {...rest}>\n        {buttonText}\n      </Button>\n    </Flex>\n  );\n};\n","import React from 'react';\nimport { Alert as CAlert } from '@chakra-ui/react/alert';\nimport { Heading, HeadingProps } from 'components/Heading/heading.component';\nimport { Icon, IconProps } from 'components/Icon/icon.component';\nimport { Text, TextProps } from 'components/Text/text.component';\nimport { Status } from 'shared/types/status';\nimport { Button } from 'components/Button/button.component';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { AlertButton, AlertButtonProps } from './components/AlertButton/alertButton.component';\nimport { StatusIconMap, StatusTypographyMap } from 'shared/records/status';\nimport { IconName } from 'components/Icon/icon.types';\n\nexport interface AlertProps extends Omit<CAlert.RootProps, 'title' | 'status' | 'children' | 'variant' | 'size'> {\n  /** Props to customize the alert button. */\n  buttonProps?: AlertButtonProps;\n  /** The body of the alert */\n  description?: React.ReactNode;\n  /** Props to customize the description when passed as a string. */\n  descriptionProps?: TextProps;\n  /**\n   * If true, the close button will not be displayed.\n   * @default false\n   */\n  hideCloseButton?: boolean;\n  /**\n   * If true, the icon will not be displayed.\n   * @default false\n   */\n  hideIcon?: boolean;\n  /** Props to customize the icon. */\n  iconProps?: IconProps;\n  /** Callback function to be called when the close button is clicked. */\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * If true, the alert will use a contrasting variant according to the selected status.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * The status of the alert. Determines the color of the alert.\n   * @default success\n   */\n  status?: Status;\n  /** The title of the alert. */\n  title?: React.ReactNode;\n  /** Props to customize the title when passed as a string. */\n  titleProps?: HeadingProps;\n  /** The name of the icon to be used as the close button. */\n  closeButtonIcon?: IconName;\n  /** Data test id for the alert.\n   * @default kibble-alert\n   */\n  'data-testid'?: string;\n}\n\nexport const Alert = ({\n  buttonProps,\n  description,\n  descriptionProps,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  onContrast = false,\n  status = 'success',\n  title,\n  titleProps,\n  closeButtonIcon = 'close',\n  ['data-testid']: dataTestId = 'kibble-alert',\n  ...rest\n}: AlertProps): React.JSX.Element => {\n  if (buttonProps && !buttonProps.buttonPosition) {\n    buttonProps.buttonPosition = 'topRight';\n  }\n  const isTopRightButton = buttonProps && buttonProps.buttonPosition === 'topRight';\n  const WithButtonWrapper = isTopRightButton ? Flex : React.Fragment;\n\n  return (\n    <CAlert.Root\n      className=\"Alert\"\n      data-testid={dataTestId}\n      {...rest}\n      variant={status}\n      hideIcon={hideIcon}\n      onContrast={onContrast}\n    >\n      {!hideIcon && (\n        <CAlert.Indicator className=\"Alert__Icon\" data-testid={`${dataTestId}-icon`}>\n          <Icon\n            variant={onContrast ? 'onContrast' : StatusTypographyMap[status]}\n            name={iconProps?.name || StatusIconMap[status]}\n            size=\"lg\"\n            {...iconProps}\n          />\n        </CAlert.Indicator>\n      )}\n      <CAlert.Content className=\"Alert__Content\" data-testid={`${dataTestId}-content`}>\n        {title && (\n          <WithButtonWrapper\n            {...(isTopRightButton && {\n              justifyContent: 'space-between',\n              gap: 2,\n            })}\n          >\n            <CAlert.Title className=\"Alert__Title\" data-testid={`${dataTestId}-title`}>\n              <Heading size=\"sm\" variant={onContrast ? 'onContrast' : 'default'} {...titleProps}>\n                {title}\n              </Heading>\n            </CAlert.Title>\n            {buttonProps && buttonProps.buttonPosition === 'topRight' && (\n              <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n            )}\n          </WithButtonWrapper>\n        )}\n        {description && (\n          <WithButtonWrapper {...(isTopRightButton && { justifyContent: 'space-between' })}>\n            <CAlert.Description className=\"Alert__Description\" data-testid={`${dataTestId}-description`}>\n              {typeof description === 'string' ? (\n                <Text size=\"md\" variant={onContrast ? 'onContrast' : 'default'} {...descriptionProps}>\n                  {description}\n                </Text>\n              ) : (\n                description\n              )}\n            </CAlert.Description>\n            {buttonProps && buttonProps.buttonPosition === 'topRight' && !title && (\n              <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n            )}\n          </WithButtonWrapper>\n        )}\n        {buttonProps && buttonProps?.buttonPosition !== 'topRight' && (\n          <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n        )}\n      </CAlert.Content>\n      {!hideCloseButton && (\n        <Button\n          className=\"Alert__CloseTrigger\"\n          data-testid={`${dataTestId}-close-trigger`}\n          iconName={closeButtonIcon}\n          size=\"xs\"\n          variant=\"ghostNeutral\"\n          onContrast={onContrast}\n          onClick={onClose}\n        />\n      )}\n    </CAlert.Root>\n  );\n};\n"],"names":["AlertStatusProvider","useAlertStatusContext","createContext","withProvider","withContext","useAlertStyles","createSlotRecipeContext","AlertRoot","element","props","jsx","AlertTitle","AlertDescription","AlertContent","iconMap","InfoIcon","WarningIcon","CheckCircleIcon","AlertIndicator","forwardRef","ref","api","styles","Icon","Fragment","children","rest","chakra","AlertButton","buttonPosition","buttonText","status","dataTestId","Flex","Button","Alert","buttonProps","description","descriptionProps","hideCloseButton","hideIcon","iconProps","onClose","onContrast","title","titleProps","closeButtonIcon","isTopRightButton","WithButtonWrapper","React","jsxs","CAlert.Root","CAlert.Indicator","StatusTypographyMap","StatusIconMap","CAlert.Content","CAlert.Title","Heading","CAlert.Description","Text"],"mappings":"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","x_google_ignoreList":[0]}
+{"version":3,"file":"alert.component-B0gDwaKQ.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/alert/alert.js","../../src/components/Alert/components/AlertButton/alertButton.component.tsx","../../src/components/Alert/alert.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { forwardRef, Fragment } from 'react';\nimport { createContext } from '../../create-context.js';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\nimport { chakra } from '../../styled-system/factory.js';\nimport { InfoIcon, WarningIcon, CheckCircleIcon } from '../icons.js';\n\nconst [AlertStatusProvider, useAlertStatusContext] = createContext({\n  name: \"AlertStatusContext\",\n  hookName: \"useAlertStatusContext\",\n  providerName: \"<Alert />\"\n});\nconst {\n  withProvider,\n  withContext,\n  useStyles: useAlertStyles,\n  PropsProvider\n} = createSlotRecipeContext({ key: \"alert\" });\nconst AlertRoot = withProvider(\n  \"div\",\n  \"root\",\n  {\n    forwardAsChild: true,\n    wrapElement(element, props) {\n      return (\n        // @ts-ignore fix later\n        /* @__PURE__ */ jsx(AlertStatusProvider, { value: { status: props.status || \"info\" }, children: element })\n      );\n    }\n  }\n);\nconst AlertPropsProvider = PropsProvider;\nconst AlertTitle = withContext(\n  \"div\",\n  \"title\"\n);\nconst AlertDescription = withContext(\"div\", \"description\");\nconst AlertContent = withContext(\n  \"div\",\n  \"content\"\n);\nconst iconMap = {\n  info: InfoIcon,\n  warning: WarningIcon,\n  success: CheckCircleIcon,\n  error: WarningIcon,\n  neutral: InfoIcon\n};\nconst AlertIndicator = forwardRef(\n  function AlertIndicator2(props, ref) {\n    const api = useAlertStatusContext();\n    const styles = useAlertStyles();\n    const Icon = typeof api.status === \"string\" ? iconMap[api.status] : Fragment;\n    const { children = /* @__PURE__ */ jsx(Icon, {}), ...rest } = props;\n    return /* @__PURE__ */ jsx(chakra.span, { ref, ...rest, css: [styles.indicator, props.css], children });\n  }\n);\n\nexport { AlertContent, AlertDescription, AlertIndicator, AlertPropsProvider, AlertRoot, AlertStatusProvider, AlertTitle, useAlertStatusContext, useAlertStyles };\n","import React from 'react';\nimport { AlertButtonPosition } from 'components/Alert/alert.types';\nimport { Button, ButtonProps } from 'components/Button/button.component';\nimport { Status } from 'shared/types/status';\nimport { Flex } from '@chakra-ui/react/flex';\n\nexport interface AlertButtonProps extends Omit<ButtonProps, 'children'> {\n  /** Position of the button.\n   * @default topRight\n   */\n  buttonPosition?: AlertButtonPosition;\n  /** Text to display in the button. */\n  buttonText: string;\n  /** Data test id for the button.\n   * @default kibble-alert-button\n   */\n  'data-testid'?: string;\n}\n\ninterface InternalAlertButtonProps extends AlertButtonProps {\n  /** Status of the alert.\n   * @internal\n   */\n  status: Status;\n}\n\nexport const AlertButton = ({\n  buttonPosition = 'topRight',\n  buttonText,\n  status,\n  ['data-testid']: dataTestId = 'kibble-alert-button',\n  ...rest\n}: InternalAlertButtonProps): React.JSX.Element => {\n  return (\n    <Flex\n      className=\"Alert__Button\"\n      data-testid={dataTestId}\n      {...(buttonPosition !== 'topRight' && { pt: 2, pb: 1 })}\n      {...(buttonPosition === 'bottomRight' && { justifyContent: 'flex-end' })}\n    >\n      <Button size=\"xs\" variant={status === 'default' ? 'primary' : 'secondary'} w=\"max-content\" {...rest}>\n        {buttonText}\n      </Button>\n    </Flex>\n  );\n};\n","import React from 'react';\nimport { Alert as CAlert } from '@chakra-ui/react/alert';\nimport { Heading, HeadingProps } from 'components/Heading/heading.component';\nimport { Icon, IconProps } from 'components/Icon/icon.component';\nimport { Text, TextProps } from 'components/Text/text.component';\nimport { Status } from 'shared/types/status';\nimport { Button } from 'components/Button/button.component';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { AlertButton, AlertButtonProps } from './components/AlertButton/alertButton.component';\nimport { StatusIconMap, StatusTypographyMap } from 'shared/records/status';\nimport { IconName } from 'components/Icon/icon.types';\n\nexport interface AlertProps extends Omit<CAlert.RootProps, 'title' | 'status' | 'children' | 'variant' | 'size'> {\n  /** Props to customize the alert button. */\n  buttonProps?: AlertButtonProps;\n  /** The body of the alert */\n  description?: React.ReactNode;\n  /** Props to customize the description when passed as a string. */\n  descriptionProps?: TextProps;\n  /**\n   * If true, the close button will not be displayed.\n   * @default false\n   */\n  hideCloseButton?: boolean;\n  /**\n   * If true, the icon will not be displayed.\n   * @default false\n   */\n  hideIcon?: boolean;\n  /** Props to customize the icon. */\n  iconProps?: IconProps;\n  /** Callback function to be called when the close button is clicked. */\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * If true, the alert will use a contrasting variant according to the selected status.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * The status of the alert. Determines the color of the alert.\n   * @default success\n   */\n  status?: Status;\n  /** The title of the alert. */\n  title?: React.ReactNode;\n  /** Props to customize the title when passed as a string. */\n  titleProps?: HeadingProps;\n  /** The name of the icon to be used as the close button. */\n  closeButtonIcon?: IconName;\n  /** Data test id for the alert.\n   * @default kibble-alert\n   */\n  'data-testid'?: string;\n}\n\nexport const Alert = ({\n  buttonProps,\n  description,\n  descriptionProps,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  onContrast = false,\n  status = 'success',\n  title,\n  titleProps,\n  closeButtonIcon = 'close',\n  ['data-testid']: dataTestId = 'kibble-alert',\n  ...rest\n}: AlertProps): React.JSX.Element => {\n  if (buttonProps && !buttonProps.buttonPosition) {\n    buttonProps.buttonPosition = 'topRight';\n  }\n  const isTopRightButton = buttonProps && buttonProps.buttonPosition === 'topRight';\n  const WithButtonWrapper = isTopRightButton ? Flex : React.Fragment;\n\n  return (\n    <CAlert.Root\n      className=\"Alert\"\n      data-testid={dataTestId}\n      {...rest}\n      variant={status}\n      hideIcon={hideIcon}\n      onContrast={onContrast}\n    >\n      {!hideIcon && (\n        <CAlert.Indicator className=\"Alert__Icon\" data-testid={`${dataTestId}-icon`}>\n          <Icon\n            variant={onContrast ? 'onContrast' : StatusTypographyMap[status]}\n            name={iconProps?.name || StatusIconMap[status]}\n            size=\"lg\"\n            {...iconProps}\n          />\n        </CAlert.Indicator>\n      )}\n      <CAlert.Content className=\"Alert__Content\" data-testid={`${dataTestId}-content`}>\n        {title && (\n          <WithButtonWrapper\n            {...(isTopRightButton && {\n              justifyContent: 'space-between',\n              gap: 2,\n            })}\n          >\n            <CAlert.Title className=\"Alert__Title\" data-testid={`${dataTestId}-title`}>\n              <Heading size=\"sm\" variant={onContrast ? 'onContrast' : 'default'} {...titleProps}>\n                {title}\n              </Heading>\n            </CAlert.Title>\n            {buttonProps && buttonProps.buttonPosition === 'topRight' && (\n              <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n            )}\n          </WithButtonWrapper>\n        )}\n        {description && (\n          <WithButtonWrapper {...(isTopRightButton && { justifyContent: 'space-between' })}>\n            <CAlert.Description className=\"Alert__Description\" data-testid={`${dataTestId}-description`}>\n              {typeof description === 'string' ? (\n                <Text size=\"md\" variant={onContrast ? 'onContrast' : 'default'} {...descriptionProps}>\n                  {description}\n                </Text>\n              ) : (\n                description\n              )}\n            </CAlert.Description>\n            {buttonProps && buttonProps.buttonPosition === 'topRight' && !title && (\n              <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n            )}\n          </WithButtonWrapper>\n        )}\n        {buttonProps && buttonProps?.buttonPosition !== 'topRight' && (\n          <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n        )}\n      </CAlert.Content>\n      {!hideCloseButton && (\n        <Button\n          className=\"Alert__CloseTrigger\"\n          data-testid={`${dataTestId}-close-trigger`}\n          iconName={closeButtonIcon}\n          size=\"xs\"\n          variant=\"ghostNeutral\"\n          onContrast={onContrast}\n          onClick={onClose}\n        />\n      )}\n    </CAlert.Root>\n  );\n};\n"],"names":["AlertStatusProvider","useAlertStatusContext","createContext","withProvider","withContext","useAlertStyles","createSlotRecipeContext","AlertRoot","element","props","jsx","AlertTitle","AlertDescription","AlertContent","iconMap","InfoIcon","WarningIcon","CheckCircleIcon","AlertIndicator","forwardRef","ref","api","styles","Icon","Fragment","children","rest","chakra","AlertButton","buttonPosition","buttonText","status","dataTestId","Flex","Button","Alert","buttonProps","description","descriptionProps","hideCloseButton","hideIcon","iconProps","onClose","onContrast","title","titleProps","closeButtonIcon","isTopRightButton","WithButtonWrapper","React","jsxs","CAlert.Root","CAlert.Indicator","StatusTypographyMap","StatusIconMap","CAlert.Content","CAlert.Title","Heading","CAlert.Description","Text"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/chunks/{alert.component-OcRbeRJa.js → alert.component-B2kzYzhv.js}

@@ -1,8 +1,8 @@
 import { j as e } from "./jsx-runtime-C5mzlN2N.js";
 import y, { forwardRef as C, Fragment as N } from "react";
-import { W as w } from "./heading.component-CpSAN3cv.js";
+import { W as w } from "./heading.component-BBTU00_w.js";
 import { I as S } from "./icon.component-PV_nHBId.js";
-import { W } from "./text.component-DhuUgP3j.js";
+import { W } from "./text.component-C9jh_JMO.js";
 import { B as j } from "./button.component-BO6oee_V.js";
 import { F as A } from "./flex-CX-8gE9T.js";
 import { StatusIconMap as k, StatusTypographyMap as B } from "../esm/shared/records/index.js";
@@ -138,4 +138,4 @@ const [M, D] = I({
 export {
   it as A
 };
-//# sourceMappingURL=alert.component-OcRbeRJa.js.map
+//# sourceMappingURL=alert.component-B2kzYzhv.js.map

package/dist/chunks/{alert.component-OcRbeRJa.js.map → alert.component-B2kzYzhv.js.map}

@@ -1 +1 @@
-{"version":3,"file":"alert.component-OcRbeRJa.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/alert/alert.js","../../src/components/Alert/components/AlertButton/alertButton.component.tsx","../../src/components/Alert/alert.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { forwardRef, Fragment } from 'react';\nimport { createContext } from '../../create-context.js';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\nimport { chakra } from '../../styled-system/factory.js';\nimport { InfoIcon, WarningIcon, CheckCircleIcon } from '../icons.js';\n\nconst [AlertStatusProvider, useAlertStatusContext] = createContext({\n  name: \"AlertStatusContext\",\n  hookName: \"useAlertStatusContext\",\n  providerName: \"<Alert />\"\n});\nconst {\n  withProvider,\n  withContext,\n  useStyles: useAlertStyles,\n  PropsProvider\n} = createSlotRecipeContext({ key: \"alert\" });\nconst AlertRoot = withProvider(\n  \"div\",\n  \"root\",\n  {\n    forwardAsChild: true,\n    wrapElement(element, props) {\n      return (\n        // @ts-ignore fix later\n        /* @__PURE__ */ jsx(AlertStatusProvider, { value: { status: props.status || \"info\" }, children: element })\n      );\n    }\n  }\n);\nconst AlertPropsProvider = PropsProvider;\nconst AlertTitle = withContext(\n  \"div\",\n  \"title\"\n);\nconst AlertDescription = withContext(\"div\", \"description\");\nconst AlertContent = withContext(\n  \"div\",\n  \"content\"\n);\nconst iconMap = {\n  info: InfoIcon,\n  warning: WarningIcon,\n  success: CheckCircleIcon,\n  error: WarningIcon,\n  neutral: InfoIcon\n};\nconst AlertIndicator = forwardRef(\n  function AlertIndicator2(props, ref) {\n    const api = useAlertStatusContext();\n    const styles = useAlertStyles();\n    const Icon = typeof api.status === \"string\" ? iconMap[api.status] : Fragment;\n    const { children = /* @__PURE__ */ jsx(Icon, {}), ...rest } = props;\n    return /* @__PURE__ */ jsx(chakra.span, { ref, ...rest, css: [styles.indicator, props.css], children });\n  }\n);\n\nexport { AlertContent, AlertDescription, AlertIndicator, AlertPropsProvider, AlertRoot, AlertStatusProvider, AlertTitle, useAlertStatusContext, useAlertStyles };\n","import React from 'react';\nimport { AlertButtonPosition } from 'components/Alert/alert.types';\nimport { Button, ButtonProps } from 'components/Button/button.component';\nimport { Status } from 'shared/types/status';\nimport { Flex } from '@chakra-ui/react/flex';\n\nexport interface AlertButtonProps extends Omit<ButtonProps, 'children'> {\n  /** Position of the button.\n   * @default topRight\n   */\n  buttonPosition?: AlertButtonPosition;\n  /** Text to display in the button. */\n  buttonText: string;\n  /** Data test id for the button.\n   * @default kibble-alert-button\n   */\n  'data-testid'?: string;\n}\n\ninterface InternalAlertButtonProps extends AlertButtonProps {\n  /** Status of the alert.\n   * @internal\n   */\n  status: Status;\n}\n\nexport const AlertButton = ({\n  buttonPosition = 'topRight',\n  buttonText,\n  status,\n  ['data-testid']: dataTestId = 'kibble-alert-button',\n  ...rest\n}: InternalAlertButtonProps): React.JSX.Element => {\n  return (\n    <Flex\n      className=\"Alert__Button\"\n      data-testid={dataTestId}\n      {...(buttonPosition !== 'topRight' && { pt: 2, pb: 1 })}\n      {...(buttonPosition === 'bottomRight' && { justifyContent: 'flex-end' })}\n    >\n      <Button size=\"xs\" variant={status === 'default' ? 'primary' : 'secondary'} w=\"max-content\" {...rest}>\n        {buttonText}\n      </Button>\n    </Flex>\n  );\n};\n","import React from 'react';\nimport { Alert as CAlert } from '@chakra-ui/react/alert';\nimport { Heading, HeadingProps } from 'components/Heading/heading.component';\nimport { Icon, IconProps } from 'components/Icon/icon.component';\nimport { Text, TextProps } from 'components/Text/text.component';\nimport { Status } from 'shared/types/status';\nimport { Button } from 'components/Button/button.component';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { AlertButton, AlertButtonProps } from './components/AlertButton/alertButton.component';\nimport { StatusIconMap, StatusTypographyMap } from 'shared/records/status';\nimport { IconName } from 'components/Icon/icon.types';\n\nexport interface AlertProps extends Omit<CAlert.RootProps, 'title' | 'status' | 'children' | 'variant' | 'size'> {\n  /** Props to customize the alert button. */\n  buttonProps?: AlertButtonProps;\n  /** The body of the alert */\n  description?: React.ReactNode;\n  /** Props to customize the description when passed as a string. */\n  descriptionProps?: TextProps;\n  /**\n   * If true, the close button will not be displayed.\n   * @default false\n   */\n  hideCloseButton?: boolean;\n  /**\n   * If true, the icon will not be displayed.\n   * @default false\n   */\n  hideIcon?: boolean;\n  /** Props to customize the icon. */\n  iconProps?: IconProps;\n  /** Callback function to be called when the close button is clicked. */\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * If true, the alert will use a contrasting variant according to the selected status.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * The status of the alert. Determines the color of the alert.\n   * @default success\n   */\n  status?: Status;\n  /** The title of the alert. */\n  title?: React.ReactNode;\n  /** Props to customize the title when passed as a string. */\n  titleProps?: HeadingProps;\n  /** The name of the icon to be used as the close button. */\n  closeButtonIcon?: IconName;\n  /** Data test id for the alert.\n   * @default kibble-alert\n   */\n  'data-testid'?: string;\n}\n\nexport const Alert = ({\n  buttonProps,\n  description,\n  descriptionProps,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  onContrast = false,\n  status = 'success',\n  title,\n  titleProps,\n  closeButtonIcon = 'close',\n  ['data-testid']: dataTestId = 'kibble-alert',\n  ...rest\n}: AlertProps): React.JSX.Element => {\n  if (buttonProps && !buttonProps.buttonPosition) {\n    buttonProps.buttonPosition = 'topRight';\n  }\n  const isTopRightButton = buttonProps && buttonProps.buttonPosition === 'topRight';\n  const WithButtonWrapper = isTopRightButton ? Flex : React.Fragment;\n\n  return (\n    <CAlert.Root\n      className=\"Alert\"\n      data-testid={dataTestId}\n      {...rest}\n      variant={status}\n      hideIcon={hideIcon}\n      onContrast={onContrast}\n    >\n      {!hideIcon && (\n        <CAlert.Indicator className=\"Alert__Icon\" data-testid={`${dataTestId}-icon`}>\n          <Icon\n            variant={onContrast ? 'onContrast' : StatusTypographyMap[status]}\n            name={iconProps?.name || StatusIconMap[status]}\n            size=\"lg\"\n            {...iconProps}\n          />\n        </CAlert.Indicator>\n      )}\n      <CAlert.Content className=\"Alert__Content\" data-testid={`${dataTestId}-content`}>\n        {title && (\n          <WithButtonWrapper\n            {...(isTopRightButton && {\n              justifyContent: 'space-between',\n              gap: 2,\n            })}\n          >\n            <CAlert.Title className=\"Alert__Title\" data-testid={`${dataTestId}-title`}>\n              <Heading size=\"sm\" variant={onContrast ? 'onContrast' : 'default'} {...titleProps}>\n                {title}\n              </Heading>\n            </CAlert.Title>\n            {buttonProps && buttonProps.buttonPosition === 'topRight' && (\n              <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n            )}\n          </WithButtonWrapper>\n        )}\n        {description && (\n          <WithButtonWrapper {...(isTopRightButton && { justifyContent: 'space-between' })}>\n            <CAlert.Description className=\"Alert__Description\" data-testid={`${dataTestId}-description`}>\n              {typeof description === 'string' ? (\n                <Text size=\"md\" variant={onContrast ? 'onContrast' : 'default'} {...descriptionProps}>\n                  {description}\n                </Text>\n              ) : (\n                description\n              )}\n            </CAlert.Description>\n            {buttonProps && buttonProps.buttonPosition === 'topRight' && !title && (\n              <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n            )}\n          </WithButtonWrapper>\n        )}\n        {buttonProps && buttonProps?.buttonPosition !== 'topRight' && (\n          <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n        )}\n      </CAlert.Content>\n      {!hideCloseButton && (\n        <Button\n          className=\"Alert__CloseTrigger\"\n          data-testid={`${dataTestId}-close-trigger`}\n          iconName={closeButtonIcon}\n          size=\"xs\"\n          variant=\"ghostNeutral\"\n          onContrast={onContrast}\n          onClick={onClose}\n        />\n      )}\n    </CAlert.Root>\n  );\n};\n"],"names":["AlertStatusProvider","useAlertStatusContext","createContext","withProvider","withContext","useAlertStyles","createSlotRecipeContext","AlertRoot","element","props","jsx","AlertTitle","AlertDescription","AlertContent","iconMap","InfoIcon","WarningIcon","CheckCircleIcon","AlertIndicator","forwardRef","ref","api","styles","Icon","Fragment","children","rest","chakra","AlertButton","buttonPosition","buttonText","status","dataTestId","Flex","Button","Alert","buttonProps","description","descriptionProps","hideCloseButton","hideIcon","iconProps","onClose","onContrast","title","titleProps","closeButtonIcon","isTopRightButton","WithButtonWrapper","React","jsxs","CAlert.Root","CAlert.Indicator","StatusTypographyMap","StatusIconMap","CAlert.Content","CAlert.Title","Heading","CAlert.Description","Text"],"mappings":"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","x_google_ignoreList":[0]}
+{"version":3,"file":"alert.component-B2kzYzhv.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/alert/alert.js","../../src/components/Alert/components/AlertButton/alertButton.component.tsx","../../src/components/Alert/alert.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { forwardRef, Fragment } from 'react';\nimport { createContext } from '../../create-context.js';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\nimport { chakra } from '../../styled-system/factory.js';\nimport { InfoIcon, WarningIcon, CheckCircleIcon } from '../icons.js';\n\nconst [AlertStatusProvider, useAlertStatusContext] = createContext({\n  name: \"AlertStatusContext\",\n  hookName: \"useAlertStatusContext\",\n  providerName: \"<Alert />\"\n});\nconst {\n  withProvider,\n  withContext,\n  useStyles: useAlertStyles,\n  PropsProvider\n} = createSlotRecipeContext({ key: \"alert\" });\nconst AlertRoot = withProvider(\n  \"div\",\n  \"root\",\n  {\n    forwardAsChild: true,\n    wrapElement(element, props) {\n      return (\n        // @ts-ignore fix later\n        /* @__PURE__ */ jsx(AlertStatusProvider, { value: { status: props.status || \"info\" }, children: element })\n      );\n    }\n  }\n);\nconst AlertPropsProvider = PropsProvider;\nconst AlertTitle = withContext(\n  \"div\",\n  \"title\"\n);\nconst AlertDescription = withContext(\"div\", \"description\");\nconst AlertContent = withContext(\n  \"div\",\n  \"content\"\n);\nconst iconMap = {\n  info: InfoIcon,\n  warning: WarningIcon,\n  success: CheckCircleIcon,\n  error: WarningIcon,\n  neutral: InfoIcon\n};\nconst AlertIndicator = forwardRef(\n  function AlertIndicator2(props, ref) {\n    const api = useAlertStatusContext();\n    const styles = useAlertStyles();\n    const Icon = typeof api.status === \"string\" ? iconMap[api.status] : Fragment;\n    const { children = /* @__PURE__ */ jsx(Icon, {}), ...rest } = props;\n    return /* @__PURE__ */ jsx(chakra.span, { ref, ...rest, css: [styles.indicator, props.css], children });\n  }\n);\n\nexport { AlertContent, AlertDescription, AlertIndicator, AlertPropsProvider, AlertRoot, AlertStatusProvider, AlertTitle, useAlertStatusContext, useAlertStyles };\n","import React from 'react';\nimport { AlertButtonPosition } from 'components/Alert/alert.types';\nimport { Button, ButtonProps } from 'components/Button/button.component';\nimport { Status } from 'shared/types/status';\nimport { Flex } from '@chakra-ui/react/flex';\n\nexport interface AlertButtonProps extends Omit<ButtonProps, 'children'> {\n  /** Position of the button.\n   * @default topRight\n   */\n  buttonPosition?: AlertButtonPosition;\n  /** Text to display in the button. */\n  buttonText: string;\n  /** Data test id for the button.\n   * @default kibble-alert-button\n   */\n  'data-testid'?: string;\n}\n\ninterface InternalAlertButtonProps extends AlertButtonProps {\n  /** Status of the alert.\n   * @internal\n   */\n  status: Status;\n}\n\nexport const AlertButton = ({\n  buttonPosition = 'topRight',\n  buttonText,\n  status,\n  ['data-testid']: dataTestId = 'kibble-alert-button',\n  ...rest\n}: InternalAlertButtonProps): React.JSX.Element => {\n  return (\n    <Flex\n      className=\"Alert__Button\"\n      data-testid={dataTestId}\n      {...(buttonPosition !== 'topRight' && { pt: 2, pb: 1 })}\n      {...(buttonPosition === 'bottomRight' && { justifyContent: 'flex-end' })}\n    >\n      <Button size=\"xs\" variant={status === 'default' ? 'primary' : 'secondary'} w=\"max-content\" {...rest}>\n        {buttonText}\n      </Button>\n    </Flex>\n  );\n};\n","import React from 'react';\nimport { Alert as CAlert } from '@chakra-ui/react/alert';\nimport { Heading, HeadingProps } from 'components/Heading/heading.component';\nimport { Icon, IconProps } from 'components/Icon/icon.component';\nimport { Text, TextProps } from 'components/Text/text.component';\nimport { Status } from 'shared/types/status';\nimport { Button } from 'components/Button/button.component';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { AlertButton, AlertButtonProps } from './components/AlertButton/alertButton.component';\nimport { StatusIconMap, StatusTypographyMap } from 'shared/records/status';\nimport { IconName } from 'components/Icon/icon.types';\n\nexport interface AlertProps extends Omit<CAlert.RootProps, 'title' | 'status' | 'children' | 'variant' | 'size'> {\n  /** Props to customize the alert button. */\n  buttonProps?: AlertButtonProps;\n  /** The body of the alert */\n  description?: React.ReactNode;\n  /** Props to customize the description when passed as a string. */\n  descriptionProps?: TextProps;\n  /**\n   * If true, the close button will not be displayed.\n   * @default false\n   */\n  hideCloseButton?: boolean;\n  /**\n   * If true, the icon will not be displayed.\n   * @default false\n   */\n  hideIcon?: boolean;\n  /** Props to customize the icon. */\n  iconProps?: IconProps;\n  /** Callback function to be called when the close button is clicked. */\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  /**\n   * If true, the alert will use a contrasting variant according to the selected status.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * The status of the alert. Determines the color of the alert.\n   * @default success\n   */\n  status?: Status;\n  /** The title of the alert. */\n  title?: React.ReactNode;\n  /** Props to customize the title when passed as a string. */\n  titleProps?: HeadingProps;\n  /** The name of the icon to be used as the close button. */\n  closeButtonIcon?: IconName;\n  /** Data test id for the alert.\n   * @default kibble-alert\n   */\n  'data-testid'?: string;\n}\n\nexport const Alert = ({\n  buttonProps,\n  description,\n  descriptionProps,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  onContrast = false,\n  status = 'success',\n  title,\n  titleProps,\n  closeButtonIcon = 'close',\n  ['data-testid']: dataTestId = 'kibble-alert',\n  ...rest\n}: AlertProps): React.JSX.Element => {\n  if (buttonProps && !buttonProps.buttonPosition) {\n    buttonProps.buttonPosition = 'topRight';\n  }\n  const isTopRightButton = buttonProps && buttonProps.buttonPosition === 'topRight';\n  const WithButtonWrapper = isTopRightButton ? Flex : React.Fragment;\n\n  return (\n    <CAlert.Root\n      className=\"Alert\"\n      data-testid={dataTestId}\n      {...rest}\n      variant={status}\n      hideIcon={hideIcon}\n      onContrast={onContrast}\n    >\n      {!hideIcon && (\n        <CAlert.Indicator className=\"Alert__Icon\" data-testid={`${dataTestId}-icon`}>\n          <Icon\n            variant={onContrast ? 'onContrast' : StatusTypographyMap[status]}\n            name={iconProps?.name || StatusIconMap[status]}\n            size=\"lg\"\n            {...iconProps}\n          />\n        </CAlert.Indicator>\n      )}\n      <CAlert.Content className=\"Alert__Content\" data-testid={`${dataTestId}-content`}>\n        {title && (\n          <WithButtonWrapper\n            {...(isTopRightButton && {\n              justifyContent: 'space-between',\n              gap: 2,\n            })}\n          >\n            <CAlert.Title className=\"Alert__Title\" data-testid={`${dataTestId}-title`}>\n              <Heading size=\"sm\" variant={onContrast ? 'onContrast' : 'default'} {...titleProps}>\n                {title}\n              </Heading>\n            </CAlert.Title>\n            {buttonProps && buttonProps.buttonPosition === 'topRight' && (\n              <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n            )}\n          </WithButtonWrapper>\n        )}\n        {description && (\n          <WithButtonWrapper {...(isTopRightButton && { justifyContent: 'space-between' })}>\n            <CAlert.Description className=\"Alert__Description\" data-testid={`${dataTestId}-description`}>\n              {typeof description === 'string' ? (\n                <Text size=\"md\" variant={onContrast ? 'onContrast' : 'default'} {...descriptionProps}>\n                  {description}\n                </Text>\n              ) : (\n                description\n              )}\n            </CAlert.Description>\n            {buttonProps && buttonProps.buttonPosition === 'topRight' && !title && (\n              <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n            )}\n          </WithButtonWrapper>\n        )}\n        {buttonProps && buttonProps?.buttonPosition !== 'topRight' && (\n          <AlertButton status={status} onContrast={onContrast} {...buttonProps} />\n        )}\n      </CAlert.Content>\n      {!hideCloseButton && (\n        <Button\n          className=\"Alert__CloseTrigger\"\n          data-testid={`${dataTestId}-close-trigger`}\n          iconName={closeButtonIcon}\n          size=\"xs\"\n          variant=\"ghostNeutral\"\n          onContrast={onContrast}\n          onClick={onClose}\n        />\n      )}\n    </CAlert.Root>\n  );\n};\n"],"names":["AlertStatusProvider","useAlertStatusContext","createContext","withProvider","withContext","useAlertStyles","createSlotRecipeContext","AlertRoot","element","props","jsx","AlertTitle","AlertDescription","AlertContent","iconMap","InfoIcon","WarningIcon","CheckCircleIcon","AlertIndicator","forwardRef","ref","api","styles","Icon","Fragment","children","rest","chakra","AlertButton","buttonPosition","buttonText","status","dataTestId","Flex","Button","Alert","buttonProps","description","descriptionProps","hideCloseButton","hideIcon","iconProps","onClose","onContrast","title","titleProps","closeButtonIcon","isTopRightButton","WithButtonWrapper","React","jsxs","CAlert.Root","CAlert.Indicator","StatusTypographyMap","StatusIconMap","CAlert.Content","CAlert.Title","Heading","CAlert.Description","Text"],"mappings":";;;;;;;;;;;;AASA,MAAM,CAACA,GAAqBC,CAAqB,IAAIC,EAAc;AAAA,EACjE,MAAM;AAAA,EACN,UAAU;AAAA,EACV,cAAc;AAChB,CAAC,GACK;AAAA,EACJ,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAWC;AAEb,IAAIC,EAAwB,EAAE,KAAK,QAAO,CAAE,GACtCC,IAAYJ;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,IACE,gBAAgB;AAAA,IAChB,YAAYK,GAASC,GAAO;AAC1B;AAAA;AAAA,QAEkBC,gBAAAA,EAAAA,IAAIV,GAAqB,EAAE,OAAO,EAAE,QAAQS,EAAM,UAAU,OAAM,GAAI,UAAUD,EAAS,CAAA;AAAA;AAAA,IAEjH;AAAA,EACA;AACA,GAEMG,IAAaP;AAAA,EACjB;AAAA,EACA;AACF,GACMQ,IAAmBR,EAAY,OAAO,aAAa,GACnDS,IAAeT;AAAA,EACnB;AAAA,EACA;AACF,GACMU,IAAU;AAAA,EACd,MAAMC;AAAA,EACN,SAASC;AAAA,EACT,SAASC;AAAA,EACT,OAAOD;AAAA,EACP,SAASD;AACX,GACMG,IAAiBC;AAAA,EACrB,SAAyBV,GAAOW,GAAK;AACnC,UAAMC,IAAMpB,EAAuB,GAC7BqB,IAASjB,EAAgB,GACzBkB,IAAO,OAAOF,EAAI,UAAW,WAAWP,EAAQO,EAAI,MAAM,IAAIG,GAC9D,EAAE,UAAAC,IAA2Bf,gBAAAA,MAAIa,GAAM,CAAA,CAAE,GAAG,GAAGG,EAAI,IAAKjB;AAC9D,WAAuBC,gBAAAA,EAAG,IAACiB,EAAO,MAAM,EAAE,KAAAP,GAAK,GAAGM,GAAM,KAAK,CAACJ,EAAO,WAAWb,EAAM,GAAG,GAAG,UAAAgB,EAAQ,CAAE;AAAA,EAC1G;AACA,GChCaG,IAAc,CAAC;AAAA,EAC1B,gBAAAC,IAAiB;AAAA,EACjB,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,CAAC,gBAAgBC,IAAa;AAAA,EAC9B,GAAGN;AACL,MAEIhB,gBAAAA,EAAA;AAAA,EAACuB;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,eAAaD;AAAA,IACZ,GAAIH,MAAmB,cAAc,EAAE,IAAI,GAAG,IAAI,EAAE;AAAA,IACpD,GAAIA,MAAmB,iBAAiB,EAAE,gBAAgB,WAAW;AAAA,IAEtE,UAACnB,gBAAAA,EAAA,IAAAwB,GAAA,EAAO,MAAK,MAAK,SAASH,MAAW,YAAY,YAAY,aAAa,GAAE,eAAe,GAAGL,GAC5F,UACHI,EAAA,CAAA;AAAA,EAAA;AACF,GCYSK,KAAQ,CAAC;AAAA,EACpB,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,UAAAC,IAAW;AAAA,EACX,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,QAAAZ,IAAS;AAAA,EACT,OAAAa;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,CAAC,gBAAgBd,IAAa;AAAA,EAC9B,GAAGN;AACL,MAAqC;AAC/B,EAAAU,KAAe,CAACA,EAAY,mBAC9BA,EAAY,iBAAiB;AAEzB,QAAAW,IAAmBX,KAAeA,EAAY,mBAAmB,YACjEY,IAAoBD,IAAmBd,IAAOgB,EAAM;AAGxD,SAAAC,gBAAAA,EAAA;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAanB;AAAA,MACZ,GAAGN;AAAA,MACJ,SAASK;AAAA,MACT,UAAAS;AAAA,MACA,YAAAG;AAAA,MAEC,UAAA;AAAA,QAAC,CAAAH,KACC9B,gBAAAA,EAAAA,IAAA0C,GAAA,EAAiB,WAAU,eAAc,eAAa,GAAGpB,CAAU,SAClE,UAAAtB,gBAAAA,EAAA;AAAA,UAACa;AAAA,UAAA;AAAA,YACC,SAASoB,IAAa,eAAeU,EAAoBtB,CAAM;AAAA,YAC/D,MAAMU,GAAW,QAAQa,EAAcvB,CAAM;AAAA,YAC7C,MAAK;AAAA,YACJ,GAAGU;AAAA,UAAA;AAAA,QAAA,GAER;AAAA,QAEFS,gBAAAA,OAACK,GAAA,EAAe,WAAU,kBAAiB,eAAa,GAAGvB,CAAU,YAClE,UAAA;AAAA,UACCY,KAAAM,gBAAAA,EAAA;AAAA,YAACF;AAAA,YAAA;AAAA,cACE,GAAID,KAAoB;AAAA,gBACvB,gBAAgB;AAAA,gBAChB,KAAK;AAAA,cACP;AAAA,cAEA,UAAA;AAAA,gBAACrC,gBAAAA,EAAAA,IAAA8C,GAAA,EAAa,WAAU,gBAAe,eAAa,GAAGxB,CAAU,UAC/D,UAAAtB,gBAAAA,EAAAA,IAAC+C,KAAQ,MAAK,MAAK,SAASd,IAAa,eAAe,WAAY,GAAGE,GACpE,aACH,EACF,CAAA;AAAA,gBACCT,KAAeA,EAAY,mBAAmB,oCAC5CR,GAAY,EAAA,QAAAG,GAAgB,YAAAY,GAAyB,GAAGP,EAAa,CAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UAE1E;AAAA,UAEDC,4BACEW,GAAmB,EAAA,GAAID,KAAoB,EAAE,gBAAgB,gBAC5D,GAAA,UAAA;AAAA,YAACrC,gBAAAA,EAAAA,IAAAgD,GAAA,EAAmB,WAAU,sBAAqB,eAAa,GAAG1B,CAAU,gBAC1E,UAAA,OAAOK,KAAgB,iCACrBsB,GAAK,EAAA,MAAK,MAAK,SAAShB,IAAa,eAAe,WAAY,GAAGL,GACjE,UACHD,EAAA,CAAA,IAEAA,EAEJ,CAAA;AAAA,YACCD,KAAeA,EAAY,mBAAmB,cAAc,CAACQ,KAC5DlC,gBAAAA,MAACkB,GAAY,EAAA,QAAAG,GAAgB,YAAAY,GAAyB,GAAGP,EAAa,CAAA;AAAA,UAAA,GAE1E;AAAA,UAEDA,KAAeA,GAAa,mBAAmB,oCAC7CR,GAAY,EAAA,QAAAG,GAAgB,YAAAY,GAAyB,GAAGP,EAAa,CAAA;AAAA,QAAA,GAE1E;AAAA,QACC,CAACG,KACA7B,gBAAAA,EAAA;AAAA,UAACwB;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAa,GAAGF,CAAU;AAAA,YAC1B,UAAUc;AAAA,YACV,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,YAAAH;AAAA,YACA,SAASD;AAAA,UAAA;AAAA,QAAA;AAAA,MACX;AAAA,IAAA;AAAA,EAEJ;AAEJ;","x_google_ignoreList":[0]}

package/dist/chunks/{avatarGroup.component-BPhQpVYM.js → avatarGroup.component-CUHMxiIc.js}

@@ -1,8 +1,8 @@
 import { j as e } from "./jsx-runtime-C5mzlN2N.js";
 import { useMemo as i, useState as l, createElement as k } from "react";
 import { a as M, A as p } from "./avatar.component-BL6D6Lw_.js";
-import { M as N } from "./menu.component-WHzMw5ZI.js";
-import { W as R } from "./text.component-DhuUgP3j.js";
+import { M as N } from "./menu.component-CAttpI-a.js";
+import { W as R } from "./text.component-C9jh_JMO.js";
 import { B as G } from "./button.component-BO6oee_V.js";
 import { T as O } from "./tooltip.component-CHohp2qn.js";
 import { B as W } from "./index-9BerxEcw.js";
@@ -72,4 +72,4 @@ const X = ({
 export {
   X as A
 };
-//# sourceMappingURL=avatarGroup.component-BPhQpVYM.js.map
+//# sourceMappingURL=avatarGroup.component-CUHMxiIc.js.map

package/dist/chunks/{avatarGroup.component-BPhQpVYM.js.map → avatarGroup.component-CUHMxiIc.js.map}

@@ -1 +1 @@
-{"version":3,"file":"avatarGroup.component-BPhQpVYM.js","sources":["../../src/components/AvatarGroup/avatarGroup.component.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { AvatarGroup as CAvatarGroup, AvatarGroupProps as CAvatarGroupProps } from '@chakra-ui/react/avatar';\nimport { Avatar, AvatarProps } from 'components/Avatar/avatar.component';\nimport { AvatarSize, AvatarVariant } from 'components/Avatar/avatar.types';\nimport { Menu, MenuProps } from 'components/Menu';\nimport { Text } from 'components/Text/text.component';\nimport { Button, ButtonProps } from 'components/Button';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\nimport { Box } from '@chakra-ui/react/box';\n\nexport interface AvatarGroupProps extends CAvatarGroupProps {\n  /** Tooltip text for when the add button is hovered. */\n  addButtonTooltipText?: string;\n  /** Array of avatars to display in the group. */\n  avatars: AvatarProps[];\n  /** Maximum number of avatars to display before it shows a counter instead. */\n  max?: number;\n  /** Callback function when the add button is clicked. */\n  onAdd?: () => void;\n  /** Callback function when the remove button is clicked. */\n  onRemove?: (value?: string) => void;\n  /** If true, an add button will be displayed at the end of the avatar group.\n   * @default true\n   */\n  showAddButton?: boolean;\n  /** If true, a remove button will be displayed when hovering over an avatar.\n   * @default false\n   */\n  showRemoveAvatarButton?: boolean;\n  /** Size of the avatars in the group.\n   * @default md\n   */\n  size?: AvatarSize;\n  /** Variant of the avatars in the group.\n   * @default default\n   */\n  variant?: AvatarVariant;\n  /** Props to customize the add button Menu. See `Menu` for more information. */\n  menuProps?: Omit<MenuProps, 'buttonProps'>;\n  /** Data test id for the avatar group.\n   * @default kibble-avatar-group\n   */\n  'data-testid'?: string;\n}\n\nexport const AvatarGroup = ({\n  avatars,\n  max = 3,\n  onAdd,\n  onRemove,\n  showAddButton = true,\n  showRemoveAvatarButton = false,\n  size = 'md',\n  variant = 'default',\n  menuProps,\n  addButtonTooltipText,\n  ['data-testid']: dataTestId = 'kibble-avatar-group',\n  ...rest\n}: AvatarGroupProps): React.JSX.Element => {\n  const mergedNames = useMemo(() => avatars.map((avatar) => avatar.name).join(', '), [avatars]);\n  const spacing = size === 'xs' || size === 'sm' ? -1 : -2;\n  const [hideTooltip, setHideTooltip] = useState(false);\n  const [menuOpen, setMenuOpen] = useState(false);\n\n  const buttonProps: ButtonProps = useMemo(() => {\n    return {\n      size: size === 'xl' ? 'lg' : size,\n      variant: 'ghostNeutral',\n      borderRadius: 'full',\n      borderWidth: '1px',\n      iconName: 'plus',\n      borderColor: 'border',\n    };\n  }, [size]);\n\n  return (\n    <CAvatarGroup\n      className=\"AvatarGroup\"\n      data-testid={dataTestId}\n      gap={0}\n      spaceX={spacing}\n      stacking=\"first-on-top\"\n      size={size}\n      {...rest}\n    >\n      {avatars.length > max ? (\n        <Avatar size={size} variant=\"contrast\" showRemoveButton={false} tooltipProps={{ label: mergedNames }}>\n          <Text size={size === 'xs' || size === 'sm' ? 'xs' : 'sm'} variant=\"onContrast\">\n            {avatars.length.toString()}\n          </Text>\n        </Avatar>\n      ) : (\n        avatars.map((avatar) => (\n          <Avatar\n            {...avatar}\n            key={avatar.name}\n            size={size}\n            variant={variant || avatar.variant}\n            showRemoveButton={showRemoveAvatarButton}\n            onRemove={onRemove}\n          />\n        ))\n      )}\n      {showAddButton && (\n        <Tooltip disabled={!addButtonTooltipText?.length || hideTooltip} label={addButtonTooltipText || ''}>\n          {menuProps ? (\n            <Box>\n              <Menu\n                open={menuOpen}\n                data-testid={`${dataTestId}-add-button`}\n                {...menuProps}\n                onOpenChange={({ open }) => {\n                  setHideTooltip(open);\n                  setMenuOpen(open);\n                }}\n                buttonProps={{\n                  ...buttonProps,\n                  hideCaret: true,\n                }}\n              />\n            </Box>\n          ) : (\n            <Button {...buttonProps} onClick={onAdd} />\n          )}\n        </Tooltip>\n      )}\n    </CAvatarGroup>\n  );\n};\n"],"names":["AvatarGroup","avatars","max","onAdd","onRemove","showAddButton","showRemoveAvatarButton","size","variant","menuProps","addButtonTooltipText","dataTestId","rest","mergedNames","useMemo","avatar","spacing","hideTooltip","setHideTooltip","useState","menuOpen","setMenuOpen","buttonProps","jsxs","CAvatarGroup","jsx","Avatar","Text","createElement","Tooltip","Box","Menu","open","Button"],"mappings":";;;;;;;;AA6CO,MAAMA,IAAc,CAAC;AAAA,EAC1B,SAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,wBAAAC,IAAyB;AAAA,EACzB,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,CAAC,gBAAgBC,IAAa;AAAA,EAC9B,GAAGC;AACL,MAA2C;AACzC,QAAMC,IAAcC,EAAQ,MAAMb,EAAQ,IAAI,CAACc,MAAWA,EAAO,IAAI,EAAE,KAAK,IAAI,GAAG,CAACd,CAAO,CAAC,GACtFe,IAAUT,MAAS,QAAQA,MAAS,OAAO,KAAK,IAChD,CAACU,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9C,CAACC,GAAUC,CAAW,IAAIF,EAAS,EAAK,GAExCG,IAA2BR,EAAQ,OAChC;AAAA,IACL,MAAMP,MAAS,OAAO,OAAOA;AAAA,IAC7B,SAAS;AAAA,IACT,cAAc;AAAA,IACd,aAAa;AAAA,IACb,UAAU;AAAA,IACV,aAAa;AAAA,EACf,IACC,CAACA,CAAI,CAAC;AAGP,SAAAgB,gBAAAA,EAAA;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAab;AAAA,MACb,KAAK;AAAA,MACL,QAAQK;AAAA,MACR,UAAS;AAAA,MACT,MAAAT;AAAA,MACC,GAAGK;AAAA,MAEH,UAAA;AAAA,QAAAX,EAAQ,SAASC,IACfuB,gBAAAA,EAAAA,IAAAC,GAAA,EAAO,MAAAnB,GAAY,SAAQ,YAAW,kBAAkB,IAAO,cAAc,EAAE,OAAOM,EAAY,GACjG,gCAACc,GAAK,EAAA,MAAMpB,MAAS,QAAQA,MAAS,OAAO,OAAO,MAAM,SAAQ,cAC/D,UAAAN,EAAQ,OAAO,YAClB,EACF,CAAA,IAEAA,EAAQ,IAAI,CAACc,MACX,gBAAAa;AAAA,UAACF;AAAA,UAAA;AAAA,YACE,GAAGX;AAAA,YACJ,KAAKA,EAAO;AAAA,YACZ,MAAAR;AAAA,YACA,SAASC,KAAWO,EAAO;AAAA,YAC3B,kBAAkBT;AAAA,YAClB,UAAAF;AAAA,UAAA;AAAA,QAAA,CAEH;AAAA,QAEFC,KACCoB,gBAAAA,EAAA,IAACI,GAAQ,EAAA,UAAU,CAACnB,GAAsB,UAAUO,GAAa,OAAOP,KAAwB,IAC7F,UAAAD,0BACEqB,GACC,EAAA,UAAAL,gBAAAA,EAAA;AAAA,UAACM;AAAA,UAAA;AAAA,YACC,MAAMX;AAAA,YACN,eAAa,GAAGT,CAAU;AAAA,YACzB,GAAGF;AAAA,YACJ,cAAc,CAAC,EAAE,MAAAuB,QAAW;AAC1B,cAAAd,EAAec,CAAI,GACnBX,EAAYW,CAAI;AAAA,YAClB;AAAA,YACA,aAAa;AAAA,cACX,GAAGV;AAAA,cACH,WAAW;AAAA,YAAA;AAAA,UACb;AAAA,QAAA,GAEJ,IAECG,gBAAAA,EAAA,IAAAQ,GAAA,EAAQ,GAAGX,GAAa,SAASnB,GAAO,EAE7C,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ;AAEJ;"}
+{"version":3,"file":"avatarGroup.component-CUHMxiIc.js","sources":["../../src/components/AvatarGroup/avatarGroup.component.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { AvatarGroup as CAvatarGroup, AvatarGroupProps as CAvatarGroupProps } from '@chakra-ui/react/avatar';\nimport { Avatar, AvatarProps } from 'components/Avatar/avatar.component';\nimport { AvatarSize, AvatarVariant } from 'components/Avatar/avatar.types';\nimport { Menu, MenuProps } from 'components/Menu';\nimport { Text } from 'components/Text/text.component';\nimport { Button, ButtonProps } from 'components/Button';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\nimport { Box } from '@chakra-ui/react/box';\n\nexport interface AvatarGroupProps extends CAvatarGroupProps {\n  /** Tooltip text for when the add button is hovered. */\n  addButtonTooltipText?: string;\n  /** Array of avatars to display in the group. */\n  avatars: AvatarProps[];\n  /** Maximum number of avatars to display before it shows a counter instead. */\n  max?: number;\n  /** Callback function when the add button is clicked. */\n  onAdd?: () => void;\n  /** Callback function when the remove button is clicked. */\n  onRemove?: (value?: string) => void;\n  /** If true, an add button will be displayed at the end of the avatar group.\n   * @default true\n   */\n  showAddButton?: boolean;\n  /** If true, a remove button will be displayed when hovering over an avatar.\n   * @default false\n   */\n  showRemoveAvatarButton?: boolean;\n  /** Size of the avatars in the group.\n   * @default md\n   */\n  size?: AvatarSize;\n  /** Variant of the avatars in the group.\n   * @default default\n   */\n  variant?: AvatarVariant;\n  /** Props to customize the add button Menu. See `Menu` for more information. */\n  menuProps?: Omit<MenuProps, 'buttonProps'>;\n  /** Data test id for the avatar group.\n   * @default kibble-avatar-group\n   */\n  'data-testid'?: string;\n}\n\nexport const AvatarGroup = ({\n  avatars,\n  max = 3,\n  onAdd,\n  onRemove,\n  showAddButton = true,\n  showRemoveAvatarButton = false,\n  size = 'md',\n  variant = 'default',\n  menuProps,\n  addButtonTooltipText,\n  ['data-testid']: dataTestId = 'kibble-avatar-group',\n  ...rest\n}: AvatarGroupProps): React.JSX.Element => {\n  const mergedNames = useMemo(() => avatars.map((avatar) => avatar.name).join(', '), [avatars]);\n  const spacing = size === 'xs' || size === 'sm' ? -1 : -2;\n  const [hideTooltip, setHideTooltip] = useState(false);\n  const [menuOpen, setMenuOpen] = useState(false);\n\n  const buttonProps: ButtonProps = useMemo(() => {\n    return {\n      size: size === 'xl' ? 'lg' : size,\n      variant: 'ghostNeutral',\n      borderRadius: 'full',\n      borderWidth: '1px',\n      iconName: 'plus',\n      borderColor: 'border',\n    };\n  }, [size]);\n\n  return (\n    <CAvatarGroup\n      className=\"AvatarGroup\"\n      data-testid={dataTestId}\n      gap={0}\n      spaceX={spacing}\n      stacking=\"first-on-top\"\n      size={size}\n      {...rest}\n    >\n      {avatars.length > max ? (\n        <Avatar size={size} variant=\"contrast\" showRemoveButton={false} tooltipProps={{ label: mergedNames }}>\n          <Text size={size === 'xs' || size === 'sm' ? 'xs' : 'sm'} variant=\"onContrast\">\n            {avatars.length.toString()}\n          </Text>\n        </Avatar>\n      ) : (\n        avatars.map((avatar) => (\n          <Avatar\n            {...avatar}\n            key={avatar.name}\n            size={size}\n            variant={variant || avatar.variant}\n            showRemoveButton={showRemoveAvatarButton}\n            onRemove={onRemove}\n          />\n        ))\n      )}\n      {showAddButton && (\n        <Tooltip disabled={!addButtonTooltipText?.length || hideTooltip} label={addButtonTooltipText || ''}>\n          {menuProps ? (\n            <Box>\n              <Menu\n                open={menuOpen}\n                data-testid={`${dataTestId}-add-button`}\n                {...menuProps}\n                onOpenChange={({ open }) => {\n                  setHideTooltip(open);\n                  setMenuOpen(open);\n                }}\n                buttonProps={{\n                  ...buttonProps,\n                  hideCaret: true,\n                }}\n              />\n            </Box>\n          ) : (\n            <Button {...buttonProps} onClick={onAdd} />\n          )}\n        </Tooltip>\n      )}\n    </CAvatarGroup>\n  );\n};\n"],"names":["AvatarGroup","avatars","max","onAdd","onRemove","showAddButton","showRemoveAvatarButton","size","variant","menuProps","addButtonTooltipText","dataTestId","rest","mergedNames","useMemo","avatar","spacing","hideTooltip","setHideTooltip","useState","menuOpen","setMenuOpen","buttonProps","jsxs","CAvatarGroup","jsx","Avatar","Text","createElement","Tooltip","Box","Menu","open","Button"],"mappings":";;;;;;;;AA6CO,MAAMA,IAAc,CAAC;AAAA,EAC1B,SAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,wBAAAC,IAAyB;AAAA,EACzB,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,CAAC,gBAAgBC,IAAa;AAAA,EAC9B,GAAGC;AACL,MAA2C;AACzC,QAAMC,IAAcC,EAAQ,MAAMb,EAAQ,IAAI,CAACc,MAAWA,EAAO,IAAI,EAAE,KAAK,IAAI,GAAG,CAACd,CAAO,CAAC,GACtFe,IAAUT,MAAS,QAAQA,MAAS,OAAO,KAAK,IAChD,CAACU,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9C,CAACC,GAAUC,CAAW,IAAIF,EAAS,EAAK,GAExCG,IAA2BR,EAAQ,OAChC;AAAA,IACL,MAAMP,MAAS,OAAO,OAAOA;AAAA,IAC7B,SAAS;AAAA,IACT,cAAc;AAAA,IACd,aAAa;AAAA,IACb,UAAU;AAAA,IACV,aAAa;AAAA,EACf,IACC,CAACA,CAAI,CAAC;AAGP,SAAAgB,gBAAAA,EAAA;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAab;AAAA,MACb,KAAK;AAAA,MACL,QAAQK;AAAA,MACR,UAAS;AAAA,MACT,MAAAT;AAAA,MACC,GAAGK;AAAA,MAEH,UAAA;AAAA,QAAAX,EAAQ,SAASC,IACfuB,gBAAAA,EAAAA,IAAAC,GAAA,EAAO,MAAAnB,GAAY,SAAQ,YAAW,kBAAkB,IAAO,cAAc,EAAE,OAAOM,EAAY,GACjG,gCAACc,GAAK,EAAA,MAAMpB,MAAS,QAAQA,MAAS,OAAO,OAAO,MAAM,SAAQ,cAC/D,UAAAN,EAAQ,OAAO,YAClB,EACF,CAAA,IAEAA,EAAQ,IAAI,CAACc,MACX,gBAAAa;AAAA,UAACF;AAAA,UAAA;AAAA,YACE,GAAGX;AAAA,YACJ,KAAKA,EAAO;AAAA,YACZ,MAAAR;AAAA,YACA,SAASC,KAAWO,EAAO;AAAA,YAC3B,kBAAkBT;AAAA,YAClB,UAAAF;AAAA,UAAA;AAAA,QAAA,CAEH;AAAA,QAEFC,KACCoB,gBAAAA,EAAA,IAACI,GAAQ,EAAA,UAAU,CAACnB,GAAsB,UAAUO,GAAa,OAAOP,KAAwB,IAC7F,UAAAD,0BACEqB,GACC,EAAA,UAAAL,gBAAAA,EAAA;AAAA,UAACM;AAAA,UAAA;AAAA,YACC,MAAMX;AAAA,YACN,eAAa,GAAGT,CAAU;AAAA,YACzB,GAAGF;AAAA,YACJ,cAAc,CAAC,EAAE,MAAAuB,QAAW;AAC1B,cAAAd,EAAec,CAAI,GACnBX,EAAYW,CAAI;AAAA,YAClB;AAAA,YACA,aAAa;AAAA,cACX,GAAGV;AAAA,cACH,WAAW;AAAA,YAAA;AAAA,UACb;AAAA,QAAA,GAEJ,IAECG,gBAAAA,EAAA,IAAAQ,GAAA,EAAQ,GAAGX,GAAa,SAASnB,GAAO,EAE7C,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ;AAEJ;"}

package/dist/chunks/{avatarGroup.component-CJCQSIyr.js → avatarGroup.component-ClqXmemB.js}

@@ -1,2 +1,2 @@
-"use strict";const o=require("./jsx-runtime-BjDatQAs.js"),r=require("react"),s=require("./avatar.component-BGgZoVJS.js"),f=require("./menu.component-D2V9Q1Y5.js"),A=require("./text.component-BDDz5KQP.js"),C=require("./button.component-DjdgBXDC.js"),_=require("./tooltip.component-DBw-hAPU.js"),k=require("./index-BQRnVsAg.js"),G=({avatars:n,max:c=3,onAdd:l,onRemove:m,showAddButton:x=!0,showRemoveAvatarButton:d=!1,size:t="md",variant:j="default",menuProps:a,addButtonTooltipText:u,["data-testid"]:i="kibble-avatar-group",...h})=>{const b=r.useMemo(()=>n.map(e=>e.name).join(", "),[n]),g=t==="xs"||t==="sm"?-1:-2,[R,v]=r.useState(!1),[q,E]=r.useState(!1),p=r.useMemo(()=>({size:t==="xl"?"lg":t,variant:"ghostNeutral",borderRadius:"full",borderWidth:"1px",iconName:"plus",borderColor:"border"}),[t]);return o.jsxRuntimeExports.jsxs(s.AvatarGroup,{className:"AvatarGroup","data-testid":i,gap:0,spaceX:g,stacking:"first-on-top",size:t,...h,children:[n.length>c?o.jsxRuntimeExports.jsx(s.Avatar,{size:t,variant:"contrast",showRemoveButton:!1,tooltipProps:{label:b},children:o.jsxRuntimeExports.jsx(A.WrappedText,{size:t==="xs"||t==="sm"?"xs":"sm",variant:"onContrast",children:n.length.toString()})}):n.map(e=>r.createElement(s.Avatar,{...e,key:e.name,size:t,variant:j||e.variant,showRemoveButton:d,onRemove:m})),x&&o.jsxRuntimeExports.jsx(_.Tooltip,{disabled:!u?.length||R,label:u||"",children:a?o.jsxRuntimeExports.jsx(k.Box,{children:o.jsxRuntimeExports.jsx(f.Menu,{open:q,"data-testid":`${i}-add-button`,...a,onOpenChange:({open:e})=>{v(e),E(e)},buttonProps:{...p,hideCaret:!0}})}):o.jsxRuntimeExports.jsx(C.Button,{...p,onClick:l})})]})};exports.AvatarGroup=G;
-//# sourceMappingURL=avatarGroup.component-CJCQSIyr.js.map
+"use strict";const o=require("./jsx-runtime-BjDatQAs.js"),r=require("react"),s=require("./avatar.component-BGgZoVJS.js"),f=require("./menu.component-B_rE1WZ2.js"),A=require("./text.component-D5GpbfNx.js"),C=require("./button.component-DjdgBXDC.js"),_=require("./tooltip.component-DBw-hAPU.js"),k=require("./index-BQRnVsAg.js"),G=({avatars:n,max:c=3,onAdd:l,onRemove:m,showAddButton:x=!0,showRemoveAvatarButton:d=!1,size:t="md",variant:j="default",menuProps:a,addButtonTooltipText:u,["data-testid"]:i="kibble-avatar-group",...h})=>{const b=r.useMemo(()=>n.map(e=>e.name).join(", "),[n]),g=t==="xs"||t==="sm"?-1:-2,[R,v]=r.useState(!1),[q,E]=r.useState(!1),p=r.useMemo(()=>({size:t==="xl"?"lg":t,variant:"ghostNeutral",borderRadius:"full",borderWidth:"1px",iconName:"plus",borderColor:"border"}),[t]);return o.jsxRuntimeExports.jsxs(s.AvatarGroup,{className:"AvatarGroup","data-testid":i,gap:0,spaceX:g,stacking:"first-on-top",size:t,...h,children:[n.length>c?o.jsxRuntimeExports.jsx(s.Avatar,{size:t,variant:"contrast",showRemoveButton:!1,tooltipProps:{label:b},children:o.jsxRuntimeExports.jsx(A.WrappedText,{size:t==="xs"||t==="sm"?"xs":"sm",variant:"onContrast",children:n.length.toString()})}):n.map(e=>r.createElement(s.Avatar,{...e,key:e.name,size:t,variant:j||e.variant,showRemoveButton:d,onRemove:m})),x&&o.jsxRuntimeExports.jsx(_.Tooltip,{disabled:!u?.length||R,label:u||"",children:a?o.jsxRuntimeExports.jsx(k.Box,{children:o.jsxRuntimeExports.jsx(f.Menu,{open:q,"data-testid":`${i}-add-button`,...a,onOpenChange:({open:e})=>{v(e),E(e)},buttonProps:{...p,hideCaret:!0}})}):o.jsxRuntimeExports.jsx(C.Button,{...p,onClick:l})})]})};exports.AvatarGroup=G;
+//# sourceMappingURL=avatarGroup.component-ClqXmemB.js.map

package/dist/chunks/{avatarGroup.component-CJCQSIyr.js.map → avatarGroup.component-ClqXmemB.js.map}

@@ -1 +1 @@
-{"version":3,"file":"avatarGroup.component-CJCQSIyr.js","sources":["../../src/components/AvatarGroup/avatarGroup.component.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { AvatarGroup as CAvatarGroup, AvatarGroupProps as CAvatarGroupProps } from '@chakra-ui/react/avatar';\nimport { Avatar, AvatarProps } from 'components/Avatar/avatar.component';\nimport { AvatarSize, AvatarVariant } from 'components/Avatar/avatar.types';\nimport { Menu, MenuProps } from 'components/Menu';\nimport { Text } from 'components/Text/text.component';\nimport { Button, ButtonProps } from 'components/Button';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\nimport { Box } from '@chakra-ui/react/box';\n\nexport interface AvatarGroupProps extends CAvatarGroupProps {\n  /** Tooltip text for when the add button is hovered. */\n  addButtonTooltipText?: string;\n  /** Array of avatars to display in the group. */\n  avatars: AvatarProps[];\n  /** Maximum number of avatars to display before it shows a counter instead. */\n  max?: number;\n  /** Callback function when the add button is clicked. */\n  onAdd?: () => void;\n  /** Callback function when the remove button is clicked. */\n  onRemove?: (value?: string) => void;\n  /** If true, an add button will be displayed at the end of the avatar group.\n   * @default true\n   */\n  showAddButton?: boolean;\n  /** If true, a remove button will be displayed when hovering over an avatar.\n   * @default false\n   */\n  showRemoveAvatarButton?: boolean;\n  /** Size of the avatars in the group.\n   * @default md\n   */\n  size?: AvatarSize;\n  /** Variant of the avatars in the group.\n   * @default default\n   */\n  variant?: AvatarVariant;\n  /** Props to customize the add button Menu. See `Menu` for more information. */\n  menuProps?: Omit<MenuProps, 'buttonProps'>;\n  /** Data test id for the avatar group.\n   * @default kibble-avatar-group\n   */\n  'data-testid'?: string;\n}\n\nexport const AvatarGroup = ({\n  avatars,\n  max = 3,\n  onAdd,\n  onRemove,\n  showAddButton = true,\n  showRemoveAvatarButton = false,\n  size = 'md',\n  variant = 'default',\n  menuProps,\n  addButtonTooltipText,\n  ['data-testid']: dataTestId = 'kibble-avatar-group',\n  ...rest\n}: AvatarGroupProps): React.JSX.Element => {\n  const mergedNames = useMemo(() => avatars.map((avatar) => avatar.name).join(', '), [avatars]);\n  const spacing = size === 'xs' || size === 'sm' ? -1 : -2;\n  const [hideTooltip, setHideTooltip] = useState(false);\n  const [menuOpen, setMenuOpen] = useState(false);\n\n  const buttonProps: ButtonProps = useMemo(() => {\n    return {\n      size: size === 'xl' ? 'lg' : size,\n      variant: 'ghostNeutral',\n      borderRadius: 'full',\n      borderWidth: '1px',\n      iconName: 'plus',\n      borderColor: 'border',\n    };\n  }, [size]);\n\n  return (\n    <CAvatarGroup\n      className=\"AvatarGroup\"\n      data-testid={dataTestId}\n      gap={0}\n      spaceX={spacing}\n      stacking=\"first-on-top\"\n      size={size}\n      {...rest}\n    >\n      {avatars.length > max ? (\n        <Avatar size={size} variant=\"contrast\" showRemoveButton={false} tooltipProps={{ label: mergedNames }}>\n          <Text size={size === 'xs' || size === 'sm' ? 'xs' : 'sm'} variant=\"onContrast\">\n            {avatars.length.toString()}\n          </Text>\n        </Avatar>\n      ) : (\n        avatars.map((avatar) => (\n          <Avatar\n            {...avatar}\n            key={avatar.name}\n            size={size}\n            variant={variant || avatar.variant}\n            showRemoveButton={showRemoveAvatarButton}\n            onRemove={onRemove}\n          />\n        ))\n      )}\n      {showAddButton && (\n        <Tooltip disabled={!addButtonTooltipText?.length || hideTooltip} label={addButtonTooltipText || ''}>\n          {menuProps ? (\n            <Box>\n              <Menu\n                open={menuOpen}\n                data-testid={`${dataTestId}-add-button`}\n                {...menuProps}\n                onOpenChange={({ open }) => {\n                  setHideTooltip(open);\n                  setMenuOpen(open);\n                }}\n                buttonProps={{\n                  ...buttonProps,\n                  hideCaret: true,\n                }}\n              />\n            </Box>\n          ) : (\n            <Button {...buttonProps} onClick={onAdd} />\n          )}\n        </Tooltip>\n      )}\n    </CAvatarGroup>\n  );\n};\n"],"names":["AvatarGroup","avatars","max","onAdd","onRemove","showAddButton","showRemoveAvatarButton","size","variant","menuProps","addButtonTooltipText","dataTestId","rest","mergedNames","useMemo","avatar","spacing","hideTooltip","setHideTooltip","useState","menuOpen","setMenuOpen","buttonProps","jsxs","CAvatarGroup","jsx","Avatar","Text","createElement","Tooltip","Box","Menu","open","Button"],"mappings":"uUA6CaA,EAAc,CAAC,CAC1B,QAAAC,EACA,IAAAC,EAAM,EACN,MAAAC,EACA,SAAAC,EACA,cAAAC,EAAgB,GAChB,uBAAAC,EAAyB,GACzB,KAAAC,EAAO,KACP,QAAAC,EAAU,UACV,UAAAC,EACA,qBAAAC,EACA,CAAC,eAAgBC,EAAa,sBAC9B,GAAGC,CACL,IAA2C,CACzC,MAAMC,EAAcC,EAAA,QAAQ,IAAMb,EAAQ,IAAKc,GAAWA,EAAO,IAAI,EAAE,KAAK,IAAI,EAAG,CAACd,CAAO,CAAC,EACtFe,EAAUT,IAAS,MAAQA,IAAS,KAAO,GAAK,GAChD,CAACU,EAAaC,CAAc,EAAIC,EAAAA,SAAS,EAAK,EAC9C,CAACC,EAAUC,CAAW,EAAIF,EAAAA,SAAS,EAAK,EAExCG,EAA2BR,EAAAA,QAAQ,KAChC,CACL,KAAMP,IAAS,KAAO,KAAOA,EAC7B,QAAS,eACT,aAAc,OACd,YAAa,MACb,SAAU,OACV,YAAa,QACf,GACC,CAACA,CAAI,CAAC,EAGP,OAAAgB,EAAA,kBAAA,KAACC,EAAA,YAAA,CACC,UAAU,cACV,cAAab,EACb,IAAK,EACL,OAAQK,EACR,SAAS,eACT,KAAAT,EACC,GAAGK,EAEH,SAAA,CAAAX,EAAQ,OAASC,EACfuB,EAAAA,kBAAAA,IAAAC,EAAAA,OAAA,CAAO,KAAAnB,EAAY,QAAQ,WAAW,iBAAkB,GAAO,aAAc,CAAE,MAAOM,CAAY,EACjG,iCAACc,EAAAA,YAAK,CAAA,KAAMpB,IAAS,MAAQA,IAAS,KAAO,KAAO,KAAM,QAAQ,aAC/D,SAAAN,EAAQ,OAAO,WAClB,CACF,CAAA,EAEAA,EAAQ,IAAKc,GACXa,EAAA,cAACF,EAAA,OAAA,CACE,GAAGX,EACJ,IAAKA,EAAO,KACZ,KAAAR,EACA,QAASC,GAAWO,EAAO,QAC3B,iBAAkBT,EAClB,SAAAF,CAAA,CAAA,CAEH,EAEFC,GACCoB,EAAA,kBAAA,IAACI,UAAQ,CAAA,SAAU,CAACnB,GAAsB,QAAUO,EAAa,MAAOP,GAAwB,GAC7F,SAAAD,0BACEqB,EACC,IAAA,CAAA,SAAAL,EAAA,kBAAA,IAACM,EAAA,KAAA,CACC,KAAMX,EACN,cAAa,GAAGT,CAAU,cACzB,GAAGF,EACJ,aAAc,CAAC,CAAE,KAAAuB,KAAW,CAC1Bd,EAAec,CAAI,EACnBX,EAAYW,CAAI,CAClB,EACA,YAAa,CACX,GAAGV,EACH,UAAW,EAAA,CACb,CAAA,EAEJ,EAECG,EAAA,kBAAA,IAAAQ,SAAA,CAAQ,GAAGX,EAAa,QAASnB,EAAO,CAE7C,CAAA,CAAA,CAAA,CAEJ,CAEJ"}
+{"version":3,"file":"avatarGroup.component-ClqXmemB.js","sources":["../../src/components/AvatarGroup/avatarGroup.component.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { AvatarGroup as CAvatarGroup, AvatarGroupProps as CAvatarGroupProps } from '@chakra-ui/react/avatar';\nimport { Avatar, AvatarProps } from 'components/Avatar/avatar.component';\nimport { AvatarSize, AvatarVariant } from 'components/Avatar/avatar.types';\nimport { Menu, MenuProps } from 'components/Menu';\nimport { Text } from 'components/Text/text.component';\nimport { Button, ButtonProps } from 'components/Button';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\nimport { Box } from '@chakra-ui/react/box';\n\nexport interface AvatarGroupProps extends CAvatarGroupProps {\n  /** Tooltip text for when the add button is hovered. */\n  addButtonTooltipText?: string;\n  /** Array of avatars to display in the group. */\n  avatars: AvatarProps[];\n  /** Maximum number of avatars to display before it shows a counter instead. */\n  max?: number;\n  /** Callback function when the add button is clicked. */\n  onAdd?: () => void;\n  /** Callback function when the remove button is clicked. */\n  onRemove?: (value?: string) => void;\n  /** If true, an add button will be displayed at the end of the avatar group.\n   * @default true\n   */\n  showAddButton?: boolean;\n  /** If true, a remove button will be displayed when hovering over an avatar.\n   * @default false\n   */\n  showRemoveAvatarButton?: boolean;\n  /** Size of the avatars in the group.\n   * @default md\n   */\n  size?: AvatarSize;\n  /** Variant of the avatars in the group.\n   * @default default\n   */\n  variant?: AvatarVariant;\n  /** Props to customize the add button Menu. See `Menu` for more information. */\n  menuProps?: Omit<MenuProps, 'buttonProps'>;\n  /** Data test id for the avatar group.\n   * @default kibble-avatar-group\n   */\n  'data-testid'?: string;\n}\n\nexport const AvatarGroup = ({\n  avatars,\n  max = 3,\n  onAdd,\n  onRemove,\n  showAddButton = true,\n  showRemoveAvatarButton = false,\n  size = 'md',\n  variant = 'default',\n  menuProps,\n  addButtonTooltipText,\n  ['data-testid']: dataTestId = 'kibble-avatar-group',\n  ...rest\n}: AvatarGroupProps): React.JSX.Element => {\n  const mergedNames = useMemo(() => avatars.map((avatar) => avatar.name).join(', '), [avatars]);\n  const spacing = size === 'xs' || size === 'sm' ? -1 : -2;\n  const [hideTooltip, setHideTooltip] = useState(false);\n  const [menuOpen, setMenuOpen] = useState(false);\n\n  const buttonProps: ButtonProps = useMemo(() => {\n    return {\n      size: size === 'xl' ? 'lg' : size,\n      variant: 'ghostNeutral',\n      borderRadius: 'full',\n      borderWidth: '1px',\n      iconName: 'plus',\n      borderColor: 'border',\n    };\n  }, [size]);\n\n  return (\n    <CAvatarGroup\n      className=\"AvatarGroup\"\n      data-testid={dataTestId}\n      gap={0}\n      spaceX={spacing}\n      stacking=\"first-on-top\"\n      size={size}\n      {...rest}\n    >\n      {avatars.length > max ? (\n        <Avatar size={size} variant=\"contrast\" showRemoveButton={false} tooltipProps={{ label: mergedNames }}>\n          <Text size={size === 'xs' || size === 'sm' ? 'xs' : 'sm'} variant=\"onContrast\">\n            {avatars.length.toString()}\n          </Text>\n        </Avatar>\n      ) : (\n        avatars.map((avatar) => (\n          <Avatar\n            {...avatar}\n            key={avatar.name}\n            size={size}\n            variant={variant || avatar.variant}\n            showRemoveButton={showRemoveAvatarButton}\n            onRemove={onRemove}\n          />\n        ))\n      )}\n      {showAddButton && (\n        <Tooltip disabled={!addButtonTooltipText?.length || hideTooltip} label={addButtonTooltipText || ''}>\n          {menuProps ? (\n            <Box>\n              <Menu\n                open={menuOpen}\n                data-testid={`${dataTestId}-add-button`}\n                {...menuProps}\n                onOpenChange={({ open }) => {\n                  setHideTooltip(open);\n                  setMenuOpen(open);\n                }}\n                buttonProps={{\n                  ...buttonProps,\n                  hideCaret: true,\n                }}\n              />\n            </Box>\n          ) : (\n            <Button {...buttonProps} onClick={onAdd} />\n          )}\n        </Tooltip>\n      )}\n    </CAvatarGroup>\n  );\n};\n"],"names":["AvatarGroup","avatars","max","onAdd","onRemove","showAddButton","showRemoveAvatarButton","size","variant","menuProps","addButtonTooltipText","dataTestId","rest","mergedNames","useMemo","avatar","spacing","hideTooltip","setHideTooltip","useState","menuOpen","setMenuOpen","buttonProps","jsxs","CAvatarGroup","jsx","Avatar","Text","createElement","Tooltip","Box","Menu","open","Button"],"mappings":"uUA6CaA,EAAc,CAAC,CAC1B,QAAAC,EACA,IAAAC,EAAM,EACN,MAAAC,EACA,SAAAC,EACA,cAAAC,EAAgB,GAChB,uBAAAC,EAAyB,GACzB,KAAAC,EAAO,KACP,QAAAC,EAAU,UACV,UAAAC,EACA,qBAAAC,EACA,CAAC,eAAgBC,EAAa,sBAC9B,GAAGC,CACL,IAA2C,CACzC,MAAMC,EAAcC,EAAA,QAAQ,IAAMb,EAAQ,IAAKc,GAAWA,EAAO,IAAI,EAAE,KAAK,IAAI,EAAG,CAACd,CAAO,CAAC,EACtFe,EAAUT,IAAS,MAAQA,IAAS,KAAO,GAAK,GAChD,CAACU,EAAaC,CAAc,EAAIC,EAAAA,SAAS,EAAK,EAC9C,CAACC,EAAUC,CAAW,EAAIF,EAAAA,SAAS,EAAK,EAExCG,EAA2BR,EAAAA,QAAQ,KAChC,CACL,KAAMP,IAAS,KAAO,KAAOA,EAC7B,QAAS,eACT,aAAc,OACd,YAAa,MACb,SAAU,OACV,YAAa,QACf,GACC,CAACA,CAAI,CAAC,EAGP,OAAAgB,EAAA,kBAAA,KAACC,EAAA,YAAA,CACC,UAAU,cACV,cAAab,EACb,IAAK,EACL,OAAQK,EACR,SAAS,eACT,KAAAT,EACC,GAAGK,EAEH,SAAA,CAAAX,EAAQ,OAASC,EACfuB,EAAAA,kBAAAA,IAAAC,EAAAA,OAAA,CAAO,KAAAnB,EAAY,QAAQ,WAAW,iBAAkB,GAAO,aAAc,CAAE,MAAOM,CAAY,EACjG,iCAACc,EAAAA,YAAK,CAAA,KAAMpB,IAAS,MAAQA,IAAS,KAAO,KAAO,KAAM,QAAQ,aAC/D,SAAAN,EAAQ,OAAO,WAClB,CACF,CAAA,EAEAA,EAAQ,IAAKc,GACXa,EAAA,cAACF,EAAA,OAAA,CACE,GAAGX,EACJ,IAAKA,EAAO,KACZ,KAAAR,EACA,QAASC,GAAWO,EAAO,QAC3B,iBAAkBT,EAClB,SAAAF,CAAA,CAAA,CAEH,EAEFC,GACCoB,EAAA,kBAAA,IAACI,UAAQ,CAAA,SAAU,CAACnB,GAAsB,QAAUO,EAAa,MAAOP,GAAwB,GAC7F,SAAAD,0BACEqB,EACC,IAAA,CAAA,SAAAL,EAAA,kBAAA,IAACM,EAAA,KAAA,CACC,KAAMX,EACN,cAAa,GAAGT,CAAU,cACzB,GAAGF,EACJ,aAAc,CAAC,CAAE,KAAAuB,KAAW,CAC1Bd,EAAec,CAAI,EACnBX,EAAYW,CAAI,CAClB,EACA,YAAa,CACX,GAAGV,EACH,UAAW,EAAA,CACb,CAAA,EAEJ,EAECG,EAAA,kBAAA,IAAAQ,SAAA,CAAQ,GAAGX,EAAa,QAASnB,EAAO,CAE7C,CAAA,CAAA,CAAA,CAEJ,CAEJ"}

package/dist/chunks/{buttonGroup.component-CO5lC36l.js → buttonGroup.component-B4APVs0L.js}

@@ -1,7 +1,7 @@
 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-WHzMw5ZI.js";
+import { M as P } from "./menu.component-CAttpI-a.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";
@@ -67,4 +67,4 @@ const $ = y(
 export {
   E as B
 };
-//# sourceMappingURL=buttonGroup.component-CO5lC36l.js.map
+//# sourceMappingURL=buttonGroup.component-B4APVs0L.js.map

package/dist/chunks/{buttonGroup.component-CO5lC36l.js.map → buttonGroup.component-B4APVs0L.js.map}

@@ -1 +1 @@
-{"version":3,"file":"buttonGroup.component-CO5lC36l.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]}
+{"version":3,"file":"buttonGroup.component-B4APVs0L.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/{buttonGroup.component-pR0mvmm7.js → buttonGroup.component-BRafsTrY.js}

@@ -1,2 +1,2 @@
-"use strict";const e=require("./jsx-runtime-BjDatQAs.js"),p=require("react"),q=require("./button.component-DjdgBXDC.js"),f=require("./menu.component-D2V9Q1Y5.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-pR0mvmm7.js.map
+"use strict";const e=require("./jsx-runtime-BjDatQAs.js"),p=require("react"),q=require("./button.component-DjdgBXDC.js"),f=require("./menu.component-B_rE1WZ2.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-BRafsTrY.js.map

package/dist/chunks/{buttonGroup.component-pR0mvmm7.js.map → buttonGroup.component-BRafsTrY.js.map}

@@ -1 +1 @@
-{"version":3,"file":"buttonGroup.component-pR0mvmm7.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]}
+{"version":3,"file":"buttonGroup.component-BRafsTrY.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/calendar.component-BswlIQ5W.js

@@ -0,0 +1,62 @@
+import { j as a } from "./jsx-runtime-C5mzlN2N.js";
+import { B as l } from "./index-9BerxEcw.js";
+import { u, a as p, b as D, c as x } from "./datePicker.provider-DvJrNnut.js";
+import { D as b } from "./divider.component-CFOh4Nw3.js";
+import { B as y } from "./button.component-BO6oee_V.js";
+import { s as f, a as j } from "./format-dJJ72A--.js";
+import { s as C, e as S, a as g } from "./endOfMonth-D0kCU08_.js";
+const w = {
+  today: "Today",
+  thisWeek: "This Week",
+  thisMonth: "This Month"
+}, O = ({
+  footer: t,
+  ["data-testid"]: o = "kibble-calendar-footer"
+}) => {
+  const { goToDate: n, onDateSelect: s, onQuickOptionSelect: i, firstDayOfWeek: d } = u(), h = () => {
+    if (t.type === "custom") {
+      t.onClick();
+      return;
+    }
+    const r = /* @__PURE__ */ new Date();
+    switch (t.value) {
+      case "today": {
+        const e = j(r);
+        n(e), s(e);
+        break;
+      }
+      case "thisWeek": {
+        const e = d ?? 1, c = f(r, { weekStartsOn: e }), m = g(r, { weekStartsOn: e });
+        n(c), i({ startDate: c, endDate: m });
+        break;
+      }
+      case "thisMonth": {
+        const e = C(r), c = S(r);
+        n(e), i({ startDate: e, endDate: c });
+        break;
+      }
+    }
+    t.onClick?.();
+  }, k = t.type === "custom" ? t.label : t.label ?? w[t.value];
+  return /* @__PURE__ */ a.jsx(l, { "data-testid": o, bg: "background.secondaryAlpha", borderRadius: "md", p: 2, w: "full", children: /* @__PURE__ */ a.jsx(y, { variant: "secondarySubtle", size: "md", w: "full", onClick: h, children: k }) });
+}, P = /* @__PURE__ */ new Set(["thisWeek", "thisMonth"]), R = (t) => P.has(t), L = ({
+  ["data-testid"]: t = "kibble-calendar",
+  withDateRange: o = !0,
+  withHeaderTriggers: n = !1,
+  footer: s,
+  ...i
+}) => {
+  const d = o || s?.type === "preset" && R(s.value);
+  return /* @__PURE__ */ a.jsx(l, { className: "Calendar", "data-testid": t, maxW: s ? "360px" : "340px", children: /* @__PURE__ */ a.jsxs(p, { withDateRange: d, ...i, standalone: !0, children: [
+    /* @__PURE__ */ a.jsx(D, { withTriggers: n }),
+    /* @__PURE__ */ a.jsx(b, {}),
+    /* @__PURE__ */ a.jsx(x, {}),
+    s && /* @__PURE__ */ a.jsx(O, { footer: s })
+  ] }) });
+};
+export {
+  L as C,
+  O as a,
+  R as i
+};
+//# sourceMappingURL=calendar.component-BswlIQ5W.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.component-BswlIQ5W.js","sources":["../../src/components/Calendar/calendarFooterButton.component.tsx","../../src/components/Calendar/calendar.utils.ts","../../src/components/Calendar/calendar.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Button } from 'components/Button/button.component';\nimport { useDatePickerContext } from 'components/DatePicker/context/datePicker.context';\nimport startOfDay from 'date-fns/startOfDay';\nimport startOfWeek from 'date-fns/startOfWeek';\nimport startOfMonth from 'date-fns/startOfMonth';\nimport endOfWeek from 'date-fns/endOfWeek';\nimport endOfMonth from 'date-fns/endOfMonth';\n\n/**\n * The built-in preset values for CalendarFooterButton.\n *\n * Intentionally kept as plain string literals rather than re-using\n * DateTimePickerDefaultOptionValue to avoid a duplicate star-export conflict:\n * both Calendar and DateTimePicker barrel-export from components/index.ts,\n * and TypeScript silently drops ambiguous re-exports when two barrels supply\n * the same identifier. Keeping CalendarPreset self-contained prevents that\n * collision and makes the Calendar API standalone.\n */\nexport type CalendarPreset = 'today' | 'thisWeek' | 'thisMonth';\n\nexport interface CalendarFooterPresetConfig {\n  type: 'preset';\n  /** The built-in preset to apply when the button is clicked. */\n  value: CalendarPreset;\n  /**\n   * Override the button label.\n   * Defaults: 'today' → 'Today', 'thisWeek' → 'This Week', 'thisMonth' → 'This Month'.\n   */\n  label?: string;\n  /** Optional callback fired after the preset date is selected. */\n  onClick?: () => void;\n}\n\nexport interface CalendarFooterCustomConfig {\n  type: 'custom';\n  /** Button label — required for custom type. */\n  label: string;\n  /** Handler called when the button is clicked. Full control — no date selection is performed. */\n  onClick: () => void;\n}\n\nexport type CalendarFooterConfig = CalendarFooterPresetConfig | CalendarFooterCustomConfig;\n\nconst PRESET_LABELS: Record<CalendarPreset, string> = {\n  today: 'Today',\n  thisWeek: 'This Week',\n  thisMonth: 'This Month',\n};\n\ninterface CalendarFooterButtonProps {\n  footer: CalendarFooterConfig;\n  /** Data test id for the footer container.\n   * @default kibble-calendar-footer\n   */\n  'data-testid'?: string;\n}\n\nexport const CalendarFooterButton = ({\n  footer,\n  ['data-testid']: dataTestId = 'kibble-calendar-footer',\n}: CalendarFooterButtonProps): React.JSX.Element => {\n  const { goToDate, onDateSelect, onQuickOptionSelect, firstDayOfWeek } = useDatePickerContext();\n\n  const handleClick = (): void => {\n    if (footer.type === 'custom') {\n      footer.onClick();\n      return;\n    }\n\n    const today = new Date();\n\n    switch (footer.value) {\n      case 'today': {\n        const date = startOfDay(today);\n        goToDate(date);\n        onDateSelect(date);\n        break;\n      }\n      case 'thisWeek': {\n        const weekStartsOn = (firstDayOfWeek ?? 1) as 0 | 1 | 2 | 3 | 4 | 5 | 6;\n        const start = startOfWeek(today, { weekStartsOn });\n        const end = endOfWeek(today, { weekStartsOn });\n        goToDate(start);\n        // onQuickOptionSelect sets both dates atomically, avoiding the two-click range flow\n        onQuickOptionSelect({ startDate: start, endDate: end });\n        break;\n      }\n      case 'thisMonth': {\n        const start = startOfMonth(today);\n        const end = endOfMonth(today);\n        goToDate(start);\n        onQuickOptionSelect({ startDate: start, endDate: end });\n        break;\n      }\n    }\n\n    footer.onClick?.();\n  };\n\n  const label = footer.type === 'custom' ? footer.label : (footer.label ?? PRESET_LABELS[footer.value]);\n\n  return (\n    <Box data-testid={dataTestId} bg=\"background.secondaryAlpha\" borderRadius=\"md\" p={2} w=\"full\">\n      <Button variant=\"secondarySubtle\" size=\"md\" w=\"full\" onClick={handleClick}>\n        {label}\n      </Button>\n    </Box>\n  );\n};\n","import { CalendarPreset } from './calendarFooterButton.component';\n\n// Explicit allowlist — new presets default to single-day unless listed here\nconst RANGE_PRESETS = new Set<CalendarPreset>(['thisWeek', 'thisMonth']);\n\n/** Returns true when the preset requires date range selection (week, month). */\nexport const isRangePreset = (value: CalendarPreset): boolean => RANGE_PRESETS.has(value);\n","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';\nimport { CalendarFooterButton, CalendarFooterConfig } from './calendarFooterButton.component';\nimport { isRangePreset } from './calendar.utils';\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   * Optional footer button configuration. Renders a styled button below the calendar grid.\n   *\n   * Use `type: 'preset'` for built-in shortcuts ('today' | 'thisWeek' | 'thisMonth') — the\n   * component handles the date selection logic automatically.\n   *\n   * Use `type: 'custom'` to supply your own label and click handler with no built-in date logic.\n   *\n   * @example\n   * // Preset\n   * footer={{ type: 'preset', value: 'today', onClick: () => setOpen(false) }}\n   *\n   * @example\n   * // Custom\n   * footer={{ type: 'custom', label: 'Reset', onClick: handleReset }}\n   */\n  footer?: CalendarFooterConfig;\n}\n\nexport const Calendar = ({\n  ['data-testid']: dataTestId = 'kibble-calendar',\n  withDateRange = true,\n  withHeaderTriggers = false,\n  footer,\n  ...rest\n}: CalendarProps): React.JSX.Element => {\n  // Range presets (thisWeek, thisMonth) require date range mode regardless of the withDateRange prop\n  const effectiveDateRange = withDateRange || (footer?.type === 'preset' && isRangePreset(footer.value));\n\n  return (\n    <Box className=\"Calendar\" data-testid={dataTestId} maxW={footer ? '360px' : '340px'}>\n      <DatePickerProvider withDateRange={effectiveDateRange} {...rest} standalone>\n        <DatePickerHeader withTriggers={withHeaderTriggers} />\n        <Divider />\n        <DatePickerCalendar />\n        {footer && <CalendarFooterButton footer={footer} />}\n      </DatePickerProvider>\n    </Box>\n  );\n};\n"],"names":["PRESET_LABELS","CalendarFooterButton","footer","dataTestId","goToDate","onDateSelect","onQuickOptionSelect","firstDayOfWeek","useDatePickerContext","handleClick","today","date","startOfDay","weekStartsOn","start","startOfWeek","end","endOfWeek","startOfMonth","endOfMonth","label","jsx","Box","Button","RANGE_PRESETS","isRangePreset","value","Calendar","withDateRange","withHeaderTriggers","rest","effectiveDateRange","DatePickerProvider","DatePickerHeader","Divider","DatePickerCalendar"],"mappings":";;;;;;;AA6CA,MAAMA,IAAgD;AAAA,EACpD,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AACb,GAUaC,IAAuB,CAAC;AAAA,EACnC,QAAAC;AAAA,EACA,CAAC,gBAAgBC,IAAa;AAChC,MAAoD;AAClD,QAAM,EAAE,UAAAC,GAAU,cAAAC,GAAc,qBAAAC,GAAqB,gBAAAC,EAAA,IAAmBC,EAAqB,GAEvFC,IAAc,MAAY;AAC1B,QAAAP,EAAO,SAAS,UAAU;AAC5B,MAAAA,EAAO,QAAQ;AACf;AAAA,IAAA;AAGI,UAAAQ,wBAAY,KAAK;AAEvB,YAAQR,EAAO,OAAO;AAAA,MACpB,KAAK,SAAS;AACN,cAAAS,IAAOC,EAAWF,CAAK;AAC7B,QAAAN,EAASO,CAAI,GACbN,EAAaM,CAAI;AACjB;AAAA,MAAA;AAAA,MAEF,KAAK,YAAY;AACf,cAAME,IAAgBN,KAAkB,GAClCO,IAAQC,EAAYL,GAAO,EAAE,cAAAG,GAAc,GAC3CG,IAAMC,EAAUP,GAAO,EAAE,cAAAG,GAAc;AAC7C,QAAAT,EAASU,CAAK,GAEdR,EAAoB,EAAE,WAAWQ,GAAO,SAASE,GAAK;AACtD;AAAA,MAAA;AAAA,MAEF,KAAK,aAAa;AACV,cAAAF,IAAQI,EAAaR,CAAK,GAC1BM,IAAMG,EAAWT,CAAK;AAC5B,QAAAN,EAASU,CAAK,GACdR,EAAoB,EAAE,WAAWQ,GAAO,SAASE,GAAK;AACtD;AAAA,MAAA;AAAA,IACF;AAGF,IAAAd,EAAO,UAAU;AAAA,EACnB,GAEMkB,IAAQlB,EAAO,SAAS,WAAWA,EAAO,QAASA,EAAO,SAASF,EAAcE,EAAO,KAAK;AAGjG,SAAAmB,gBAAAA,EAAA,IAACC,KAAI,eAAanB,GAAY,IAAG,6BAA4B,cAAa,MAAK,GAAG,GAAG,GAAE,QACrF,UAACkB,gBAAAA,EAAA,IAAAE,GAAA,EAAO,SAAQ,mBAAkB,MAAK,MAAK,GAAE,QAAO,SAASd,GAC3D,UAAAW,EAAA,CACH,EACF,CAAA;AAEJ,GC3GMI,IAAoB,oBAAA,IAAoB,CAAC,YAAY,WAAW,CAAC,GAG1DC,IAAgB,CAACC,MAAmCF,EAAc,IAAIE,CAAK,GCsC3EC,IAAW,CAAC;AAAA,EACvB,CAAC,gBAAgBxB,IAAa;AAAA,EAC9B,eAAAyB,IAAgB;AAAA,EAChB,oBAAAC,IAAqB;AAAA,EACrB,QAAA3B;AAAA,EACA,GAAG4B;AACL,MAAwC;AAEtC,QAAMC,IAAqBH,KAAkB1B,GAAQ,SAAS,YAAYuB,EAAcvB,EAAO,KAAK;AAEpG,+BACGoB,GAAI,EAAA,WAAU,YAAW,eAAanB,GAAY,MAAMD,IAAS,UAAU,SAC1E,iCAAC8B,GAAmB,EAAA,eAAeD,GAAqB,GAAGD,GAAM,YAAU,IACzE,UAAA;AAAA,IAACT,gBAAAA,EAAAA,IAAAY,GAAA,EAAiB,cAAcJ,EAAoB,CAAA;AAAA,0BACnDK,GAAQ,EAAA;AAAA,0BACRC,GAAmB,EAAA;AAAA,IACnBjC,KAAWmB,gBAAAA,EAAA,IAAApB,GAAA,EAAqB,QAAAC,EAAgB,CAAA;AAAA,EAAA,EAAA,CACnD,EACF,CAAA;AAEJ;"}

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

@@ -0,0 +1,2 @@
+"use strict";const s=require("./jsx-runtime-BjDatQAs.js"),h=require("./index-BQRnVsAg.js"),o=require("./datePicker.provider-CcGhcyCp.js"),D=require("./divider.component-BX3zyB7O.js"),b=require("./button.component-DjdgBXDC.js"),x=require("./format-CK7Imh-5.js"),u=require("./endOfMonth-ClO3w4vF.js"),E={today:"Today",thisWeek:"This Week",thisMonth:"This Month"},k=({footer:e,["data-testid"]:d="kibble-calendar-footer"})=>{const{goToDate:a,onDateSelect:n,onQuickOptionSelect:i,firstDayOfWeek:l}=o.useDatePickerContext(),m=()=>{if(e.type==="custom"){e.onClick();return}const r=new Date;switch(e.value){case"today":{const t=x.startOfDay(r);a(t),n(t);break}case"thisWeek":{const t=l??1,c=x.startOfWeek(r,{weekStartsOn:t}),R=u.endOfWeek(r,{weekStartsOn:t});a(c),i({startDate:c,endDate:R});break}case"thisMonth":{const t=u.startOfMonth(r),c=u.endOfMonth(r);a(t),i({startDate:t,endDate:c});break}}e.onClick?.()},j=e.type==="custom"?e.label:e.label??E[e.value];return s.jsxRuntimeExports.jsx(h.Box,{"data-testid":d,bg:"background.secondaryAlpha",borderRadius:"md",p:2,w:"full",children:s.jsxRuntimeExports.jsx(b.Button,{variant:"secondarySubtle",size:"md",w:"full",onClick:m,children:j})})},y=new Set(["thisWeek","thisMonth"]),p=e=>y.has(e),C=({["data-testid"]:e="kibble-calendar",withDateRange:d=!0,withHeaderTriggers:a=!1,footer:n,...i})=>{const l=d||n?.type==="preset"&&p(n.value);return s.jsxRuntimeExports.jsx(h.Box,{className:"Calendar","data-testid":e,maxW:n?"360px":"340px",children:s.jsxRuntimeExports.jsxs(o.DatePickerProvider,{withDateRange:l,...i,standalone:!0,children:[s.jsxRuntimeExports.jsx(o.DatePickerHeader,{withTriggers:a}),s.jsxRuntimeExports.jsx(D.Divider,{}),s.jsxRuntimeExports.jsx(o.DatePickerCalendar,{}),n&&s.jsxRuntimeExports.jsx(k,{footer:n})]})})};exports.Calendar=C;exports.CalendarFooterButton=k;exports.isRangePreset=p;
+//# sourceMappingURL=calendar.component-Dt452bDI.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.component-Dt452bDI.js","sources":["../../src/components/Calendar/calendarFooterButton.component.tsx","../../src/components/Calendar/calendar.utils.ts","../../src/components/Calendar/calendar.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Button } from 'components/Button/button.component';\nimport { useDatePickerContext } from 'components/DatePicker/context/datePicker.context';\nimport startOfDay from 'date-fns/startOfDay';\nimport startOfWeek from 'date-fns/startOfWeek';\nimport startOfMonth from 'date-fns/startOfMonth';\nimport endOfWeek from 'date-fns/endOfWeek';\nimport endOfMonth from 'date-fns/endOfMonth';\n\n/**\n * The built-in preset values for CalendarFooterButton.\n *\n * Intentionally kept as plain string literals rather than re-using\n * DateTimePickerDefaultOptionValue to avoid a duplicate star-export conflict:\n * both Calendar and DateTimePicker barrel-export from components/index.ts,\n * and TypeScript silently drops ambiguous re-exports when two barrels supply\n * the same identifier. Keeping CalendarPreset self-contained prevents that\n * collision and makes the Calendar API standalone.\n */\nexport type CalendarPreset = 'today' | 'thisWeek' | 'thisMonth';\n\nexport interface CalendarFooterPresetConfig {\n  type: 'preset';\n  /** The built-in preset to apply when the button is clicked. */\n  value: CalendarPreset;\n  /**\n   * Override the button label.\n   * Defaults: 'today' → 'Today', 'thisWeek' → 'This Week', 'thisMonth' → 'This Month'.\n   */\n  label?: string;\n  /** Optional callback fired after the preset date is selected. */\n  onClick?: () => void;\n}\n\nexport interface CalendarFooterCustomConfig {\n  type: 'custom';\n  /** Button label — required for custom type. */\n  label: string;\n  /** Handler called when the button is clicked. Full control — no date selection is performed. */\n  onClick: () => void;\n}\n\nexport type CalendarFooterConfig = CalendarFooterPresetConfig | CalendarFooterCustomConfig;\n\nconst PRESET_LABELS: Record<CalendarPreset, string> = {\n  today: 'Today',\n  thisWeek: 'This Week',\n  thisMonth: 'This Month',\n};\n\ninterface CalendarFooterButtonProps {\n  footer: CalendarFooterConfig;\n  /** Data test id for the footer container.\n   * @default kibble-calendar-footer\n   */\n  'data-testid'?: string;\n}\n\nexport const CalendarFooterButton = ({\n  footer,\n  ['data-testid']: dataTestId = 'kibble-calendar-footer',\n}: CalendarFooterButtonProps): React.JSX.Element => {\n  const { goToDate, onDateSelect, onQuickOptionSelect, firstDayOfWeek } = useDatePickerContext();\n\n  const handleClick = (): void => {\n    if (footer.type === 'custom') {\n      footer.onClick();\n      return;\n    }\n\n    const today = new Date();\n\n    switch (footer.value) {\n      case 'today': {\n        const date = startOfDay(today);\n        goToDate(date);\n        onDateSelect(date);\n        break;\n      }\n      case 'thisWeek': {\n        const weekStartsOn = (firstDayOfWeek ?? 1) as 0 | 1 | 2 | 3 | 4 | 5 | 6;\n        const start = startOfWeek(today, { weekStartsOn });\n        const end = endOfWeek(today, { weekStartsOn });\n        goToDate(start);\n        // onQuickOptionSelect sets both dates atomically, avoiding the two-click range flow\n        onQuickOptionSelect({ startDate: start, endDate: end });\n        break;\n      }\n      case 'thisMonth': {\n        const start = startOfMonth(today);\n        const end = endOfMonth(today);\n        goToDate(start);\n        onQuickOptionSelect({ startDate: start, endDate: end });\n        break;\n      }\n    }\n\n    footer.onClick?.();\n  };\n\n  const label = footer.type === 'custom' ? footer.label : (footer.label ?? PRESET_LABELS[footer.value]);\n\n  return (\n    <Box data-testid={dataTestId} bg=\"background.secondaryAlpha\" borderRadius=\"md\" p={2} w=\"full\">\n      <Button variant=\"secondarySubtle\" size=\"md\" w=\"full\" onClick={handleClick}>\n        {label}\n      </Button>\n    </Box>\n  );\n};\n","import { CalendarPreset } from './calendarFooterButton.component';\n\n// Explicit allowlist — new presets default to single-day unless listed here\nconst RANGE_PRESETS = new Set<CalendarPreset>(['thisWeek', 'thisMonth']);\n\n/** Returns true when the preset requires date range selection (week, month). */\nexport const isRangePreset = (value: CalendarPreset): boolean => RANGE_PRESETS.has(value);\n","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';\nimport { CalendarFooterButton, CalendarFooterConfig } from './calendarFooterButton.component';\nimport { isRangePreset } from './calendar.utils';\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   * Optional footer button configuration. Renders a styled button below the calendar grid.\n   *\n   * Use `type: 'preset'` for built-in shortcuts ('today' | 'thisWeek' | 'thisMonth') — the\n   * component handles the date selection logic automatically.\n   *\n   * Use `type: 'custom'` to supply your own label and click handler with no built-in date logic.\n   *\n   * @example\n   * // Preset\n   * footer={{ type: 'preset', value: 'today', onClick: () => setOpen(false) }}\n   *\n   * @example\n   * // Custom\n   * footer={{ type: 'custom', label: 'Reset', onClick: handleReset }}\n   */\n  footer?: CalendarFooterConfig;\n}\n\nexport const Calendar = ({\n  ['data-testid']: dataTestId = 'kibble-calendar',\n  withDateRange = true,\n  withHeaderTriggers = false,\n  footer,\n  ...rest\n}: CalendarProps): React.JSX.Element => {\n  // Range presets (thisWeek, thisMonth) require date range mode regardless of the withDateRange prop\n  const effectiveDateRange = withDateRange || (footer?.type === 'preset' && isRangePreset(footer.value));\n\n  return (\n    <Box className=\"Calendar\" data-testid={dataTestId} maxW={footer ? '360px' : '340px'}>\n      <DatePickerProvider withDateRange={effectiveDateRange} {...rest} standalone>\n        <DatePickerHeader withTriggers={withHeaderTriggers} />\n        <Divider />\n        <DatePickerCalendar />\n        {footer && <CalendarFooterButton footer={footer} />}\n      </DatePickerProvider>\n    </Box>\n  );\n};\n"],"names":["PRESET_LABELS","CalendarFooterButton","footer","dataTestId","goToDate","onDateSelect","onQuickOptionSelect","firstDayOfWeek","useDatePickerContext","handleClick","today","date","startOfDay","weekStartsOn","start","startOfWeek","end","endOfWeek","startOfMonth","endOfMonth","label","jsx","Box","Button","RANGE_PRESETS","isRangePreset","value","Calendar","withDateRange","withHeaderTriggers","rest","effectiveDateRange","DatePickerProvider","DatePickerHeader","Divider","DatePickerCalendar"],"mappings":"2SA6CMA,EAAgD,CACpD,MAAO,QACP,SAAU,YACV,UAAW,YACb,EAUaC,EAAuB,CAAC,CACnC,OAAAC,EACA,CAAC,eAAgBC,EAAa,wBAChC,IAAoD,CAClD,KAAM,CAAE,SAAAC,EAAU,aAAAC,EAAc,oBAAAC,EAAqB,eAAAC,CAAA,EAAmBC,EAAAA,qBAAqB,EAEvFC,EAAc,IAAY,CAC1B,GAAAP,EAAO,OAAS,SAAU,CAC5BA,EAAO,QAAQ,EACf,MAAA,CAGI,MAAAQ,MAAY,KAElB,OAAQR,EAAO,MAAO,CACpB,IAAK,QAAS,CACN,MAAAS,EAAOC,aAAWF,CAAK,EAC7BN,EAASO,CAAI,EACbN,EAAaM,CAAI,EACjB,KAAA,CAEF,IAAK,WAAY,CACf,MAAME,EAAgBN,GAAkB,EAClCO,EAAQC,EAAA,YAAYL,EAAO,CAAE,aAAAG,EAAc,EAC3CG,EAAMC,EAAA,UAAUP,EAAO,CAAE,aAAAG,EAAc,EAC7CT,EAASU,CAAK,EAEdR,EAAoB,CAAE,UAAWQ,EAAO,QAASE,EAAK,EACtD,KAAA,CAEF,IAAK,YAAa,CACV,MAAAF,EAAQI,eAAaR,CAAK,EAC1BM,EAAMG,aAAWT,CAAK,EAC5BN,EAASU,CAAK,EACdR,EAAoB,CAAE,UAAWQ,EAAO,QAASE,EAAK,EACtD,KAAA,CACF,CAGFd,EAAO,UAAU,CACnB,EAEMkB,EAAQlB,EAAO,OAAS,SAAWA,EAAO,MAASA,EAAO,OAASF,EAAcE,EAAO,KAAK,EAGjG,OAAAmB,EAAA,kBAAA,IAACC,OAAI,cAAanB,EAAY,GAAG,4BAA4B,aAAa,KAAK,EAAG,EAAG,EAAE,OACrF,SAACkB,EAAA,kBAAA,IAAAE,EAAA,OAAA,CAAO,QAAQ,kBAAkB,KAAK,KAAK,EAAE,OAAO,QAASd,EAC3D,SAAAW,CAAA,CACH,CACF,CAAA,CAEJ,EC3GMI,EAAoB,IAAA,IAAoB,CAAC,WAAY,WAAW,CAAC,EAG1DC,EAAiBC,GAAmCF,EAAc,IAAIE,CAAK,ECsC3EC,EAAW,CAAC,CACvB,CAAC,eAAgBxB,EAAa,kBAC9B,cAAAyB,EAAgB,GAChB,mBAAAC,EAAqB,GACrB,OAAA3B,EACA,GAAG4B,CACL,IAAwC,CAEtC,MAAMC,EAAqBH,GAAkB1B,GAAQ,OAAS,UAAYuB,EAAcvB,EAAO,KAAK,EAEpG,+BACGoB,MAAI,CAAA,UAAU,WAAW,cAAanB,EAAY,KAAMD,EAAS,QAAU,QAC1E,kCAAC8B,EAAmB,mBAAA,CAAA,cAAeD,EAAqB,GAAGD,EAAM,WAAU,GACzE,SAAA,CAACT,EAAAA,kBAAAA,IAAAY,EAAA,iBAAA,CAAiB,aAAcJ,CAAoB,CAAA,0BACnDK,EAAQ,QAAA,EAAA,0BACRC,EAAmB,mBAAA,EAAA,EACnBjC,GAAWmB,EAAA,kBAAA,IAAApB,EAAA,CAAqB,OAAAC,CAAgB,CAAA,CAAA,CAAA,CACnD,CACF,CAAA,CAEJ"}

package/dist/chunks/{characterCounter.component-BRHLt929.js → characterCounter.component-CczgC612.js}

@@ -1,2 +1,2 @@
-"use strict";const s=require("./jsx-runtime-BjDatQAs.js"),l=require("react"),a=require("./text.component-BDDz5KQP.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-BRHLt929.js.map
+"use strict";const s=require("./jsx-runtime-BjDatQAs.js"),l=require("react"),a=require("./text.component-D5GpbfNx.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-CczgC612.js.map

package/dist/chunks/{characterCounter.component-BRHLt929.js.map → characterCounter.component-CczgC612.js.map}

@@ -1 +1 @@
-{"version":3,"file":"characterCounter.component-BRHLt929.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"}
+{"version":3,"file":"characterCounter.component-CczgC612.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-DI_FQNUR.js → characterCounter.component-Cm9yEHjz.js}

@@ -1,6 +1,6 @@
 import { j as e } from "./jsx-runtime-C5mzlN2N.js";
 import { useMemo as u } from "react";
-import { W as s } from "./text.component-DhuUgP3j.js";
+import { W as s } from "./text.component-C9jh_JMO.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";
@@ -79,4 +79,4 @@ const f = d({
 export {
   k as C
 };
-//# sourceMappingURL=characterCounter.component-DI_FQNUR.js.map
+//# sourceMappingURL=characterCounter.component-Cm9yEHjz.js.map