@televet/kibble-ui 5.1.1 → 5.3.0

package/dist/chunks/alert.component-DjFZO6Ks.js

@@ -1,141 +0,0 @@
-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-D8oRhIr6.js";
-import { I as S } from "./icon.component-PV_nHBId.js";
-import { W } from "./text.component-DbJw4Y9-.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";
-import { c as I } from "./provider-ClCAdPxy.js";
-import { c as z } from "./create-slot-recipe-context-D_FXDJGp.js";
-import { c as $ } from "./factory-BQshv7_b.js";
-import { I as u, W as g, C as F } from "./icons-CEVtpQAi.js";
-const [M, D] = I({
-  name: "AlertStatusContext",
-  hookName: "useAlertStatusContext",
-  providerName: "<Alert />"
-}), {
-  withProvider: E,
-  withContext: p,
-  useStyles: b
-} = z({ key: "alert" }), H = E(
-  "div",
-  "root",
-  {
-    forwardAsChild: !0,
-    wrapElement(t, s) {
-      return (
-        // @ts-ignore fix later
-        /* @__PURE__ */ e.jsx(M, { value: { status: s.status || "info" }, children: t })
-      );
-    }
-  }
-), T = p(
-  "div",
-  "title"
-), q = p("div", "description"), G = p(
-  "div",
-  "content"
-), J = {
-  info: u,
-  warning: g,
-  success: F,
-  error: g,
-  neutral: u
-}, K = C(
-  function(s, c) {
-    const r = D(), a = b(), l = typeof r.status == "string" ? J[r.status] : N, { children: m = /* @__PURE__ */ e.jsx(l, {}), ...i } = s;
-    return /* @__PURE__ */ e.jsx($.span, { ref: c, ...i, css: [a.indicator, s.css], children: m });
-  }
-), f = ({
-  buttonPosition: t = "topRight",
-  buttonText: s,
-  status: c,
-  ["data-testid"]: r = "kibble-alert-button",
-  ...a
-}) => /* @__PURE__ */ e.jsx(
-  A,
-  {
-    className: "Alert__Button",
-    "data-testid": r,
-    ...t !== "topRight" && { pt: 2, pb: 1 },
-    ...t === "bottomRight" && { justifyContent: "flex-end" },
-    children: /* @__PURE__ */ e.jsx(j, { size: "xs", variant: c === "default" ? "primary" : "secondary", w: "max-content", ...a, children: s })
-  }
-), it = ({
-  buttonProps: t,
-  description: s,
-  descriptionProps: c,
-  hideCloseButton: r = !1,
-  hideIcon: a = !1,
-  iconProps: l,
-  onClose: m,
-  onContrast: i = !1,
-  status: n = "success",
-  title: d,
-  titleProps: v,
-  closeButtonIcon: R = "close",
-  ["data-testid"]: o = "kibble-alert",
-  ..._
-}) => {
-  t && !t.buttonPosition && (t.buttonPosition = "topRight");
-  const x = t && t.buttonPosition === "topRight", h = x ? A : y.Fragment;
-  return /* @__PURE__ */ e.jsxs(
-    H,
-    {
-      className: "Alert",
-      "data-testid": o,
-      ..._,
-      variant: n,
-      hideIcon: a,
-      onContrast: i,
-      children: [
-        !a && /* @__PURE__ */ e.jsx(K, { className: "Alert__Icon", "data-testid": `${o}-icon`, children: /* @__PURE__ */ e.jsx(
-          S,
-          {
-            variant: i ? "onContrast" : B[n],
-            name: l?.name || k[n],
-            size: "lg",
-            ...l
-          }
-        ) }),
-        /* @__PURE__ */ e.jsxs(G, { className: "Alert__Content", "data-testid": `${o}-content`, children: [
-          d && /* @__PURE__ */ e.jsxs(
-            h,
-            {
-              ...x && {
-                justifyContent: "space-between",
-                gap: 2
-              },
-              children: [
-                /* @__PURE__ */ e.jsx(T, { className: "Alert__Title", "data-testid": `${o}-title`, children: /* @__PURE__ */ e.jsx(w, { size: "sm", variant: i ? "onContrast" : "default", ...v, children: d }) }),
-                t && t.buttonPosition === "topRight" && /* @__PURE__ */ e.jsx(f, { status: n, onContrast: i, ...t })
-              ]
-            }
-          ),
-          s && /* @__PURE__ */ e.jsxs(h, { ...x && { justifyContent: "space-between" }, children: [
-            /* @__PURE__ */ e.jsx(q, { className: "Alert__Description", "data-testid": `${o}-description`, children: typeof s == "string" ? /* @__PURE__ */ e.jsx(W, { size: "md", variant: i ? "onContrast" : "default", ...c, children: s }) : s }),
-            t && t.buttonPosition === "topRight" && !d && /* @__PURE__ */ e.jsx(f, { status: n, onContrast: i, ...t })
-          ] }),
-          t && t?.buttonPosition !== "topRight" && /* @__PURE__ */ e.jsx(f, { status: n, onContrast: i, ...t })
-        ] }),
-        !r && /* @__PURE__ */ e.jsx(
-          j,
-          {
-            className: "Alert__CloseTrigger",
-            "data-testid": `${o}-close-trigger`,
-            iconName: R,
-            size: "xs",
-            variant: "ghostNeutral",
-            onContrast: i,
-            onClick: m
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  it as A
-};
-//# sourceMappingURL=alert.component-DjFZO6Ks.js.map

package/dist/chunks/alert.component-DjFZO6Ks.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"alert.component-DjFZO6Ks.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/card.component-B1AznjWF.js

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

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

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

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

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

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

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

package/dist/chunks/notificationCounter.component-BUxWlpKh.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"notificationCounter.component-BUxWlpKh.js","sources":["../../src/components/NotificationCounter/notificationCounter.recipe.ts","../../src/components/NotificationCounter/notificationCounter.records.ts","../../src/components/NotificationCounter/notificationCounter.component.tsx"],"sourcesContent":["import { defineSlotRecipe, SystemStyleObject } from '@chakra-ui/react/styled-system';\nimport { NotificationCounterSize, NotificationCounterVariant } from './notificationCounter.types';\n\nconst notificationCounterSlots = ['root', 'maxElement'] as const;\ntype NotificationCounterSlot = (typeof notificationCounterSlots)[number];\n\nconst notificationCounterVariantStyles: Record<\n  NotificationCounterVariant,\n  Record<NotificationCounterSlot, SystemStyleObject>\n> = {\n  blue: {\n    root: {\n      bgColor: 'background.accent',\n      color: 'text.contrast',\n    },\n    maxElement: {\n      bgColor: 'text.contrast',\n    },\n  },\n  green: {\n    root: {\n      bgColor: 'background.success.contrast',\n      color: 'text.contrast',\n    },\n    maxElement: {\n      bgColor: 'text.contrast',\n    },\n  },\n  neutral: {\n    root: {\n      bgColor: 'background.subtle.less',\n      color: 'text',\n    },\n    maxElement: {\n      bgColor: 'text',\n    },\n  },\n  red: {\n    root: {\n      bgColor: 'background.danger.contrast',\n      color: 'text.contrast',\n    },\n    maxElement: {\n      bgColor: 'text.contrast',\n    },\n  },\n};\n\nconst notificationCounterSizeStyles: Record<\n  NotificationCounterSize,\n  Record<NotificationCounterSlot, SystemStyleObject>\n> = {\n  xs: {\n    root: {\n      fontSize: '8px',\n      height: 3,\n      width: 3,\n    },\n    maxElement: {\n      height: '1px',\n      width: '1px',\n    },\n  },\n  sm: {\n    root: { fontSize: '10px', height: 4, width: 4 },\n    maxElement: {\n      height: '2px',\n      width: '2px',\n    },\n  },\n  md: {\n    root: {\n      fontSize: 'xs',\n      height: 5,\n      width: 5,\n    },\n    maxElement: {\n      height: '3px',\n      width: '3px',\n    },\n  },\n  lg: {\n    root: {\n      fontSize: 'sm',\n      height: 6,\n      width: 6,\n    },\n    maxElement: {\n      height: 1,\n      width: 1,\n    },\n  },\n};\n\nexport const notificationCounterRecipe = defineSlotRecipe({\n  slots: notificationCounterSlots,\n  base: {\n    root: {\n      alignItems: 'center',\n      border: '1px',\n      borderColor: 'background',\n      borderRadius: 'full',\n      fontWeight: 'semibold',\n      justifyContent: 'center',\n    },\n    maxElement: {\n      borderRadius: 'full',\n    },\n  },\n  variants: {\n    size: notificationCounterSizeStyles,\n    variant: notificationCounterVariantStyles,\n  },\n  defaultVariants: {\n    size: 'md',\n    variant: 'red',\n  },\n});\n","import { SpinnerSize } from 'components/Spinner/spinner.types';\nimport { NotificationCounterSize, NotificationCounterVariant } from './notificationCounter.types';\nimport { TypographyVariant } from 'shared/types';\n\nexport const MAX_COUNT = 99;\n\nexport const notificationCounterSpinnerSize: Record<NotificationCounterSize, SpinnerSize | null> = {\n  xs: null, // The xs size doesn't show a spinner\n  sm: 'xs',\n  md: 'xs',\n  lg: 'sm',\n};\n\nexport const spinnerVariantToNotificationCounterVariant: Record<NotificationCounterVariant, TypographyVariant> = {\n  red: 'dangerOnContrast',\n  blue: 'interactiveOnContrast',\n  green: 'brandOnContrast',\n  neutral: 'subtleOnContrast',\n};\n","import React, { useMemo } from 'react';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { NotificationCounterSize, NotificationCounterVariant } from './notificationCounter.types';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { notificationCounterRecipe } from './notificationCounter.recipe';\nimport {\n  MAX_COUNT,\n  notificationCounterSpinnerSize,\n  spinnerVariantToNotificationCounterVariant,\n} from './notificationCounter.records';\nimport { Spinner } from 'components/Spinner/spinner.component';\nimport { Box } from '@chakra-ui/react/box';\n\nexport interface NotificationCounterProps extends FlexProps {\n  /** Value of the notification counter. If count is greater than 99, the count will be hidden and a special indicator will take its place. */\n  count?: number;\n  /** If true, the notification counter will show a spinner.\n   * @default false\n   */\n  loading?: boolean;\n  /** Whether or not to show the counter label. If the size is xs, by default the count label won't be shown.\n   * @default true\n   */\n  showCount?: boolean;\n  /** Size of the notification counter\n   * @default md\n   */\n  size?: NotificationCounterSize;\n  /** Color variant for the notification counter\n   * @default red\n   */\n  variant?: NotificationCounterVariant;\n  /** Data test id for the notification counter.\n   * @default kibble-notification-counter\n   */\n  'data-testid'?: string;\n}\n\nexport const NotificationCounter = ({\n  count,\n  loading = false,\n  showCount = true,\n  size = 'md',\n  variant = 'red',\n  ['data-testid']: dataTestId = 'kibble-notification-counter',\n  ...rest\n}: NotificationCounterProps): React.JSX.Element => {\n  const recipe = useSlotRecipe({ recipe: notificationCounterRecipe });\n  const styles = recipe({ size, variant });\n  const shouldShowCount = size !== 'xs' && showCount;\n\n  const counterContent = useMemo(() => {\n    const _spinnerSize = notificationCounterSpinnerSize[size];\n    const _spinnerVariant = spinnerVariantToNotificationCounterVariant[variant];\n\n    if (loading && !!_spinnerSize) return <Spinner variant={_spinnerVariant} size={_spinnerSize} />;\n\n    if (count == null) return null; // Handle undefined or null count\n\n    if (count > MAX_COUNT) return <Box css={styles.maxElement} />;\n\n    return count;\n  }, [size, variant, loading, count, styles.maxElement]);\n\n  return (\n    <Flex className=\"NotificationCounter\" data-testid={dataTestId} css={styles.root} {...rest}>\n      {shouldShowCount && counterContent}\n    </Flex>\n  );\n};\n"],"names":["notificationCounterSlots","notificationCounterVariantStyles","notificationCounterSizeStyles","notificationCounterRecipe","defineSlotRecipe","MAX_COUNT","notificationCounterSpinnerSize","spinnerVariantToNotificationCounterVariant","NotificationCounter","count","loading","showCount","size","variant","dataTestId","rest","styles","useSlotRecipe","shouldShowCount","counterContent","useMemo","_spinnerSize","_spinnerVariant","Spinner","Box","jsx","Flex"],"mappings":"mRAGMA,EAA2B,CAAC,OAAQ,YAAY,EAGhDC,EAGF,CACF,KAAM,CACJ,KAAM,CACJ,QAAS,oBACT,MAAO,eACT,EACA,WAAY,CACV,QAAS,eAAA,CAEb,EACA,MAAO,CACL,KAAM,CACJ,QAAS,8BACT,MAAO,eACT,EACA,WAAY,CACV,QAAS,eAAA,CAEb,EACA,QAAS,CACP,KAAM,CACJ,QAAS,yBACT,MAAO,MACT,EACA,WAAY,CACV,QAAS,MAAA,CAEb,EACA,IAAK,CACH,KAAM,CACJ,QAAS,6BACT,MAAO,eACT,EACA,WAAY,CACV,QAAS,eAAA,CACX,CAEJ,EAEMC,EAGF,CACF,GAAI,CACF,KAAM,CACJ,SAAU,MACV,OAAQ,EACR,MAAO,CACT,EACA,WAAY,CACV,OAAQ,MACR,MAAO,KAAA,CAEX,EACA,GAAI,CACF,KAAM,CAAE,SAAU,OAAQ,OAAQ,EAAG,MAAO,CAAE,EAC9C,WAAY,CACV,OAAQ,MACR,MAAO,KAAA,CAEX,EACA,GAAI,CACF,KAAM,CACJ,SAAU,KACV,OAAQ,EACR,MAAO,CACT,EACA,WAAY,CACV,OAAQ,MACR,MAAO,KAAA,CAEX,EACA,GAAI,CACF,KAAM,CACJ,SAAU,KACV,OAAQ,EACR,MAAO,CACT,EACA,WAAY,CACV,OAAQ,EACR,MAAO,CAAA,CACT,CAEJ,EAEaC,EAA4BC,EAAAA,iBAAiB,CACxD,MAAOJ,EACP,KAAM,CACJ,KAAM,CACJ,WAAY,SACZ,OAAQ,MACR,YAAa,aACb,aAAc,OACd,WAAY,WACZ,eAAgB,QAClB,EACA,WAAY,CACV,aAAc,MAAA,CAElB,EACA,SAAU,CACR,KAAME,EACN,QAASD,CACX,EACA,gBAAiB,CACf,KAAM,KACN,QAAS,KAAA,CAEb,CAAC,ECjHYI,EAAY,GAEZC,EAAsF,CACjG,GAAI,KACJ,GAAI,KACJ,GAAI,KACJ,GAAI,IACN,EAEaC,EAAoG,CAC/G,IAAK,mBACL,KAAM,wBACN,MAAO,kBACP,QAAS,kBACX,ECoBaC,EAAsB,CAAC,CAClC,MAAAC,EACA,QAAAC,EAAU,GACV,UAAAC,EAAY,GACZ,KAAAC,EAAO,KACP,QAAAC,EAAU,MACV,CAAC,eAAgBC,EAAa,8BAC9B,GAAGC,CACL,IAAmD,CAEjD,MAAMC,EADSC,EAAA,cAAc,CAAE,OAAQd,EAA2B,EAC5C,CAAE,KAAAS,EAAM,QAAAC,EAAS,EACjCK,EAAkBN,IAAS,MAAQD,EAEnCQ,EAAiBC,EAAAA,QAAQ,IAAM,CAC7B,MAAAC,EAAef,EAA+BM,CAAI,EAClDU,EAAkBf,EAA2CM,CAAO,EAEtE,OAAAH,GAAaW,0BAAsBE,UAAQ,CAAA,QAASD,EAAiB,KAAMD,CAAc,CAAA,EAEzFZ,GAAS,KAAa,KAEtBA,EAAQJ,0BAAmBmB,EAAI,IAAA,CAAA,IAAKR,EAAO,WAAY,EAEpDP,CAAA,EACN,CAACG,EAAMC,EAASH,EAASD,EAAOO,EAAO,UAAU,CAAC,EAErD,OACGS,EAAAA,kBAAAA,IAAAC,EAAAA,KAAA,CAAK,UAAU,sBAAsB,cAAaZ,EAAY,IAAKE,EAAO,KAAO,GAAGD,EAClF,SAAAG,GAAmBC,EACtB,CAEJ"}

package/dist/chunks/notificationCounter.component-DikPb9gS.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"notificationCounter.component-DikPb9gS.js","sources":["../../src/components/NotificationCounter/notificationCounter.recipe.ts","../../src/components/NotificationCounter/notificationCounter.records.ts","../../src/components/NotificationCounter/notificationCounter.component.tsx"],"sourcesContent":["import { defineSlotRecipe, SystemStyleObject } from '@chakra-ui/react/styled-system';\nimport { NotificationCounterSize, NotificationCounterVariant } from './notificationCounter.types';\n\nconst notificationCounterSlots = ['root', 'maxElement'] as const;\ntype NotificationCounterSlot = (typeof notificationCounterSlots)[number];\n\nconst notificationCounterVariantStyles: Record<\n  NotificationCounterVariant,\n  Record<NotificationCounterSlot, SystemStyleObject>\n> = {\n  blue: {\n    root: {\n      bgColor: 'background.accent',\n      color: 'text.contrast',\n    },\n    maxElement: {\n      bgColor: 'text.contrast',\n    },\n  },\n  green: {\n    root: {\n      bgColor: 'background.success.contrast',\n      color: 'text.contrast',\n    },\n    maxElement: {\n      bgColor: 'text.contrast',\n    },\n  },\n  neutral: {\n    root: {\n      bgColor: 'background.subtle.less',\n      color: 'text',\n    },\n    maxElement: {\n      bgColor: 'text',\n    },\n  },\n  red: {\n    root: {\n      bgColor: 'background.danger.contrast',\n      color: 'text.contrast',\n    },\n    maxElement: {\n      bgColor: 'text.contrast',\n    },\n  },\n};\n\nconst notificationCounterSizeStyles: Record<\n  NotificationCounterSize,\n  Record<NotificationCounterSlot, SystemStyleObject>\n> = {\n  xs: {\n    root: {\n      fontSize: '8px',\n      height: 3,\n      width: 3,\n    },\n    maxElement: {\n      height: '1px',\n      width: '1px',\n    },\n  },\n  sm: {\n    root: { fontSize: '10px', height: 4, width: 4 },\n    maxElement: {\n      height: '2px',\n      width: '2px',\n    },\n  },\n  md: {\n    root: {\n      fontSize: 'xs',\n      height: 5,\n      width: 5,\n    },\n    maxElement: {\n      height: '3px',\n      width: '3px',\n    },\n  },\n  lg: {\n    root: {\n      fontSize: 'sm',\n      height: 6,\n      width: 6,\n    },\n    maxElement: {\n      height: 1,\n      width: 1,\n    },\n  },\n};\n\nexport const notificationCounterRecipe = defineSlotRecipe({\n  slots: notificationCounterSlots,\n  base: {\n    root: {\n      alignItems: 'center',\n      border: '1px',\n      borderColor: 'background',\n      borderRadius: 'full',\n      fontWeight: 'semibold',\n      justifyContent: 'center',\n    },\n    maxElement: {\n      borderRadius: 'full',\n    },\n  },\n  variants: {\n    size: notificationCounterSizeStyles,\n    variant: notificationCounterVariantStyles,\n  },\n  defaultVariants: {\n    size: 'md',\n    variant: 'red',\n  },\n});\n","import { SpinnerSize } from 'components/Spinner/spinner.types';\nimport { NotificationCounterSize, NotificationCounterVariant } from './notificationCounter.types';\nimport { TypographyVariant } from 'shared/types';\n\nexport const MAX_COUNT = 99;\n\nexport const notificationCounterSpinnerSize: Record<NotificationCounterSize, SpinnerSize | null> = {\n  xs: null, // The xs size doesn't show a spinner\n  sm: 'xs',\n  md: 'xs',\n  lg: 'sm',\n};\n\nexport const spinnerVariantToNotificationCounterVariant: Record<NotificationCounterVariant, TypographyVariant> = {\n  red: 'dangerOnContrast',\n  blue: 'interactiveOnContrast',\n  green: 'brandOnContrast',\n  neutral: 'subtleOnContrast',\n};\n","import React, { useMemo } from 'react';\nimport { Flex, FlexProps } from '@chakra-ui/react/flex';\nimport { NotificationCounterSize, NotificationCounterVariant } from './notificationCounter.types';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { notificationCounterRecipe } from './notificationCounter.recipe';\nimport {\n  MAX_COUNT,\n  notificationCounterSpinnerSize,\n  spinnerVariantToNotificationCounterVariant,\n} from './notificationCounter.records';\nimport { Spinner } from 'components/Spinner/spinner.component';\nimport { Box } from '@chakra-ui/react/box';\n\nexport interface NotificationCounterProps extends FlexProps {\n  /** Value of the notification counter. If count is greater than 99, the count will be hidden and a special indicator will take its place. */\n  count?: number;\n  /** If true, the notification counter will show a spinner.\n   * @default false\n   */\n  loading?: boolean;\n  /** Whether or not to show the counter label. If the size is xs, by default the count label won't be shown.\n   * @default true\n   */\n  showCount?: boolean;\n  /** Size of the notification counter\n   * @default md\n   */\n  size?: NotificationCounterSize;\n  /** Color variant for the notification counter\n   * @default red\n   */\n  variant?: NotificationCounterVariant;\n  /** Data test id for the notification counter.\n   * @default kibble-notification-counter\n   */\n  'data-testid'?: string;\n}\n\nexport const NotificationCounter = ({\n  count,\n  loading = false,\n  showCount = true,\n  size = 'md',\n  variant = 'red',\n  ['data-testid']: dataTestId = 'kibble-notification-counter',\n  ...rest\n}: NotificationCounterProps): React.JSX.Element => {\n  const recipe = useSlotRecipe({ recipe: notificationCounterRecipe });\n  const styles = recipe({ size, variant });\n  const shouldShowCount = size !== 'xs' && showCount;\n\n  const counterContent = useMemo(() => {\n    const _spinnerSize = notificationCounterSpinnerSize[size];\n    const _spinnerVariant = spinnerVariantToNotificationCounterVariant[variant];\n\n    if (loading && !!_spinnerSize) return <Spinner variant={_spinnerVariant} size={_spinnerSize} />;\n\n    if (count == null) return null; // Handle undefined or null count\n\n    if (count > MAX_COUNT) return <Box css={styles.maxElement} />;\n\n    return count;\n  }, [size, variant, loading, count, styles.maxElement]);\n\n  return (\n    <Flex className=\"NotificationCounter\" data-testid={dataTestId} css={styles.root} {...rest}>\n      {shouldShowCount && counterContent}\n    </Flex>\n  );\n};\n"],"names":["notificationCounterSlots","notificationCounterVariantStyles","notificationCounterSizeStyles","notificationCounterRecipe","defineSlotRecipe","MAX_COUNT","notificationCounterSpinnerSize","spinnerVariantToNotificationCounterVariant","NotificationCounter","count","loading","showCount","size","variant","dataTestId","rest","styles","useSlotRecipe","shouldShowCount","counterContent","useMemo","_spinnerSize","_spinnerVariant","Spinner","Box","jsx","Flex"],"mappings":"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"}