@televet/kibble-ui 5.0.21-alpha.hunter.9 → 5.0.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (128) hide show
  1. package/dist/chunks/{alert.types-C6EN46Ra.js → alert.component-OcRbeRJa.js} +37 -38
  2. package/dist/chunks/alert.component-OcRbeRJa.js.map +1 -0
  3. package/dist/chunks/{alert.types-BlvzpzTn.js → alert.component-nhRTQ5KK.js} +2 -2
  4. package/dist/chunks/alert.component-nhRTQ5KK.js.map +1 -0
  5. package/dist/chunks/alert.types-8mtsdXr4.js +2 -0
  6. package/dist/chunks/alert.types-8mtsdXr4.js.map +1 -0
  7. package/dist/chunks/alert.types-CPfg5SeM.js +5 -0
  8. package/dist/chunks/alert.types-CPfg5SeM.js.map +1 -0
  9. package/dist/chunks/{avatarGroup.component-M84HNv2O.js → avatarGroup.component-BPhQpVYM.js} +2 -2
  10. package/dist/chunks/{avatarGroup.component-M84HNv2O.js.map → avatarGroup.component-BPhQpVYM.js.map} +1 -1
  11. package/dist/chunks/{buttonGroup.component-HKh7TJ0v.js → buttonGroup.component-CO5lC36l.js} +2 -2
  12. package/dist/chunks/{buttonGroup.component-HKh7TJ0v.js.map → buttonGroup.component-CO5lC36l.js.map} +1 -1
  13. package/dist/chunks/{calendar.component-UUc8d3QQ.js → calendar.component-CegJR9ey.js} +2 -2
  14. package/dist/chunks/{calendar.component-UUc8d3QQ.js.map → calendar.component-CegJR9ey.js.map} +1 -1
  15. package/dist/chunks/{conversationCard.component-HYxRoILR.js → conversationCard.component-DByFo4jj.js} +3 -3
  16. package/dist/chunks/{conversationCard.component-HYxRoILR.js.map → conversationCard.component-DByFo4jj.js.map} +1 -1
  17. package/dist/chunks/{datePicker.component-Dq2vL7Mk.js → datePicker.component-CLTjEX7i.js} +2 -2
  18. package/dist/chunks/{datePicker.component-Dq2vL7Mk.js.map → datePicker.component-CLTjEX7i.js.map} +1 -1
  19. package/dist/chunks/{datePicker.provider-CavuOZl4.js → datePicker.provider-CttuPiiS.js} +2 -2
  20. package/dist/chunks/{datePicker.provider-CavuOZl4.js.map → datePicker.provider-CttuPiiS.js.map} +1 -1
  21. package/dist/chunks/dateTimePicker.component-BlWhC5aT.js +2 -0
  22. package/dist/chunks/{dateTimePicker.component-BF2pZ_Rn.js.map → dateTimePicker.component-BlWhC5aT.js.map} +1 -1
  23. package/dist/chunks/dateTimePicker.component-CLAI_Q6e.js +317 -0
  24. package/dist/chunks/dateTimePicker.component-CLAI_Q6e.js.map +1 -0
  25. package/dist/chunks/{icons-CoSqruIn.js → icons-CEVtpQAi.js} +3 -3
  26. package/dist/chunks/{icons-CoSqruIn.js.map → icons-CEVtpQAi.js.map} +1 -1
  27. package/dist/chunks/maintenanceBanner.types-BsNjAlXa.js +2 -0
  28. package/dist/chunks/maintenanceBanner.types-BsNjAlXa.js.map +1 -0
  29. package/dist/chunks/maintenanceBanner.types-DerZF_8G.js +31 -0
  30. package/dist/chunks/maintenanceBanner.types-DerZF_8G.js.map +1 -0
  31. package/dist/chunks/{menu.component-CV8eVKYt.js → menu.component-WHzMw5ZI.js} +2 -2
  32. package/dist/chunks/{menu.component-CV8eVKYt.js.map → menu.component-WHzMw5ZI.js.map} +1 -1
  33. package/dist/chunks/{numberInput.component-V6NQs14b.js → numberInput.component-CRDRjrTH.js} +2 -2
  34. package/dist/chunks/{numberInput.component-V6NQs14b.js.map → numberInput.component-CRDRjrTH.js.map} +1 -1
  35. package/dist/chunks/{radioGroup.types-BVbxeB22.js → radioGroup.types-DzSpA07h.js} +2 -2
  36. package/dist/chunks/{radioGroup.types-BVbxeB22.js.map → radioGroup.types-DzSpA07h.js.map} +1 -1
  37. package/dist/chunks/{rating-group-DRCWuE5-.js → rating-group-vxglWdry.js} +2 -2
  38. package/dist/chunks/{rating-group-DRCWuE5-.js.map → rating-group-vxglWdry.js.map} +1 -1
  39. package/dist/chunks/{rating.component-DeJY9G94.js → rating.component-BWBPSEEk.js} +2 -2
  40. package/dist/chunks/{rating.component-DeJY9G94.js.map → rating.component-BWBPSEEk.js.map} +1 -1
  41. package/dist/chunks/{select.component-CIjEq1os.js → select.component-DckP-f8y.js} +43 -43
  42. package/dist/chunks/{select.component-CIjEq1os.js.map → select.component-DckP-f8y.js.map} +1 -1
  43. package/dist/chunks/{tag.component-B7V76XfM.js → tag.component-CMsZIhN-.js} +5 -5
  44. package/dist/chunks/{tag.component-B7V76XfM.js.map → tag.component-CMsZIhN-.js.map} +1 -1
  45. package/dist/chunks/{tagBlock.component-R4FY7ytN.js → tagBlock.component-CT7_RyJ-.js} +3 -3
  46. package/dist/chunks/{tagBlock.component-R4FY7ytN.js.map → tagBlock.component-CT7_RyJ-.js.map} +1 -1
  47. package/dist/chunks/{theme.provider-CvuSdLO6.js → theme.provider-BYXTygyb.js} +2 -2
  48. package/dist/chunks/{theme.provider-CvuSdLO6.js.map → theme.provider-BYXTygyb.js.map} +1 -1
  49. package/dist/chunks/timePicker.component-BCMX6aqb.js +220 -0
  50. package/dist/chunks/timePicker.component-BCMX6aqb.js.map +1 -0
  51. package/dist/chunks/timePicker.component-D5hw80VV.js +2 -0
  52. package/dist/chunks/timePicker.component-D5hw80VV.js.map +1 -0
  53. package/dist/chunks/{timeRange.component-9v9d8kQw.js → timeRange.component-BZHpZeAX.js} +2 -2
  54. package/dist/chunks/{timeRange.component-9v9d8kQw.js.map → timeRange.component-BZHpZeAX.js.map} +1 -1
  55. package/dist/chunks/{timeRange.component-D3aPwElS.js → timeRange.component-D3Db8lvh.js} +2 -2
  56. package/dist/chunks/{timeRange.component-D3aPwElS.js.map → timeRange.component-D3Db8lvh.js.map} +1 -1
  57. package/dist/cjs/components/Alert/index.cjs +1 -1
  58. package/dist/cjs/components/DateTimePicker/index.cjs +1 -1
  59. package/dist/cjs/components/Icon/generated/index.cjs +1 -1
  60. package/dist/cjs/components/Icon/generated/index.cjs.map +1 -1
  61. package/dist/cjs/components/MaintenanceBanner/index.cjs +2 -0
  62. package/dist/cjs/components/MaintenanceBanner/index.cjs.map +1 -0
  63. package/dist/cjs/components/TimePicker/index.cjs +1 -1
  64. package/dist/cjs/components/TimeRange/index.cjs +1 -1
  65. package/dist/cjs/components/index.cjs +1 -1
  66. package/dist/cjs/index.cjs +1 -1
  67. package/dist/cjs/theme/tokens/colors/index.cjs +1 -1
  68. package/dist/cjs/theme/tokens/colors/index.cjs.map +1 -1
  69. package/dist/esm/chakra/index.js +2 -2
  70. package/dist/esm/components/Alert/index.js +4 -3
  71. package/dist/esm/components/Alert/index.js.map +1 -1
  72. package/dist/esm/components/AvatarGroup/index.js +1 -1
  73. package/dist/esm/components/ButtonGroup/index.js +1 -1
  74. package/dist/esm/components/Calendar/index.js +1 -1
  75. package/dist/esm/components/ConversationCard/index.js +1 -1
  76. package/dist/esm/components/DatePicker/index.js +2 -2
  77. package/dist/esm/components/DateTimePicker/index.js +1 -1
  78. package/dist/esm/components/Icon/generated/index.js +562 -318
  79. package/dist/esm/components/Icon/generated/index.js.map +1 -1
  80. package/dist/esm/components/MaintenanceBanner/index.js +6 -0
  81. package/dist/esm/components/MaintenanceBanner/index.js.map +1 -0
  82. package/dist/esm/components/Menu/index.js +1 -1
  83. package/dist/esm/components/NumberInput/index.js +1 -1
  84. package/dist/esm/components/RadioGroup/index.js +1 -1
  85. package/dist/esm/components/Rating/index.js +1 -1
  86. package/dist/esm/components/Select/index.js +1 -1
  87. package/dist/esm/components/Tag/index.js +1 -1
  88. package/dist/esm/components/TagBlock/index.js +1 -1
  89. package/dist/esm/components/TimePicker/index.js +1 -1
  90. package/dist/esm/components/TimeRange/index.js +1 -1
  91. package/dist/esm/components/index.js +134 -130
  92. package/dist/esm/components/index.js.map +1 -1
  93. package/dist/esm/index.js +157 -153
  94. package/dist/esm/index.js.map +1 -1
  95. package/dist/esm/theme/index.js +1 -1
  96. package/dist/esm/theme/tokens/colors/index.js +10 -10
  97. package/dist/esm/theme/tokens/colors/index.js.map +1 -1
  98. package/dist/types/components/DateTimePicker/components/DateTimePickerCustomView/dateTimePickerCustomView.component.d.ts +1 -2
  99. package/dist/types/components/DateTimePicker/components/DateTimePickerRangeSelector/dateTimePickerRangeSelector.component.d.ts +1 -2
  100. package/dist/types/components/DateTimePicker/dateTimePicker.component.d.ts +1 -6
  101. package/dist/types/components/Icon/generated/BarcodeReader.d.ts +10 -0
  102. package/dist/types/components/Icon/generated/Battery.d.ts +10 -0
  103. package/dist/types/components/Icon/generated/BatteryCharging.d.ts +10 -0
  104. package/dist/types/components/Icon/generated/BatteryFull.d.ts +10 -0
  105. package/dist/types/components/Icon/generated/BatteryLow.d.ts +10 -0
  106. package/dist/types/components/Icon/generated/Connect.d.ts +10 -0
  107. package/dist/types/components/Icon/generated/MagicPen.d.ts +10 -0
  108. package/dist/types/components/Icon/generated/Wifi.d.ts +10 -0
  109. package/dist/types/components/Icon/generated/WifiOff.d.ts +10 -0
  110. package/dist/types/components/Icon/generated/WifiWarning.d.ts +10 -0
  111. package/dist/types/components/Icon/generated/Workflows.d.ts +10 -0
  112. package/dist/types/components/Icon/generated/index.d.ts +1 -1
  113. package/dist/types/components/MaintenanceBanner/index.d.ts +2 -0
  114. package/dist/types/components/MaintenanceBanner/maintenanceBanner.component.d.ts +22 -0
  115. package/dist/types/components/MaintenanceBanner/maintenanceBanner.types.d.ts +4 -0
  116. package/dist/types/components/TimePicker/timePicker.component.d.ts +1 -2
  117. package/dist/types/components/index.d.ts +1 -0
  118. package/package.json +14 -16
  119. package/dist/chunks/alert.types-BlvzpzTn.js.map +0 -1
  120. package/dist/chunks/alert.types-C6EN46Ra.js.map +0 -1
  121. package/dist/chunks/dateTimePicker.component-BF2pZ_Rn.js +0 -2
  122. package/dist/chunks/dateTimePicker.component-yelD1jlj.js +0 -331
  123. package/dist/chunks/dateTimePicker.component-yelD1jlj.js.map +0 -1
  124. package/dist/chunks/timePicker.component-DBjjLiQi.js +0 -232
  125. package/dist/chunks/timePicker.component-DBjjLiQi.js.map +0 -1
  126. package/dist/chunks/timePicker.component-xjn9FtR7.js +0 -2
  127. package/dist/chunks/timePicker.component-xjn9FtR7.js.map +0 -1
  128. package/dist/types/shared/utils/localToClinicTimezone.d.ts +0 -5
@@ -1,7 +1,7 @@
1
1
  import { j as e } from "./jsx-runtime-C5mzlN2N.js";
2
2
  import { forwardRef as x } from "react";
3
3
  import { c as T } from "./create-slot-recipe-context-D_FXDJGp.js";
4
- import { C as b } from "./icons-CoSqruIn.js";
4
+ import { a as b } from "./icons-CEVtpQAi.js";
5
5
  const {
6
6
  withProvider: f,
7
7
  withContext: r
@@ -21,7 +21,7 @@ const n = {
21
21
  sm: 0,
22
22
  md: 0.5,
23
23
  lg: 1
24
- }, C = x(
24
+ }, w = x(
25
25
  ({
26
26
  leftElement: s,
27
27
  rightElement: g,
@@ -77,8 +77,8 @@ const n = {
77
77
  );
78
78
  }
79
79
  );
80
- C.displayName = "Tag";
80
+ w.displayName = "Tag";
81
81
  export {
82
- C as T
82
+ w as T
83
83
  };
84
- //# sourceMappingURL=tag.component-B7V76XfM.js.map
84
+ //# sourceMappingURL=tag.component-CMsZIhN-.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tag.component-B7V76XfM.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/tag/tag.js","../../src/components/Tag/tag.records.ts","../../src/components/Tag/tag.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\nimport { CloseIcon } from '../icons.js';\n\nconst {\n withProvider,\n withContext,\n useStyles: useTagStyles,\n PropsProvider\n} = createSlotRecipeContext({ key: \"tag\" });\nconst TagRoot = withProvider(\n \"div\",\n \"root\"\n);\nconst TagRootPropsProvider = PropsProvider;\nconst TagLabel = withContext(\n \"span\",\n \"label\"\n);\nconst TagCloseTrigger = withContext(\"button\", \"closeTrigger\", { defaultProps: { children: /* @__PURE__ */ jsx(CloseIcon, {}) } });\nconst TagStartElement = withContext(\"span\", \"startElement\");\nconst TagEndElement = withContext(\n \"span\",\n \"endElement\"\n);\n\nexport { TagCloseTrigger, TagEndElement, TagLabel, TagRoot, TagRootPropsProvider, TagStartElement, useTagStyles };\n","import { TagSize } from './tag.types';\n\nexport const tagPaddingBySize: Record<TagSize, number> = {\n sm: 0,\n md: 0.5,\n lg: 1,\n};\n","import React, { forwardRef } from 'react';\nimport { Tag as CTag } from '@chakra-ui/react/tag';\nimport { CloseButtonDisplay, TagSize } from './tag.types';\nimport { Status } from 'shared/types/status';\nimport { tagPaddingBySize } from './tag.records';\n\nexport interface BaseTagProps extends Omit<CTag.RootProps, 'children'> {\n /** Left element for the tag, typically used for icons. */\n leftElement?: React.ReactNode;\n /** Right element for the tag, typically used for icons. */\n rightElement?: React.ReactNode;\n /** The text content of the tag. */\n label: string;\n /**\n * The display behavior of the close button.\n * @default never\n */\n closeButtonDisplay?: CloseButtonDisplay;\n /**\n * The size of the tag.\n * @default md\n */\n size?: TagSize;\n /** Callback function triggered when the close button is clicked. This is only applicable when `closeButtonDisplay` is set to 'always' or 'hover'. */\n onClose?: React.MouseEventHandler<HTMLButtonElement>;\n /**\n * The color variant of the tag. This determines the background and text color.\n * @default default\n */\n variant?: Status;\n /**\n * Data test id for the tag.\n * @default kibble-tag\n */\n 'data-testid'?: string;\n}\n\ninterface ClosableTagProps extends BaseTagProps {\n /**\n * The display behavior of the close button.\n * @default never\n */\n closeButtonDisplay: 'always' | 'hover';\n /** Callback function triggered when the close button is clicked. This is only applicable when `closeButtonDisplay` is set to always or hover. */\n onClose: React.MouseEventHandler<HTMLButtonElement>;\n}\n\ninterface NonClosableTagProps extends BaseTagProps {\n /**\n * The display behavior of the close button.\n * @default never\n */\n closeButtonDisplay?: 'never';\n /** Callback function triggered when the close button is clicked. This is only applicable when `closeButtonDisplay` is set to always or hover. */\n onClose?: never;\n}\n\nexport type TagProps = ClosableTagProps | NonClosableTagProps;\n\nexport const Tag = forwardRef<HTMLSpanElement, TagProps>(\n (\n {\n leftElement,\n rightElement,\n onClose,\n label,\n closeButtonDisplay = 'never',\n size = 'md',\n variant = 'default',\n ['data-testid']: dataTestId = 'kibble-tag',\n ...rest\n },\n ref,\n ): React.JSX.Element => {\n const closable = !!onClose && closeButtonDisplay !== 'never';\n\n return (\n <CTag.Root\n className=\"Tag group\"\n data-testid={dataTestId}\n ref={ref}\n variant={variant}\n size={size}\n closeButtonDisplay={closeButtonDisplay}\n {...(closable &&\n closeButtonDisplay === 'always' && {\n pr: tagPaddingBySize[size],\n })}\n {...rest}\n >\n {leftElement}\n <CTag.Label\n className=\"Tag__Label\"\n data-testid={`${dataTestId}-label`}\n overflow=\"hidden\"\n {...(!!leftElement && { ml: 1 })}\n {...(!!rightElement && { mr: 1 })}\n >\n {label}\n </CTag.Label>\n {rightElement}\n {closable && (\n <CTag.CloseTrigger\n className=\"Tag__CloseTrigger\"\n data-testid={`${dataTestId}-close-trigger`}\n onClick={onClose}\n {...(closeButtonDisplay === 'hover' && {\n px: tagPaddingBySize[size],\n })}\n />\n )}\n </CTag.Root>\n );\n },\n);\n\nTag.displayName = 'Tag';\n"],"names":["withProvider","withContext","createSlotRecipeContext","TagRoot","TagLabel","TagCloseTrigger","jsx","CloseIcon","tagPaddingBySize","Tag","forwardRef","leftElement","rightElement","onClose","label","closeButtonDisplay","size","variant","dataTestId","rest","ref","closable","jsxs","CTag.Root","CTag.Label","CTag.CloseTrigger"],"mappings":";;;;AAMA,MAAM;AAAA,EACJ,cAAAA;AAAA,EACA,aAAAC;AAGF,IAAIC,EAAwB,EAAE,KAAK,MAAK,CAAE,GACpCC,IAAUH;AAAA,EACd;AAAA,EACA;AACF,GAEMI,IAAWH;AAAA,EACf;AAAA,EACA;AACF,GACMI,IAAkBJ,EAAY,UAAU,gBAAgB,EAAE,cAAc,EAAE,UAA0BK,gBAAAA,MAAIC,GAAW,CAAE,CAAA,EAAG,EAAA,CAAE;AACxGN,EAAY,QAAQ,cAAc;AACpCA;AAAA,EACpB;AAAA,EACA;AACF;ACxBO,MAAMO,IAA4C;AAAA,EACvD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GCqDaC,IAAMC;AAAA,EACjB,CACE;AAAA,IACE,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,SAAAC;AAAA,IACA,OAAAC;AAAA,IACA,oBAAAC,IAAqB;AAAA,IACrB,MAAAC,IAAO;AAAA,IACP,SAAAC,IAAU;AAAA,IACV,CAAC,gBAAgBC,IAAa;AAAA,IAC9B,GAAGC;AAAA,KAELC,MACsB;AACtB,UAAMC,IAAW,CAAC,CAACR,KAAWE,MAAuB;AAGnD,WAAAO,gBAAAA,EAAA;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,eAAaL;AAAA,QACb,KAAAE;AAAA,QACA,SAAAH;AAAA,QACA,MAAAD;AAAA,QACA,oBAAAD;AAAA,QACC,GAAIM,KACHN,MAAuB,YAAY;AAAA,UACjC,IAAIP,EAAiBQ,CAAI;AAAA,QAC3B;AAAA,QACD,GAAGG;AAAA,QAEH,UAAA;AAAA,UAAAR;AAAA,UACDL,gBAAAA,EAAA;AAAA,YAACkB;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAa,GAAGN,CAAU;AAAA,cAC1B,UAAS;AAAA,cACR,GAAI,CAAC,CAACP,KAAe,EAAE,IAAI,EAAE;AAAA,cAC7B,GAAI,CAAC,CAACC,KAAgB,EAAE,IAAI,EAAE;AAAA,cAE9B,UAAAE;AAAA,YAAA;AAAA,UACH;AAAA,UACCF;AAAA,UACAS,KACCf,gBAAAA,EAAA;AAAA,YAACmB;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAa,GAAGP,CAAU;AAAA,cAC1B,SAASL;AAAA,cACR,GAAIE,MAAuB,WAAW;AAAA,gBACrC,IAAIP,EAAiBQ,CAAI;AAAA,cAAA;AAAA,YAC3B;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ;AAAA,EAAA;AAGN;AAEAP,EAAI,cAAc;","x_google_ignoreList":[0]}
1
+ {"version":3,"file":"tag.component-CMsZIhN-.js","sources":["../../node_modules/@chakra-ui/react/dist/esm/components/tag/tag.js","../../src/components/Tag/tag.records.ts","../../src/components/Tag/tag.component.tsx"],"sourcesContent":["\"use strict\";\n\"use client\";\nimport { jsx } from 'react/jsx-runtime';\nimport { createSlotRecipeContext } from '../../styled-system/create-slot-recipe-context.js';\nimport { CloseIcon } from '../icons.js';\n\nconst {\n withProvider,\n withContext,\n useStyles: useTagStyles,\n PropsProvider\n} = createSlotRecipeContext({ key: \"tag\" });\nconst TagRoot = withProvider(\n \"div\",\n \"root\"\n);\nconst TagRootPropsProvider = PropsProvider;\nconst TagLabel = withContext(\n \"span\",\n \"label\"\n);\nconst TagCloseTrigger = withContext(\"button\", \"closeTrigger\", { defaultProps: { children: /* @__PURE__ */ jsx(CloseIcon, {}) } });\nconst TagStartElement = withContext(\"span\", \"startElement\");\nconst TagEndElement = withContext(\n \"span\",\n \"endElement\"\n);\n\nexport { TagCloseTrigger, TagEndElement, TagLabel, TagRoot, TagRootPropsProvider, TagStartElement, useTagStyles };\n","import { TagSize } from './tag.types';\n\nexport const tagPaddingBySize: Record<TagSize, number> = {\n sm: 0,\n md: 0.5,\n lg: 1,\n};\n","import React, { forwardRef } from 'react';\nimport { Tag as CTag } from '@chakra-ui/react/tag';\nimport { CloseButtonDisplay, TagSize } from './tag.types';\nimport { Status } from 'shared/types/status';\nimport { tagPaddingBySize } from './tag.records';\n\nexport interface BaseTagProps extends Omit<CTag.RootProps, 'children'> {\n /** Left element for the tag, typically used for icons. */\n leftElement?: React.ReactNode;\n /** Right element for the tag, typically used for icons. */\n rightElement?: React.ReactNode;\n /** The text content of the tag. */\n label: string;\n /**\n * The display behavior of the close button.\n * @default never\n */\n closeButtonDisplay?: CloseButtonDisplay;\n /**\n * The size of the tag.\n * @default md\n */\n size?: TagSize;\n /** Callback function triggered when the close button is clicked. This is only applicable when `closeButtonDisplay` is set to 'always' or 'hover'. */\n onClose?: React.MouseEventHandler<HTMLButtonElement>;\n /**\n * The color variant of the tag. This determines the background and text color.\n * @default default\n */\n variant?: Status;\n /**\n * Data test id for the tag.\n * @default kibble-tag\n */\n 'data-testid'?: string;\n}\n\ninterface ClosableTagProps extends BaseTagProps {\n /**\n * The display behavior of the close button.\n * @default never\n */\n closeButtonDisplay: 'always' | 'hover';\n /** Callback function triggered when the close button is clicked. This is only applicable when `closeButtonDisplay` is set to always or hover. */\n onClose: React.MouseEventHandler<HTMLButtonElement>;\n}\n\ninterface NonClosableTagProps extends BaseTagProps {\n /**\n * The display behavior of the close button.\n * @default never\n */\n closeButtonDisplay?: 'never';\n /** Callback function triggered when the close button is clicked. This is only applicable when `closeButtonDisplay` is set to always or hover. */\n onClose?: never;\n}\n\nexport type TagProps = ClosableTagProps | NonClosableTagProps;\n\nexport const Tag = forwardRef<HTMLSpanElement, TagProps>(\n (\n {\n leftElement,\n rightElement,\n onClose,\n label,\n closeButtonDisplay = 'never',\n size = 'md',\n variant = 'default',\n ['data-testid']: dataTestId = 'kibble-tag',\n ...rest\n },\n ref,\n ): React.JSX.Element => {\n const closable = !!onClose && closeButtonDisplay !== 'never';\n\n return (\n <CTag.Root\n className=\"Tag group\"\n data-testid={dataTestId}\n ref={ref}\n variant={variant}\n size={size}\n closeButtonDisplay={closeButtonDisplay}\n {...(closable &&\n closeButtonDisplay === 'always' && {\n pr: tagPaddingBySize[size],\n })}\n {...rest}\n >\n {leftElement}\n <CTag.Label\n className=\"Tag__Label\"\n data-testid={`${dataTestId}-label`}\n overflow=\"hidden\"\n {...(!!leftElement && { ml: 1 })}\n {...(!!rightElement && { mr: 1 })}\n >\n {label}\n </CTag.Label>\n {rightElement}\n {closable && (\n <CTag.CloseTrigger\n className=\"Tag__CloseTrigger\"\n data-testid={`${dataTestId}-close-trigger`}\n onClick={onClose}\n {...(closeButtonDisplay === 'hover' && {\n px: tagPaddingBySize[size],\n })}\n />\n )}\n </CTag.Root>\n );\n },\n);\n\nTag.displayName = 'Tag';\n"],"names":["withProvider","withContext","createSlotRecipeContext","TagRoot","TagLabel","TagCloseTrigger","jsx","CloseIcon","tagPaddingBySize","Tag","forwardRef","leftElement","rightElement","onClose","label","closeButtonDisplay","size","variant","dataTestId","rest","ref","closable","jsxs","CTag.Root","CTag.Label","CTag.CloseTrigger"],"mappings":";;;;AAMA,MAAM;AAAA,EACJ,cAAAA;AAAA,EACA,aAAAC;AAGF,IAAIC,EAAwB,EAAE,KAAK,MAAK,CAAE,GACpCC,IAAUH;AAAA,EACd;AAAA,EACA;AACF,GAEMI,IAAWH;AAAA,EACf;AAAA,EACA;AACF,GACMI,IAAkBJ,EAAY,UAAU,gBAAgB,EAAE,cAAc,EAAE,UAA0BK,gBAAAA,MAAIC,GAAW,CAAE,CAAA,EAAG,EAAA,CAAE;AACxGN,EAAY,QAAQ,cAAc;AACpCA;AAAA,EACpB;AAAA,EACA;AACF;ACxBO,MAAMO,IAA4C;AAAA,EACvD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GCqDaC,IAAMC;AAAA,EACjB,CACE;AAAA,IACE,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,SAAAC;AAAA,IACA,OAAAC;AAAA,IACA,oBAAAC,IAAqB;AAAA,IACrB,MAAAC,IAAO;AAAA,IACP,SAAAC,IAAU;AAAA,IACV,CAAC,gBAAgBC,IAAa;AAAA,IAC9B,GAAGC;AAAA,KAELC,MACsB;AACtB,UAAMC,IAAW,CAAC,CAACR,KAAWE,MAAuB;AAGnD,WAAAO,gBAAAA,EAAA;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,eAAaL;AAAA,QACb,KAAAE;AAAA,QACA,SAAAH;AAAA,QACA,MAAAD;AAAA,QACA,oBAAAD;AAAA,QACC,GAAIM,KACHN,MAAuB,YAAY;AAAA,UACjC,IAAIP,EAAiBQ,CAAI;AAAA,QAC3B;AAAA,QACD,GAAGG;AAAA,QAEH,UAAA;AAAA,UAAAR;AAAA,UACDL,gBAAAA,EAAA;AAAA,YAACkB;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAa,GAAGN,CAAU;AAAA,cAC1B,UAAS;AAAA,cACR,GAAI,CAAC,CAACP,KAAe,EAAE,IAAI,EAAE;AAAA,cAC7B,GAAI,CAAC,CAACC,KAAgB,EAAE,IAAI,EAAE;AAAA,cAE9B,UAAAE;AAAA,YAAA;AAAA,UACH;AAAA,UACCF;AAAA,UACAS,KACCf,gBAAAA,EAAA;AAAA,YAACmB;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAa,GAAGP,CAAU;AAAA,cAC1B,SAASL;AAAA,cACR,GAAIE,MAAuB,WAAW;AAAA,gBACrC,IAAIP,EAAiBQ,CAAI;AAAA,cAAA;AAAA,YAC3B;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ;AAAA,EAAA;AAGN;AAEAP,EAAI,cAAc;","x_google_ignoreList":[0]}
@@ -3,9 +3,9 @@ import v, { useCallback as g } from "react";
3
3
  import { B as s } from "./index-9BerxEcw.js";
4
4
  import { B as j } from "./button.component-BO6oee_V.js";
5
5
  import { W as w } from "./heading.component-CpSAN3cv.js";
6
- import { M as W } from "./menu.component-CV8eVKYt.js";
6
+ import { M as W } from "./menu.component-WHzMw5ZI.js";
7
7
  import { S as $ } from "./spinner.component-CNHQ8UDz.js";
8
- import { T as y } from "./tag.component-B7V76XfM.js";
8
+ import { T as y } from "./tag.component-CMsZIhN-.js";
9
9
  import { W as B } from "./text.component-DhuUgP3j.js";
10
10
  import { F as i } from "./flex-CX-8gE9T.js";
11
11
  import { H as T } from "./h-stack-8q5nAOg0.js";
@@ -167,4 +167,4 @@ export {
167
167
  G as T,
168
168
  d as a
169
169
  };
170
- //# sourceMappingURL=tagBlock.component-R4FY7ytN.js.map
170
+ //# sourceMappingURL=tagBlock.component-CT7_RyJ-.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tagBlock.component-R4FY7ytN.js","sources":["../../src/components/TagBlock/tagBlock.types.ts","../../src/components/TagBlock/tagBlock.component.tsx"],"sourcesContent":["export enum TagDisabledState {\n Inactive = 'Inactive',\n Deleted = 'Deleted',\n}\n\nexport interface TagBlockTag {\n label: string;\n value: string;\n groupLabel?: string;\n}\n","import React, { useCallback } from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Button } from 'components/Button/button.component';\nimport { Heading } from 'components/Heading/heading.component';\nimport { Menu, MenuProps } from 'components/Menu/menu.component';\nimport { Spinner } from 'components/Spinner/spinner.component';\nimport { Tag } from 'components/Tag/tag.component';\nimport { Text } from 'components/Text/text.component';\nimport { TagBlockTag, TagDisabledState } from './tagBlock.types';\nimport { MenuButtonProps } from 'components/Menu/components/MenuButton/menuButton.component';\n\ninterface BaseTagBlockProps {\n /**\n * If true, tags will be grouped by the `groupName` property of the tag object. If false, tags will be displayed in a single group.\n * @default false\n */\n displayTagsInGroups?: boolean;\n /**\n * The error message to be displayed if the `hasError` prop is set to true.\n * @default This field contains an error\n */\n errorText?: string;\n /**\n * If true, the tag block will show an error message and have error styling. You can customize the error message with the `errorText` prop.\n * @default false\n */\n hasError?: boolean;\n /**\n * If true, a loading spinner will cover the tag block preventing users from making further selections.\n * @default false\n */\n loading?: boolean;\n /** Configuration for the Menu component. See `Menu` stories for more information. */\n menuProps?: MenuProps;\n /** Callback function fired when user clicks the clear all button which unselects all items in the menu and removes all tags from the tag block. */\n onClearAll?: () => void;\n /** Callback function fired when user clicks the close button on an individual tag to remove the tag from the tag block. Args include the tag id of the deleted tag and an array of the remaining selected tags. */\n onRemoveTag?: (tag: string, selectedTags: TagBlockTag[]) => void;\n /** The selected items to be shown as tags in the tag block. */\n tags: TagBlockTag[];\n /** The title of the tag block, if provided, will be shown next to the add new menu button. */\n title?: string;\n /** Data test id for the tag block. */\n 'data-testid'?: string;\n}\n\ninterface DefaultTagBlockProps extends BaseTagBlockProps {\n /**\n * If true, a delete button will be shown so that the block can be removed. If set to true the `handleDelete` prop should also be specified.\n * @default false\n */\n canBeDeleted?: false;\n /** Function passed to be called when clicking the delete button on the tag block. Only relevant if the `canBeDeleted` prop is true. */\n onDelete?: never;\n}\n\ninterface DeletableTagBlockProps extends BaseTagBlockProps {\n /**\n * If true, a delete button will be shown so that the block can be removed. If set to true the `handleDelete` prop should also be specified.\n * @default false\n */\n canBeDeleted: true;\n /** Function passed to be called when clicking the delete button on the tag block. Only relevant if the `canBeDeleted` prop is true. */\n onDelete: () => void;\n}\n\nexport type TagBlockProps = DefaultTagBlockProps | DeletableTagBlockProps;\n\nconst defaultMenuButtonProps: MenuButtonProps = {\n size: 'sm',\n variant: 'secondarySubtle',\n iconName: 'plus',\n text: 'Add',\n hideCaret: true,\n};\n\nexport const TagBlock = ({\n title,\n menuProps,\n tags,\n canBeDeleted = false,\n onClearAll,\n onRemoveTag,\n onDelete,\n hasError = false,\n errorText = 'This field contains an error',\n displayTagsInGroups,\n loading = false,\n ['data-testid']: dataTestId = 'kibble-tag-block',\n}: TagBlockProps): React.JSX.Element => {\n const handleRemoveTag = useCallback(\n (value: string): void => {\n if (onRemoveTag) {\n onRemoveTag(value, tags);\n }\n },\n [onRemoveTag, tags],\n );\n\n const tagsByGroup = React.useMemo(() => {\n if (!displayTagsInGroups) {\n return [];\n }\n const grouped = {} as Record<string, TagBlockTag[]>;\n for (const tag of tags) {\n const group = tag.groupLabel || '-';\n if (!grouped[group]) {\n grouped[group] = [];\n }\n grouped[group].push(tag);\n }\n return Object.entries(grouped).map(([groupLabel, tags]) => ({\n groupLabel,\n tags,\n }));\n }, [tags, displayTagsInGroups]);\n\n const renderTags = useCallback(\n (tags: TagBlockTag[]) => {\n return tags.map((tag) => {\n const isDisabled =\n tag.label.includes(TagDisabledState.Inactive) || tag.label.includes(TagDisabledState.Deleted);\n\n return (\n <Tag\n className=\"TagBlock__Tag\"\n data-testid={`${dataTestId}-tag`}\n mr={1}\n mb={1}\n key={tag.value}\n label={tag.label}\n onClose={(): void => handleRemoveTag(tag.value)}\n closeButtonDisplay=\"always\"\n fontWeight=\"normal\"\n color={isDisabled ? 'text.placeholder' : 'text'}\n size=\"md\"\n />\n );\n });\n },\n [handleRemoveTag, dataTestId],\n );\n\n return (\n <Box\n className=\"TagBlock\"\n data-testid={dataTestId}\n position=\"relative\"\n mb={3}\n py={2}\n pl={4}\n pr={2}\n bg=\"background.subtle\"\n borderRadius=\"lg\"\n boxShadow={hasError ? `0 0 0 2px var(--chakra-colors-border-danger)` : ''}\n border=\"1px\"\n borderColor=\"border\"\n overflow={loading ? 'hidden' : undefined}\n >\n <Flex\n className=\"TagBlock__ButtonContainer\"\n data-testid={`${dataTestId}-button-container`}\n justifyContent=\"space-between\"\n >\n <HStack gap={1} minH={10}>\n {title && (\n <Text className=\"TagBlock__Title\" mr={2} fontWeight=\"bold\">\n {title}\n </Text>\n )}\n <Menu\n data-testid={`${dataTestId}-menu`}\n {...menuProps}\n buttonProps={menuProps?.buttonProps || defaultMenuButtonProps}\n />\n <Button\n className=\"TagBlock__Button--ClearAll\"\n data-testid={`${dataTestId}-clear-all-button`}\n size=\"sm\"\n iconName=\"arrowCircle\"\n variant=\"ghostNeutral\"\n onClick={onClearAll}\n disabled={tags.length <= 0}\n >\n Clear All\n </Button>\n </HStack>\n {canBeDeleted && (\n <Box>\n <Button\n className=\"TagBlock__Button--Delete\"\n data-testid={`${dataTestId}-delete-button`}\n iconName=\"trashcan\"\n variant=\"ghostNeutral\"\n onClick={onDelete}\n justifySelf=\"flex-end\"\n />\n </Box>\n )}\n </Flex>\n {Boolean(tags.length) && (\n <Flex\n className=\"TagBlock__TagContainer\"\n data-testid={`${dataTestId}-tag-container`}\n mt={2}\n pb={1}\n alignContent=\"space-between\"\n flexWrap=\"wrap\"\n justifyContent=\"flex-start\"\n alignItems=\"flex-start\"\n >\n {displayTagsInGroups && tagsByGroup.length ? (\n <Flex direction=\"column\">\n {tagsByGroup.map(({ groupLabel, tags }) => (\n <Box key={groupLabel} mb={2}>\n <Box className=\"TagBlock__GroupTitle\" data-testid={`${dataTestId}-group-title`}>\n <Heading size=\"xs\" pb={2}>\n {groupLabel}\n </Heading>\n </Box>\n <Flex\n alignContent=\"space-between\"\n flexWrap=\"wrap\"\n justifyContent=\"flex-start\"\n alignItems=\"flex-start\"\n >\n {renderTags(tags)}\n </Flex>\n </Box>\n ))}\n </Flex>\n ) : (\n renderTags(tags)\n )}\n </Flex>\n )}\n {loading && <Spinner fullScreen />}\n {hasError && (\n <Text className=\"TagBlock__Error\" data-testid={`${dataTestId}-error`} mt={2} size=\"xs\" variant=\"danger\">\n {errorText}\n </Text>\n )}\n </Box>\n );\n};\n"],"names":["TagDisabledState","defaultMenuButtonProps","TagBlock","title","menuProps","tags","canBeDeleted","onClearAll","onRemoveTag","onDelete","hasError","errorText","displayTagsInGroups","loading","dataTestId","handleRemoveTag","useCallback","value","tagsByGroup","React","grouped","tag","group","groupLabel","renderTags","isDisabled","jsx","Tag","jsxs","Box","Flex","HStack","Text","Menu","Button","Heading","Spinner"],"mappings":"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"}
1
+ {"version":3,"file":"tagBlock.component-CT7_RyJ-.js","sources":["../../src/components/TagBlock/tagBlock.types.ts","../../src/components/TagBlock/tagBlock.component.tsx"],"sourcesContent":["export enum TagDisabledState {\n Inactive = 'Inactive',\n Deleted = 'Deleted',\n}\n\nexport interface TagBlockTag {\n label: string;\n value: string;\n groupLabel?: string;\n}\n","import React, { useCallback } from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Button } from 'components/Button/button.component';\nimport { Heading } from 'components/Heading/heading.component';\nimport { Menu, MenuProps } from 'components/Menu/menu.component';\nimport { Spinner } from 'components/Spinner/spinner.component';\nimport { Tag } from 'components/Tag/tag.component';\nimport { Text } from 'components/Text/text.component';\nimport { TagBlockTag, TagDisabledState } from './tagBlock.types';\nimport { MenuButtonProps } from 'components/Menu/components/MenuButton/menuButton.component';\n\ninterface BaseTagBlockProps {\n /**\n * If true, tags will be grouped by the `groupName` property of the tag object. If false, tags will be displayed in a single group.\n * @default false\n */\n displayTagsInGroups?: boolean;\n /**\n * The error message to be displayed if the `hasError` prop is set to true.\n * @default This field contains an error\n */\n errorText?: string;\n /**\n * If true, the tag block will show an error message and have error styling. You can customize the error message with the `errorText` prop.\n * @default false\n */\n hasError?: boolean;\n /**\n * If true, a loading spinner will cover the tag block preventing users from making further selections.\n * @default false\n */\n loading?: boolean;\n /** Configuration for the Menu component. See `Menu` stories for more information. */\n menuProps?: MenuProps;\n /** Callback function fired when user clicks the clear all button which unselects all items in the menu and removes all tags from the tag block. */\n onClearAll?: () => void;\n /** Callback function fired when user clicks the close button on an individual tag to remove the tag from the tag block. Args include the tag id of the deleted tag and an array of the remaining selected tags. */\n onRemoveTag?: (tag: string, selectedTags: TagBlockTag[]) => void;\n /** The selected items to be shown as tags in the tag block. */\n tags: TagBlockTag[];\n /** The title of the tag block, if provided, will be shown next to the add new menu button. */\n title?: string;\n /** Data test id for the tag block. */\n 'data-testid'?: string;\n}\n\ninterface DefaultTagBlockProps extends BaseTagBlockProps {\n /**\n * If true, a delete button will be shown so that the block can be removed. If set to true the `handleDelete` prop should also be specified.\n * @default false\n */\n canBeDeleted?: false;\n /** Function passed to be called when clicking the delete button on the tag block. Only relevant if the `canBeDeleted` prop is true. */\n onDelete?: never;\n}\n\ninterface DeletableTagBlockProps extends BaseTagBlockProps {\n /**\n * If true, a delete button will be shown so that the block can be removed. If set to true the `handleDelete` prop should also be specified.\n * @default false\n */\n canBeDeleted: true;\n /** Function passed to be called when clicking the delete button on the tag block. Only relevant if the `canBeDeleted` prop is true. */\n onDelete: () => void;\n}\n\nexport type TagBlockProps = DefaultTagBlockProps | DeletableTagBlockProps;\n\nconst defaultMenuButtonProps: MenuButtonProps = {\n size: 'sm',\n variant: 'secondarySubtle',\n iconName: 'plus',\n text: 'Add',\n hideCaret: true,\n};\n\nexport const TagBlock = ({\n title,\n menuProps,\n tags,\n canBeDeleted = false,\n onClearAll,\n onRemoveTag,\n onDelete,\n hasError = false,\n errorText = 'This field contains an error',\n displayTagsInGroups,\n loading = false,\n ['data-testid']: dataTestId = 'kibble-tag-block',\n}: TagBlockProps): React.JSX.Element => {\n const handleRemoveTag = useCallback(\n (value: string): void => {\n if (onRemoveTag) {\n onRemoveTag(value, tags);\n }\n },\n [onRemoveTag, tags],\n );\n\n const tagsByGroup = React.useMemo(() => {\n if (!displayTagsInGroups) {\n return [];\n }\n const grouped = {} as Record<string, TagBlockTag[]>;\n for (const tag of tags) {\n const group = tag.groupLabel || '-';\n if (!grouped[group]) {\n grouped[group] = [];\n }\n grouped[group].push(tag);\n }\n return Object.entries(grouped).map(([groupLabel, tags]) => ({\n groupLabel,\n tags,\n }));\n }, [tags, displayTagsInGroups]);\n\n const renderTags = useCallback(\n (tags: TagBlockTag[]) => {\n return tags.map((tag) => {\n const isDisabled =\n tag.label.includes(TagDisabledState.Inactive) || tag.label.includes(TagDisabledState.Deleted);\n\n return (\n <Tag\n className=\"TagBlock__Tag\"\n data-testid={`${dataTestId}-tag`}\n mr={1}\n mb={1}\n key={tag.value}\n label={tag.label}\n onClose={(): void => handleRemoveTag(tag.value)}\n closeButtonDisplay=\"always\"\n fontWeight=\"normal\"\n color={isDisabled ? 'text.placeholder' : 'text'}\n size=\"md\"\n />\n );\n });\n },\n [handleRemoveTag, dataTestId],\n );\n\n return (\n <Box\n className=\"TagBlock\"\n data-testid={dataTestId}\n position=\"relative\"\n mb={3}\n py={2}\n pl={4}\n pr={2}\n bg=\"background.subtle\"\n borderRadius=\"lg\"\n boxShadow={hasError ? `0 0 0 2px var(--chakra-colors-border-danger)` : ''}\n border=\"1px\"\n borderColor=\"border\"\n overflow={loading ? 'hidden' : undefined}\n >\n <Flex\n className=\"TagBlock__ButtonContainer\"\n data-testid={`${dataTestId}-button-container`}\n justifyContent=\"space-between\"\n >\n <HStack gap={1} minH={10}>\n {title && (\n <Text className=\"TagBlock__Title\" mr={2} fontWeight=\"bold\">\n {title}\n </Text>\n )}\n <Menu\n data-testid={`${dataTestId}-menu`}\n {...menuProps}\n buttonProps={menuProps?.buttonProps || defaultMenuButtonProps}\n />\n <Button\n className=\"TagBlock__Button--ClearAll\"\n data-testid={`${dataTestId}-clear-all-button`}\n size=\"sm\"\n iconName=\"arrowCircle\"\n variant=\"ghostNeutral\"\n onClick={onClearAll}\n disabled={tags.length <= 0}\n >\n Clear All\n </Button>\n </HStack>\n {canBeDeleted && (\n <Box>\n <Button\n className=\"TagBlock__Button--Delete\"\n data-testid={`${dataTestId}-delete-button`}\n iconName=\"trashcan\"\n variant=\"ghostNeutral\"\n onClick={onDelete}\n justifySelf=\"flex-end\"\n />\n </Box>\n )}\n </Flex>\n {Boolean(tags.length) && (\n <Flex\n className=\"TagBlock__TagContainer\"\n data-testid={`${dataTestId}-tag-container`}\n mt={2}\n pb={1}\n alignContent=\"space-between\"\n flexWrap=\"wrap\"\n justifyContent=\"flex-start\"\n alignItems=\"flex-start\"\n >\n {displayTagsInGroups && tagsByGroup.length ? (\n <Flex direction=\"column\">\n {tagsByGroup.map(({ groupLabel, tags }) => (\n <Box key={groupLabel} mb={2}>\n <Box className=\"TagBlock__GroupTitle\" data-testid={`${dataTestId}-group-title`}>\n <Heading size=\"xs\" pb={2}>\n {groupLabel}\n </Heading>\n </Box>\n <Flex\n alignContent=\"space-between\"\n flexWrap=\"wrap\"\n justifyContent=\"flex-start\"\n alignItems=\"flex-start\"\n >\n {renderTags(tags)}\n </Flex>\n </Box>\n ))}\n </Flex>\n ) : (\n renderTags(tags)\n )}\n </Flex>\n )}\n {loading && <Spinner fullScreen />}\n {hasError && (\n <Text className=\"TagBlock__Error\" data-testid={`${dataTestId}-error`} mt={2} size=\"xs\" variant=\"danger\">\n {errorText}\n </Text>\n )}\n </Box>\n );\n};\n"],"names":["TagDisabledState","defaultMenuButtonProps","TagBlock","title","menuProps","tags","canBeDeleted","onClearAll","onRemoveTag","onDelete","hasError","errorText","displayTagsInGroups","loading","dataTestId","handleRemoveTag","useCallback","value","tagsByGroup","React","grouped","tag","group","groupLabel","renderTags","isDisabled","jsx","Tag","jsxs","Box","Flex","HStack","Text","Menu","Button","Heading","Spinner"],"mappings":"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"}
@@ -34,7 +34,7 @@ import { W as Ce } from "./text.component-DhuUgP3j.js";
34
34
  import { F as Go } from "./flex-CX-8gE9T.js";
35
35
  import { c as $o } from "./create-slot-recipe-context-D_FXDJGp.js";
36
36
  import { c as Fo } from "./factory-BQshv7_b.js";
37
- import { C as Mo, W as Re, a as Yo } from "./icons-CoSqruIn.js";
37
+ import { a as Mo, W as Re, C as Yo } from "./icons-CEVtpQAi.js";
38
38
  import { g as Ie, m as qo, c as Xo, b as Uo, a as Ko, d as Jo, t as Qo, e as Zo, f as er } from "./toaster.records-BzZmnA3j.js";
39
39
  import { P as tr } from "./index-DcmJgLUo.js";
40
40
  import { c as or } from "./theme-BOK659O0.js";
@@ -11649,4 +11649,4 @@ export {
11649
11649
  js as k,
11650
11650
  As as s
11651
11651
  };
11652
- //# sourceMappingURL=theme.provider-CvuSdLO6.js.map
11652
+ //# sourceMappingURL=theme.provider-BYXTygyb.js.map