@televet/kibble-ui 4.0.0-beta.14 → 4.0.0-beta.16

package/dist/chunks/radioGroup.component-kn8czn3N.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radioGroup.component-kn8czn3N.js","sources":["../../src/components/RadioGroup/components/Radio/radio.component.tsx","../../src/components/RadioGroup/radioGroup.component.tsx"],"sourcesContent":["import React, { ForwardedRef } from \"react\";\nimport { RadioGroup } from \"@chakra-ui/react/radio-group\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\nimport { Card, CardProps } from \"components/Card/card.component\";\nimport { CardPaddingMap } from \"components/Card/card.records\";\nimport { RadioSizeMap, RadioTextSpacing } from \"./radio.records\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\nimport { Text } from \"components/Text/text.component\";\n\nexport interface RadioProps extends WithFormControlProps, RadioGroup.ItemProps {\n  checked?: boolean;\n  radioRef?: ForwardedRef<HTMLDivElement>;\n  size?: FormControlSize;\n  withCard?: boolean;\n}\n\nconst Radio = withFormControl(\n  ({\n    children,\n    checked = false,\n    disabled = false,\n    invalid = false,\n    onContrast = false,\n    radioRef,\n    size = \"md\",\n    withCard = false,\n    ...rest\n  }: RadioProps): React.JSX.Element => {\n    const RadioCard: React.FC<CardProps> = withCard\n      ? (props): React.JSX.Element => {\n          const pr =\n            (RadioSizeMap[size] +\n              RadioTextSpacing[size] +\n              CardPaddingMap[size]) *\n            4;\n          return (\n            <Card\n              className=\"Radio__Card\"\n              data-testid=\"kibble-radio-card\"\n              {...(!disabled && {\n                interactive: true,\n                invalid,\n                active: !!checked,\n              })}\n              onContrast={onContrast}\n              size={size}\n              fullWidth\n              display=\"flex\"\n              {...(typeof children === \"string\" && { alignItems: \"center\" })}\n              width=\"inherit\"\n              pr={`${pr}px`}\n            >\n              {props.children}\n            </Card>\n          );\n        }\n      : React.Fragment;\n\n    return (\n      <RadioGroup.Item\n        className=\"Radio\"\n        data-testid=\"kibble-radio\"\n        invalid={invalid}\n        disabled={disabled}\n        ref={radioRef}\n        {...rest}\n      >\n        <RadioCard>\n          <RadioGroup.ItemHiddenInput\n            className=\"Radio__Input\"\n            data-testid=\"kibble-radio-input\"\n          />\n          <RadioGroup.ItemIndicator\n            className=\"Radio__Indicator\"\n            data-testid=\"kibble-radio-indicator\"\n          />\n          {children && (\n            <RadioGroup.ItemText\n              className=\"Radio__Text\"\n              data-testid=\"kibble-radio-label\"\n              {...(withCard && typeof children !== \"string\" && { mt: \"-3px\" })}\n            >\n              {typeof children === \"string\" ? (\n                <Text size={size}>{children}</Text>\n              ) : (\n                children\n              )}\n            </RadioGroup.ItemText>\n          )}\n        </RadioCard>\n      </RadioGroup.Item>\n    );\n  },\n);\n\nconst WrappedRadio = React.forwardRef(\n  (props: RadioProps, ref: ForwardedRef<HTMLDivElement>) => (\n    <Radio radioRef={ref} {...props} />\n  ),\n);\n\nWrappedRadio.displayName = \"Radio\";\n\nexport { WrappedRadio as Radio };\n","import React from \"react\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\nimport { Radio, RadioProps } from \"./components/Radio/radio.component\";\nimport { RadioGroup as CRadioGroup } from \"@chakra-ui/react/radio-group\";\nimport { Stack } from \"@chakra-ui/react/stack\";\nimport { ConditionalValue } from \"@chakra-ui/react/styled-system\";\nimport { FlexDirection } from \"shared/types/alignment\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\nimport { ButtonGroup } from \"components/ButtonGroup\";\n\nexport interface KRadioGroupProps\n  extends WithFormControlProps,\n    Omit<CRadioGroup.RootProps, \"onValueChange\" | \"onChange\"> {\n  direction?: ConditionalValue<FlexDirection>;\n  onChange?: (value: string | null) => void;\n  size?: FormControlSize;\n}\n\ninterface ButtonRadioGroupProps extends KRadioGroupProps {\n  radioType?: \"buttons\";\n  radios: Omit<RadioProps, \"withCard\">[];\n}\n\ninterface DefaultRadioGroupProps extends KRadioGroupProps {\n  radioType?: \"default\";\n  radios: RadioProps[];\n}\n\nexport type RadioGroupProps = ButtonRadioGroupProps | DefaultRadioGroupProps;\n\nconst RadioGroup = ({\n  radios,\n  defaultValue,\n  direction = \"column\",\n  disabled,\n  invalid,\n  onContrast,\n  onChange,\n  size = \"md\",\n  radioType = \"default\",\n  value,\n  gap = 2,\n  ...rest\n}: RadioGroupProps): React.JSX.Element => {\n  const _computedVariant = onContrast ? \"onContrast\" : \"default\";\n  return (\n    <CRadioGroup.Root\n      className=\"RadioGroup\"\n      data-testid=\"kibble-radio-group\"\n      disabled={disabled}\n      defaultValue={defaultValue}\n      value={value}\n      onValueChange={({ value }) => onChange?.(value)}\n      size={size}\n      variant={_computedVariant}\n      {...rest}\n    >\n      {radioType === \"default\" && (\n        <Stack gap={gap} direction={direction}>\n          {radios.map((radio, index) => (\n            <Radio\n              key={`radio-${index}`}\n              invalid={invalid}\n              disabled={disabled}\n              checked={defaultValue === radio.value || value === radio.value}\n              size={size}\n              {...radio}\n            />\n          ))}\n        </Stack>\n      )}\n      {radioType === \"buttons\" && (\n        <ButtonGroup\n          onContrast={onContrast}\n          variant=\"secondarySubtle\"\n          size={size}\n          buttons={radios.map((radio, index) => {\n            const active =\n              defaultValue === radio.value || value === radio.value;\n            return {\n              key: `button-radio-${index}`,\n              children: radio.children,\n              active,\n              disabled,\n              onClick: () => onChange?.(radio.value),\n            };\n          })}\n        />\n      )}\n    </CRadioGroup.Root>\n  );\n};\n\nRadioGroup.displayName = \"CheckboxGroup\";\n\nconst WrappedRadioGroup = withFormControl(RadioGroup);\n\nexport { WrappedRadioGroup as RadioGroup };\n"],"names":["Radio","withFormControl","children","checked","disabled","invalid","onContrast","radioRef","size","withCard","rest","RadioCard","props","pr","RadioSizeMap","RadioTextSpacing","CardPaddingMap","jsx","Card","React","RadioGroup.Item","RadioGroup.ItemHiddenInput","RadioGroup.ItemIndicator","RadioGroup.ItemText","Text","WrappedRadio","ref","RadioGroup","radios","defaultValue","direction","onChange","radioType","value","gap","_computedVariant","jsxs","CRadioGroup.Root","Stack","radio","index","ButtonGroup","active","WrappedRadioGroup"],"mappings":"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"}

package/dist/chunks/{ratingDots.component-DFHojz_X.js → ratingDots.component-D0FX80wA.js}

@@ -2,7 +2,7 @@ import { x as t } from "./vendor-BBfll6i3.js";
 import { useCallback as m, useMemo as f } from "react";
 import { W as c } from "./text.component-XYjOAc2s.js";
 import { ad as h, u as j, F as g, B as y } from "./chakra-BqBkjpvZ.js";
-import { w as C } from "./withFormControl-DSNvvAPD.js";
+import { w as C } from "./withFormControl-CDQGc9aO.js";
 const R = h({
   base: {
     alignItems: "center",
@@ -152,4 +152,4 @@ const R = h({
 export {
   $ as R
 };
-//# sourceMappingURL=ratingDots.component-DFHojz_X.js.map
+//# sourceMappingURL=ratingDots.component-D0FX80wA.js.map

package/dist/chunks/{ratingDots.component-DFHojz_X.js.map → ratingDots.component-D0FX80wA.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ratingDots.component-DFHojz_X.js","sources":["../../src/components/RatingDots/components/RatingDot/ratingDot.recipe.ts","../../src/components/RatingDots/components/RatingDot/ratingDot.component.tsx","../../src/components/RatingDots/ratingDots.component.tsx"],"sourcesContent":["import { defineRecipe } from \"@chakra-ui/react/styled-system\";\n\nexport const ratingDotRecipe = defineRecipe({\n  base: {\n    alignItems: \"center\",\n    border: \"2px\",\n    borderColor: \"border.focus\",\n    borderRadius: \"full\",\n    fontSize: \"lg\",\n    justifyContent: \"center\",\n    mb: 1,\n    mr: 1,\n  },\n  variants: {\n    variant: {\n      default: {\n        bgColor: \"background.secondary\",\n        color: \"text.contrast\",\n        cursor: \"default\",\n        h: \"40px\",\n        w: \"40px\",\n      },\n      interactive: {\n        bgColor: \"transparent\",\n        color: \"text.interactive\",\n        cursor: \"pointer\",\n        h: \"60px\",\n        w: \"60px\",\n        \"&[data-disabled][data-active]\": {\n          bgColor: \"background.secondary\",\n          color: \"text.contrast\",\n        },\n        _active: {\n          bgColor: \"background.secondary\",\n          color: \"text.contrast\",\n          _hover: {\n            bgColor: \"background.secondary\",\n          },\n        },\n        _disabled: {\n          cursor: \"not-allowed\",\n          opacity: 0.6,\n        },\n        _hover: {\n          bgColor: \"background.secondaryAlpha.hover\",\n        },\n        _invalid: {\n          borderColor: \"border.danger\",\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n});\n","import React, { useCallback } from \"react\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { useRecipe } from \"@chakra-ui/react/styled-system\";\nimport { ratingDotRecipe } from \"./ratingDot.recipe\";\n\nexport interface RatingDotProps {\n  active?: boolean;\n  disabled?: boolean;\n  invalid?: boolean;\n  number: number;\n  onClick?: (value: number) => void;\n}\n\nexport const RatingDot = ({\n  active,\n  disabled,\n  invalid,\n  number,\n  onClick,\n}: RatingDotProps): React.JSX.Element => {\n  const variant = onClick ? \"interactive\" : \"default\";\n  const recipe = useRecipe({ recipe: ratingDotRecipe });\n  const styles = recipe({ variant });\n\n  const handleClick = useCallback(\n    (e: React.MouseEvent<HTMLDivElement, MouseEvent>): void => {\n      e.preventDefault();\n      if (onClick) onClick(number);\n    },\n    [number, onClick],\n  );\n\n  return (\n    <Flex\n      {...(active && { \"data-active\": \"true\" })}\n      {...(disabled ? { \"data-disabled\": \"true\" } : { onClick: handleClick })}\n      {...(invalid && { \"data-invalid\": \"true\" })}\n      css={styles}\n    >\n      {number}\n    </Flex>\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { Box } from \"@chakra-ui/react/box\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Text } from \"components/Text/text.component\";\nimport { RatingDot } from \"./components/RatingDot/ratingDot.component\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\n\nexport interface RatingDotsProps extends WithFormControlProps {\n  centeredLabel?: string;\n  maxLabel?: string;\n  maxValue: number;\n  minLabel?: string;\n  minValue: number;\n  onChange?: (value: number) => void;\n  value?: number;\n}\n\nexport const RatingDots = withFormControl(\n  ({\n    centeredLabel,\n    disabled,\n    invalid,\n    minLabel,\n    minValue,\n    maxLabel,\n    maxValue,\n    onChange,\n    value,\n  }: RatingDotsProps): React.JSX.Element => {\n    const roundedMin = useMemo(() => Math.round(minValue), [minValue]);\n    const roundedMax = useMemo(() => Math.round(maxValue), [maxValue]);\n\n    const values = useMemo(() => {\n      const arr = [];\n      for (let i = roundedMin; i <= roundedMax; i++) {\n        arr.push(i);\n      }\n      return arr;\n    }, [roundedMax, roundedMin]);\n\n    return (\n      <Box className=\"RatingDots\" data-testid=\"kibble-rating-dots\">\n        <Flex\n          className=\"RatingDots__Container\"\n          data-testid=\"kibble-rating-dots-container\"\n          my={4}\n          flexWrap=\"wrap\"\n          justifyContent={onChange ? \"center\" : \"flex-start\"}\n        >\n          {values.map((val) => (\n            <RatingDot\n              key={`rating-dot-${val}`}\n              number={val}\n              active={val === value}\n              disabled={disabled}\n              invalid={invalid}\n              onClick={onChange}\n            />\n          ))}\n        </Flex>\n        {(centeredLabel || minLabel || maxLabel) && (\n          <Flex\n            className=\"RatingDots__Label\"\n            data-testid=\"kibble-rating-dots-label\"\n            justifyContent={\n              onChange\n                ? centeredLabel\n                  ? \"center\"\n                  : \"space-between\"\n                : \"flex-start\"\n            }\n          >\n            {centeredLabel ? (\n              <Text variant=\"subtle\" size=\"sm\">\n                {centeredLabel}\n              </Text>\n            ) : (\n              <>\n                {minLabel && (\n                  <Text\n                    variant=\"subtle\"\n                    size=\"sm\"\n                  >{`${roundedMin} - ${minLabel}`}</Text>\n                )}\n                {!onChange && (\n                  <Text variant=\"subtle\" size=\"sm\" pr={1}>{`,`}</Text>\n                )}\n                {maxLabel && (\n                  <Text\n                    variant=\"subtle\"\n                    size=\"sm\"\n                  >{`${roundedMax} - ${maxLabel}`}</Text>\n                )}\n              </>\n            )}\n          </Flex>\n        )}\n      </Box>\n    );\n  },\n);\n"],"names":["ratingDotRecipe","defineRecipe","RatingDot","active","disabled","invalid","number","onClick","variant","styles","useRecipe","handleClick","useCallback","e","jsx","Flex","RatingDots","withFormControl","centeredLabel","minLabel","minValue","maxLabel","maxValue","onChange","value","roundedMin","useMemo","roundedMax","values","arr","i","jsxs","Box","val","Text","Fragment"],"mappings":";;;;;AAEO,MAAMA,IAAkBC,EAAa;AAAA,EAC1C,MAAM;AAAA,IACJ,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,aAAa;AAAA,IACb,cAAc;AAAA,IACd,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,QACP,SAAS;AAAA,QACT,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAAA,MACA,aAAa;AAAA,QACX,SAAS;AAAA,QACT,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,GAAG;AAAA,QACH,GAAG;AAAA,QACH,iCAAiC;AAAA,UAC/B,SAAS;AAAA,UACT,OAAO;AAAA,QACT;AAAA,QACA,SAAS;AAAA,UACP,SAAS;AAAA,UACT,OAAO;AAAA,UACP,QAAQ;AAAA,YACN,SAAS;AAAA,UAAA;AAAA,QAEb;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,UACR,SAAS;AAAA,QACX;AAAA,QACA,QAAQ;AAAA,UACN,SAAS;AAAA,QACX;AAAA,QACA,UAAU;AAAA,UACR,aAAa;AAAA,QAAA;AAAA,MACf;AAAA,IACF;AAAA,EAEJ;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,EAAA;AAEb,CAAC,GC1CYC,IAAY,CAAC;AAAA,EACxB,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AACF,MAAyC;AACjC,QAAAC,IAAUD,IAAU,gBAAgB,WAEpCE,IADSC,EAAU,EAAE,QAAQV,GAAiB,EAC9B,EAAE,SAAAQ,GAAS,GAE3BG,IAAcC;AAAA,IAClB,CAACC,MAA0D;AACzD,MAAAA,EAAE,eAAe,GACbN,OAAiBD,CAAM;AAAA,IAC7B;AAAA,IACA,CAACA,GAAQC,CAAO;AAAA,EAClB;AAGE,SAAAO,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAIZ,KAAU,EAAE,eAAe,OAAO;AAAA,MACtC,GAAIC,IAAW,EAAE,iBAAiB,WAAW,EAAE,SAASO,EAAY;AAAA,MACpE,GAAIN,KAAW,EAAE,gBAAgB,OAAO;AAAA,MACzC,KAAKI;AAAA,MAEJ,UAAAH;AAAA,IAAA;AAAA,EACH;AAEJ,GCtBaU,IAAaC;AAAA,EACxB,CAAC;AAAA,IACC,eAAAC;AAAA,IACA,UAAAd;AAAA,IACA,SAAAC;AAAA,IACA,UAAAc;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,EAAA,MACwC;AAClC,UAAAC,IAAaC,EAAQ,MAAM,KAAK,MAAMN,CAAQ,GAAG,CAACA,CAAQ,CAAC,GAC3DO,IAAaD,EAAQ,MAAM,KAAK,MAAMJ,CAAQ,GAAG,CAACA,CAAQ,CAAC,GAE3DM,IAASF,EAAQ,MAAM;AAC3B,YAAMG,IAAM,CAAC;AACb,eAASC,IAAIL,GAAYK,KAAKH,GAAYG;AACxC,QAAAD,EAAI,KAAKC,CAAC;AAEL,aAAAD;AAAA,IAAA,GACN,CAACF,GAAYF,CAAU,CAAC;AAE3B,WACGM,gBAAAA,EAAAA,KAAAC,GAAA,EAAI,WAAU,cAAa,eAAY,sBACtC,UAAA;AAAA,MAAAlB,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,eAAY;AAAA,UACZ,IAAI;AAAA,UACJ,UAAS;AAAA,UACT,gBAAgBQ,IAAW,WAAW;AAAA,UAErC,UAAAK,EAAO,IAAI,CAACK,MACXnB,gBAAAA,EAAA;AAAA,YAACZ;AAAA,YAAA;AAAA,cAEC,QAAQ+B;AAAA,cACR,QAAQA,MAAQT;AAAA,cAChB,UAAApB;AAAA,cACA,SAAAC;AAAA,cACA,SAASkB;AAAA,YAAA;AAAA,YALJ,cAAcU,CAAG;AAAA,UAOzB,CAAA;AAAA,QAAA;AAAA,MACH;AAAA,OACEf,KAAiBC,KAAYE,MAC7BP,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,eAAY;AAAA,UACZ,gBACEQ,IACIL,IACE,WACA,kBACF;AAAA,UAGL,UAAAA,0BACEgB,GAAK,EAAA,SAAQ,UAAS,MAAK,MACzB,UACHhB,EAAA,CAAA,IAGGa,gBAAAA,EAAAA,KAAAI,EAAAA,UAAA,EAAA,UAAA;AAAA,YACChB,KAAAL,gBAAAA,EAAA;AAAA,cAACoB;AAAAA,cAAA;AAAA,gBACC,SAAQ;AAAA,gBACR,MAAK;AAAA,gBACL,UAAA,GAAGT,CAAU,MAAMN,CAAQ;AAAA,cAAA;AAAA,YAAG;AAAA,YAEjC,CAACI,KACAT,gBAAAA,EAAA,IAACoB,GAAK,EAAA,SAAQ,UAAS,MAAK,MAAK,IAAI,GAAI,UAAI,IAAA,CAAA;AAAA,YAE9Cb,KACCP,gBAAAA,EAAA;AAAA,cAACoB;AAAAA,cAAA;AAAA,gBACC,SAAQ;AAAA,gBACR,MAAK;AAAA,gBACL,UAAA,GAAGP,CAAU,MAAMN,CAAQ;AAAA,cAAA;AAAA,YAAA;AAAA,UAAG,EAEpC,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ,GAEJ;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"ratingDots.component-D0FX80wA.js","sources":["../../src/components/RatingDots/components/RatingDot/ratingDot.recipe.ts","../../src/components/RatingDots/components/RatingDot/ratingDot.component.tsx","../../src/components/RatingDots/ratingDots.component.tsx"],"sourcesContent":["import { defineRecipe } from \"@chakra-ui/react/styled-system\";\n\nexport const ratingDotRecipe = defineRecipe({\n  base: {\n    alignItems: \"center\",\n    border: \"2px\",\n    borderColor: \"border.focus\",\n    borderRadius: \"full\",\n    fontSize: \"lg\",\n    justifyContent: \"center\",\n    mb: 1,\n    mr: 1,\n  },\n  variants: {\n    variant: {\n      default: {\n        bgColor: \"background.secondary\",\n        color: \"text.contrast\",\n        cursor: \"default\",\n        h: \"40px\",\n        w: \"40px\",\n      },\n      interactive: {\n        bgColor: \"transparent\",\n        color: \"text.interactive\",\n        cursor: \"pointer\",\n        h: \"60px\",\n        w: \"60px\",\n        \"&[data-disabled][data-active]\": {\n          bgColor: \"background.secondary\",\n          color: \"text.contrast\",\n        },\n        _active: {\n          bgColor: \"background.secondary\",\n          color: \"text.contrast\",\n          _hover: {\n            bgColor: \"background.secondary\",\n          },\n        },\n        _disabled: {\n          cursor: \"not-allowed\",\n          opacity: 0.6,\n        },\n        _hover: {\n          bgColor: \"background.secondaryAlpha.hover\",\n        },\n        _invalid: {\n          borderColor: \"border.danger\",\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n});\n","import React, { useCallback } from \"react\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { useRecipe } from \"@chakra-ui/react/styled-system\";\nimport { ratingDotRecipe } from \"./ratingDot.recipe\";\n\nexport interface RatingDotProps {\n  active?: boolean;\n  disabled?: boolean;\n  invalid?: boolean;\n  number: number;\n  onClick?: (value: number) => void;\n}\n\nexport const RatingDot = ({\n  active,\n  disabled,\n  invalid,\n  number,\n  onClick,\n}: RatingDotProps): React.JSX.Element => {\n  const variant = onClick ? \"interactive\" : \"default\";\n  const recipe = useRecipe({ recipe: ratingDotRecipe });\n  const styles = recipe({ variant });\n\n  const handleClick = useCallback(\n    (e: React.MouseEvent<HTMLDivElement, MouseEvent>): void => {\n      e.preventDefault();\n      if (onClick) onClick(number);\n    },\n    [number, onClick],\n  );\n\n  return (\n    <Flex\n      {...(active && { \"data-active\": \"true\" })}\n      {...(disabled ? { \"data-disabled\": \"true\" } : { onClick: handleClick })}\n      {...(invalid && { \"data-invalid\": \"true\" })}\n      css={styles}\n    >\n      {number}\n    </Flex>\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { Box } from \"@chakra-ui/react/box\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Text } from \"components/Text/text.component\";\nimport { RatingDot } from \"./components/RatingDot/ratingDot.component\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\n\nexport interface RatingDotsProps extends WithFormControlProps {\n  centeredLabel?: string;\n  maxLabel?: string;\n  maxValue: number;\n  minLabel?: string;\n  minValue: number;\n  onChange?: (value: number) => void;\n  value?: number;\n}\n\nexport const RatingDots = withFormControl(\n  ({\n    centeredLabel,\n    disabled,\n    invalid,\n    minLabel,\n    minValue,\n    maxLabel,\n    maxValue,\n    onChange,\n    value,\n  }: RatingDotsProps): React.JSX.Element => {\n    const roundedMin = useMemo(() => Math.round(minValue), [minValue]);\n    const roundedMax = useMemo(() => Math.round(maxValue), [maxValue]);\n\n    const values = useMemo(() => {\n      const arr = [];\n      for (let i = roundedMin; i <= roundedMax; i++) {\n        arr.push(i);\n      }\n      return arr;\n    }, [roundedMax, roundedMin]);\n\n    return (\n      <Box className=\"RatingDots\" data-testid=\"kibble-rating-dots\">\n        <Flex\n          className=\"RatingDots__Container\"\n          data-testid=\"kibble-rating-dots-container\"\n          my={4}\n          flexWrap=\"wrap\"\n          justifyContent={onChange ? \"center\" : \"flex-start\"}\n        >\n          {values.map((val) => (\n            <RatingDot\n              key={`rating-dot-${val}`}\n              number={val}\n              active={val === value}\n              disabled={disabled}\n              invalid={invalid}\n              onClick={onChange}\n            />\n          ))}\n        </Flex>\n        {(centeredLabel || minLabel || maxLabel) && (\n          <Flex\n            className=\"RatingDots__Label\"\n            data-testid=\"kibble-rating-dots-label\"\n            justifyContent={\n              onChange\n                ? centeredLabel\n                  ? \"center\"\n                  : \"space-between\"\n                : \"flex-start\"\n            }\n          >\n            {centeredLabel ? (\n              <Text variant=\"subtle\" size=\"sm\">\n                {centeredLabel}\n              </Text>\n            ) : (\n              <>\n                {minLabel && (\n                  <Text\n                    variant=\"subtle\"\n                    size=\"sm\"\n                  >{`${roundedMin} - ${minLabel}`}</Text>\n                )}\n                {!onChange && (\n                  <Text variant=\"subtle\" size=\"sm\" pr={1}>{`,`}</Text>\n                )}\n                {maxLabel && (\n                  <Text\n                    variant=\"subtle\"\n                    size=\"sm\"\n                  >{`${roundedMax} - ${maxLabel}`}</Text>\n                )}\n              </>\n            )}\n          </Flex>\n        )}\n      </Box>\n    );\n  },\n);\n"],"names":["ratingDotRecipe","defineRecipe","RatingDot","active","disabled","invalid","number","onClick","variant","styles","useRecipe","handleClick","useCallback","e","jsx","Flex","RatingDots","withFormControl","centeredLabel","minLabel","minValue","maxLabel","maxValue","onChange","value","roundedMin","useMemo","roundedMax","values","arr","i","jsxs","Box","val","Text","Fragment"],"mappings":"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"}

package/dist/chunks/{ratingDots.component-HugaFu0D.js → ratingDots.component-D5-xY2db.js}

@@ -1,2 +1,2 @@
-"use strict";const t=require("./vendor-D-x6W6ez.js"),l=require("react"),d=require("./text.component-CBa_saMP.js"),n=require("./chakra-DmF8Cxqs.js"),R=require("./withFormControl-C7uVEpxe.js"),v=n.defineRecipe({base:{alignItems:"center",border:"2px",borderColor:"border.focus",borderRadius:"full",fontSize:"lg",justifyContent:"center",mb:1,mr:1},variants:{variant:{default:{bgColor:"background.secondary",color:"text.contrast",cursor:"default",h:"40px",w:"40px"},interactive:{bgColor:"transparent",color:"text.interactive",cursor:"pointer",h:"60px",w:"60px","&[data-disabled][data-active]":{bgColor:"background.secondary",color:"text.contrast"},_active:{bgColor:"background.secondary",color:"text.contrast",_hover:{bgColor:"background.secondary"}},_disabled:{cursor:"not-allowed",opacity:.6},_hover:{bgColor:"background.secondaryAlpha.hover"},_invalid:{borderColor:"border.danger"}}}},defaultVariants:{variant:"default"}}),h=({active:s,disabled:u,invalid:x,number:e,onClick:r})=>{const i=r?"interactive":"default",o=n.useRecipe({recipe:v})({variant:i}),b=l.useCallback(c=>{c.preventDefault(),r&&r(e)},[e,r]);return t.jsxRuntimeExports.jsx(n.Flex,{...s&&{"data-active":"true"},...u?{"data-disabled":"true"}:{onClick:b},...x&&{"data-invalid":"true"},css:o,children:e})},f=R.withFormControl(({centeredLabel:s,disabled:u,invalid:x,minLabel:e,minValue:r,maxLabel:i,maxValue:p,onChange:o,value:b})=>{const c=l.useMemo(()=>Math.round(r),[r]),j=l.useMemo(()=>Math.round(p),[p]),m=l.useMemo(()=>{const a=[];for(let g=c;g<=j;g++)a.push(g);return a},[j,c]);return t.jsxRuntimeExports.jsxs(n.Box,{className:"RatingDots","data-testid":"kibble-rating-dots",children:[t.jsxRuntimeExports.jsx(n.Flex,{className:"RatingDots__Container","data-testid":"kibble-rating-dots-container",my:4,flexWrap:"wrap",justifyContent:o?"center":"flex-start",children:m.map(a=>t.jsxRuntimeExports.jsx(h,{number:a,active:a===b,disabled:u,invalid:x,onClick:o},`rating-dot-${a}`))}),(s||e||i)&&t.jsxRuntimeExports.jsx(n.Flex,{className:"RatingDots__Label","data-testid":"kibble-rating-dots-label",justifyContent:o?s?"center":"space-between":"flex-start",children:s?t.jsxRuntimeExports.jsx(d.WrappedText,{variant:"subtle",size:"sm",children:s}):t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[e&&t.jsxRuntimeExports.jsx(d.WrappedText,{variant:"subtle",size:"sm",children:`${c} - ${e}`}),!o&&t.jsxRuntimeExports.jsx(d.WrappedText,{variant:"subtle",size:"sm",pr:1,children:","}),i&&t.jsxRuntimeExports.jsx(d.WrappedText,{variant:"subtle",size:"sm",children:`${j} - ${i}`})]})})]})});exports.RatingDots=f;
-//# sourceMappingURL=ratingDots.component-HugaFu0D.js.map
+"use strict";const t=require("./vendor-D-x6W6ez.js"),l=require("react"),d=require("./text.component-CBa_saMP.js"),n=require("./chakra-DmF8Cxqs.js"),R=require("./withFormControl-BJSHfbF_.js"),v=n.defineRecipe({base:{alignItems:"center",border:"2px",borderColor:"border.focus",borderRadius:"full",fontSize:"lg",justifyContent:"center",mb:1,mr:1},variants:{variant:{default:{bgColor:"background.secondary",color:"text.contrast",cursor:"default",h:"40px",w:"40px"},interactive:{bgColor:"transparent",color:"text.interactive",cursor:"pointer",h:"60px",w:"60px","&[data-disabled][data-active]":{bgColor:"background.secondary",color:"text.contrast"},_active:{bgColor:"background.secondary",color:"text.contrast",_hover:{bgColor:"background.secondary"}},_disabled:{cursor:"not-allowed",opacity:.6},_hover:{bgColor:"background.secondaryAlpha.hover"},_invalid:{borderColor:"border.danger"}}}},defaultVariants:{variant:"default"}}),h=({active:s,disabled:u,invalid:x,number:e,onClick:r})=>{const i=r?"interactive":"default",o=n.useRecipe({recipe:v})({variant:i}),b=l.useCallback(c=>{c.preventDefault(),r&&r(e)},[e,r]);return t.jsxRuntimeExports.jsx(n.Flex,{...s&&{"data-active":"true"},...u?{"data-disabled":"true"}:{onClick:b},...x&&{"data-invalid":"true"},css:o,children:e})},f=R.withFormControl(({centeredLabel:s,disabled:u,invalid:x,minLabel:e,minValue:r,maxLabel:i,maxValue:p,onChange:o,value:b})=>{const c=l.useMemo(()=>Math.round(r),[r]),j=l.useMemo(()=>Math.round(p),[p]),m=l.useMemo(()=>{const a=[];for(let g=c;g<=j;g++)a.push(g);return a},[j,c]);return t.jsxRuntimeExports.jsxs(n.Box,{className:"RatingDots","data-testid":"kibble-rating-dots",children:[t.jsxRuntimeExports.jsx(n.Flex,{className:"RatingDots__Container","data-testid":"kibble-rating-dots-container",my:4,flexWrap:"wrap",justifyContent:o?"center":"flex-start",children:m.map(a=>t.jsxRuntimeExports.jsx(h,{number:a,active:a===b,disabled:u,invalid:x,onClick:o},`rating-dot-${a}`))}),(s||e||i)&&t.jsxRuntimeExports.jsx(n.Flex,{className:"RatingDots__Label","data-testid":"kibble-rating-dots-label",justifyContent:o?s?"center":"space-between":"flex-start",children:s?t.jsxRuntimeExports.jsx(d.WrappedText,{variant:"subtle",size:"sm",children:s}):t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[e&&t.jsxRuntimeExports.jsx(d.WrappedText,{variant:"subtle",size:"sm",children:`${c} - ${e}`}),!o&&t.jsxRuntimeExports.jsx(d.WrappedText,{variant:"subtle",size:"sm",pr:1,children:","}),i&&t.jsxRuntimeExports.jsx(d.WrappedText,{variant:"subtle",size:"sm",children:`${j} - ${i}`})]})})]})});exports.RatingDots=f;
+//# sourceMappingURL=ratingDots.component-D5-xY2db.js.map

package/dist/chunks/{ratingDots.component-HugaFu0D.js.map → ratingDots.component-D5-xY2db.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ratingDots.component-HugaFu0D.js","sources":["../../src/components/RatingDots/components/RatingDot/ratingDot.recipe.ts","../../src/components/RatingDots/components/RatingDot/ratingDot.component.tsx","../../src/components/RatingDots/ratingDots.component.tsx"],"sourcesContent":["import { defineRecipe } from \"@chakra-ui/react/styled-system\";\n\nexport const ratingDotRecipe = defineRecipe({\n  base: {\n    alignItems: \"center\",\n    border: \"2px\",\n    borderColor: \"border.focus\",\n    borderRadius: \"full\",\n    fontSize: \"lg\",\n    justifyContent: \"center\",\n    mb: 1,\n    mr: 1,\n  },\n  variants: {\n    variant: {\n      default: {\n        bgColor: \"background.secondary\",\n        color: \"text.contrast\",\n        cursor: \"default\",\n        h: \"40px\",\n        w: \"40px\",\n      },\n      interactive: {\n        bgColor: \"transparent\",\n        color: \"text.interactive\",\n        cursor: \"pointer\",\n        h: \"60px\",\n        w: \"60px\",\n        \"&[data-disabled][data-active]\": {\n          bgColor: \"background.secondary\",\n          color: \"text.contrast\",\n        },\n        _active: {\n          bgColor: \"background.secondary\",\n          color: \"text.contrast\",\n          _hover: {\n            bgColor: \"background.secondary\",\n          },\n        },\n        _disabled: {\n          cursor: \"not-allowed\",\n          opacity: 0.6,\n        },\n        _hover: {\n          bgColor: \"background.secondaryAlpha.hover\",\n        },\n        _invalid: {\n          borderColor: \"border.danger\",\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n});\n","import React, { useCallback } from \"react\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { useRecipe } from \"@chakra-ui/react/styled-system\";\nimport { ratingDotRecipe } from \"./ratingDot.recipe\";\n\nexport interface RatingDotProps {\n  active?: boolean;\n  disabled?: boolean;\n  invalid?: boolean;\n  number: number;\n  onClick?: (value: number) => void;\n}\n\nexport const RatingDot = ({\n  active,\n  disabled,\n  invalid,\n  number,\n  onClick,\n}: RatingDotProps): React.JSX.Element => {\n  const variant = onClick ? \"interactive\" : \"default\";\n  const recipe = useRecipe({ recipe: ratingDotRecipe });\n  const styles = recipe({ variant });\n\n  const handleClick = useCallback(\n    (e: React.MouseEvent<HTMLDivElement, MouseEvent>): void => {\n      e.preventDefault();\n      if (onClick) onClick(number);\n    },\n    [number, onClick],\n  );\n\n  return (\n    <Flex\n      {...(active && { \"data-active\": \"true\" })}\n      {...(disabled ? { \"data-disabled\": \"true\" } : { onClick: handleClick })}\n      {...(invalid && { \"data-invalid\": \"true\" })}\n      css={styles}\n    >\n      {number}\n    </Flex>\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { Box } from \"@chakra-ui/react/box\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Text } from \"components/Text/text.component\";\nimport { RatingDot } from \"./components/RatingDot/ratingDot.component\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\n\nexport interface RatingDotsProps extends WithFormControlProps {\n  centeredLabel?: string;\n  maxLabel?: string;\n  maxValue: number;\n  minLabel?: string;\n  minValue: number;\n  onChange?: (value: number) => void;\n  value?: number;\n}\n\nexport const RatingDots = withFormControl(\n  ({\n    centeredLabel,\n    disabled,\n    invalid,\n    minLabel,\n    minValue,\n    maxLabel,\n    maxValue,\n    onChange,\n    value,\n  }: RatingDotsProps): React.JSX.Element => {\n    const roundedMin = useMemo(() => Math.round(minValue), [minValue]);\n    const roundedMax = useMemo(() => Math.round(maxValue), [maxValue]);\n\n    const values = useMemo(() => {\n      const arr = [];\n      for (let i = roundedMin; i <= roundedMax; i++) {\n        arr.push(i);\n      }\n      return arr;\n    }, [roundedMax, roundedMin]);\n\n    return (\n      <Box className=\"RatingDots\" data-testid=\"kibble-rating-dots\">\n        <Flex\n          className=\"RatingDots__Container\"\n          data-testid=\"kibble-rating-dots-container\"\n          my={4}\n          flexWrap=\"wrap\"\n          justifyContent={onChange ? \"center\" : \"flex-start\"}\n        >\n          {values.map((val) => (\n            <RatingDot\n              key={`rating-dot-${val}`}\n              number={val}\n              active={val === value}\n              disabled={disabled}\n              invalid={invalid}\n              onClick={onChange}\n            />\n          ))}\n        </Flex>\n        {(centeredLabel || minLabel || maxLabel) && (\n          <Flex\n            className=\"RatingDots__Label\"\n            data-testid=\"kibble-rating-dots-label\"\n            justifyContent={\n              onChange\n                ? centeredLabel\n                  ? \"center\"\n                  : \"space-between\"\n                : \"flex-start\"\n            }\n          >\n            {centeredLabel ? (\n              <Text variant=\"subtle\" size=\"sm\">\n                {centeredLabel}\n              </Text>\n            ) : (\n              <>\n                {minLabel && (\n                  <Text\n                    variant=\"subtle\"\n                    size=\"sm\"\n                  >{`${roundedMin} - ${minLabel}`}</Text>\n                )}\n                {!onChange && (\n                  <Text variant=\"subtle\" size=\"sm\" pr={1}>{`,`}</Text>\n                )}\n                {maxLabel && (\n                  <Text\n                    variant=\"subtle\"\n                    size=\"sm\"\n                  >{`${roundedMax} - ${maxLabel}`}</Text>\n                )}\n              </>\n            )}\n          </Flex>\n        )}\n      </Box>\n    );\n  },\n);\n"],"names":["ratingDotRecipe","defineRecipe","RatingDot","active","disabled","invalid","number","onClick","variant","styles","useRecipe","handleClick","useCallback","e","jsx","Flex","RatingDots","withFormControl","centeredLabel","minLabel","minValue","maxLabel","maxValue","onChange","value","roundedMin","useMemo","roundedMax","values","arr","i","jsxs","Box","val","Text","Fragment"],"mappings":"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"}
+{"version":3,"file":"ratingDots.component-D5-xY2db.js","sources":["../../src/components/RatingDots/components/RatingDot/ratingDot.recipe.ts","../../src/components/RatingDots/components/RatingDot/ratingDot.component.tsx","../../src/components/RatingDots/ratingDots.component.tsx"],"sourcesContent":["import { defineRecipe } from \"@chakra-ui/react/styled-system\";\n\nexport const ratingDotRecipe = defineRecipe({\n  base: {\n    alignItems: \"center\",\n    border: \"2px\",\n    borderColor: \"border.focus\",\n    borderRadius: \"full\",\n    fontSize: \"lg\",\n    justifyContent: \"center\",\n    mb: 1,\n    mr: 1,\n  },\n  variants: {\n    variant: {\n      default: {\n        bgColor: \"background.secondary\",\n        color: \"text.contrast\",\n        cursor: \"default\",\n        h: \"40px\",\n        w: \"40px\",\n      },\n      interactive: {\n        bgColor: \"transparent\",\n        color: \"text.interactive\",\n        cursor: \"pointer\",\n        h: \"60px\",\n        w: \"60px\",\n        \"&[data-disabled][data-active]\": {\n          bgColor: \"background.secondary\",\n          color: \"text.contrast\",\n        },\n        _active: {\n          bgColor: \"background.secondary\",\n          color: \"text.contrast\",\n          _hover: {\n            bgColor: \"background.secondary\",\n          },\n        },\n        _disabled: {\n          cursor: \"not-allowed\",\n          opacity: 0.6,\n        },\n        _hover: {\n          bgColor: \"background.secondaryAlpha.hover\",\n        },\n        _invalid: {\n          borderColor: \"border.danger\",\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n});\n","import React, { useCallback } from \"react\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { useRecipe } from \"@chakra-ui/react/styled-system\";\nimport { ratingDotRecipe } from \"./ratingDot.recipe\";\n\nexport interface RatingDotProps {\n  active?: boolean;\n  disabled?: boolean;\n  invalid?: boolean;\n  number: number;\n  onClick?: (value: number) => void;\n}\n\nexport const RatingDot = ({\n  active,\n  disabled,\n  invalid,\n  number,\n  onClick,\n}: RatingDotProps): React.JSX.Element => {\n  const variant = onClick ? \"interactive\" : \"default\";\n  const recipe = useRecipe({ recipe: ratingDotRecipe });\n  const styles = recipe({ variant });\n\n  const handleClick = useCallback(\n    (e: React.MouseEvent<HTMLDivElement, MouseEvent>): void => {\n      e.preventDefault();\n      if (onClick) onClick(number);\n    },\n    [number, onClick],\n  );\n\n  return (\n    <Flex\n      {...(active && { \"data-active\": \"true\" })}\n      {...(disabled ? { \"data-disabled\": \"true\" } : { onClick: handleClick })}\n      {...(invalid && { \"data-invalid\": \"true\" })}\n      css={styles}\n    >\n      {number}\n    </Flex>\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { Box } from \"@chakra-ui/react/box\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Text } from \"components/Text/text.component\";\nimport { RatingDot } from \"./components/RatingDot/ratingDot.component\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\n\nexport interface RatingDotsProps extends WithFormControlProps {\n  centeredLabel?: string;\n  maxLabel?: string;\n  maxValue: number;\n  minLabel?: string;\n  minValue: number;\n  onChange?: (value: number) => void;\n  value?: number;\n}\n\nexport const RatingDots = withFormControl(\n  ({\n    centeredLabel,\n    disabled,\n    invalid,\n    minLabel,\n    minValue,\n    maxLabel,\n    maxValue,\n    onChange,\n    value,\n  }: RatingDotsProps): React.JSX.Element => {\n    const roundedMin = useMemo(() => Math.round(minValue), [minValue]);\n    const roundedMax = useMemo(() => Math.round(maxValue), [maxValue]);\n\n    const values = useMemo(() => {\n      const arr = [];\n      for (let i = roundedMin; i <= roundedMax; i++) {\n        arr.push(i);\n      }\n      return arr;\n    }, [roundedMax, roundedMin]);\n\n    return (\n      <Box className=\"RatingDots\" data-testid=\"kibble-rating-dots\">\n        <Flex\n          className=\"RatingDots__Container\"\n          data-testid=\"kibble-rating-dots-container\"\n          my={4}\n          flexWrap=\"wrap\"\n          justifyContent={onChange ? \"center\" : \"flex-start\"}\n        >\n          {values.map((val) => (\n            <RatingDot\n              key={`rating-dot-${val}`}\n              number={val}\n              active={val === value}\n              disabled={disabled}\n              invalid={invalid}\n              onClick={onChange}\n            />\n          ))}\n        </Flex>\n        {(centeredLabel || minLabel || maxLabel) && (\n          <Flex\n            className=\"RatingDots__Label\"\n            data-testid=\"kibble-rating-dots-label\"\n            justifyContent={\n              onChange\n                ? centeredLabel\n                  ? \"center\"\n                  : \"space-between\"\n                : \"flex-start\"\n            }\n          >\n            {centeredLabel ? (\n              <Text variant=\"subtle\" size=\"sm\">\n                {centeredLabel}\n              </Text>\n            ) : (\n              <>\n                {minLabel && (\n                  <Text\n                    variant=\"subtle\"\n                    size=\"sm\"\n                  >{`${roundedMin} - ${minLabel}`}</Text>\n                )}\n                {!onChange && (\n                  <Text variant=\"subtle\" size=\"sm\" pr={1}>{`,`}</Text>\n                )}\n                {maxLabel && (\n                  <Text\n                    variant=\"subtle\"\n                    size=\"sm\"\n                  >{`${roundedMax} - ${maxLabel}`}</Text>\n                )}\n              </>\n            )}\n          </Flex>\n        )}\n      </Box>\n    );\n  },\n);\n"],"names":["ratingDotRecipe","defineRecipe","RatingDot","active","disabled","invalid","number","onClick","variant","styles","useRecipe","handleClick","useCallback","e","jsx","Flex","RatingDots","withFormControl","centeredLabel","minLabel","minValue","maxLabel","maxValue","onChange","value","roundedMin","useMemo","roundedMax","values","arr","i","jsxs","Box","val","Text","Fragment"],"mappings":"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"}

package/dist/chunks/{select.component-h5lPMmWB.js → select.component-CQQ4z--7.js}

@@ -1,2 +1,2 @@
-"use strict";const e=require("./vendor-D-x6W6ez.js"),a=require("react"),g=require("./withFormControl-C7uVEpxe.js"),b=require("./icon.component-Bmtf4XKw.js"),v=require("./button.component-Dufh_y5v.js"),m=require("./text.component-CBa_saMP.js"),f=require("./spinner.component-CUuidnSK.js"),t=require("./chakra-DmF8Cxqs.js"),p=({item:s,onContrast:o,shouldTruncateText:i,size:x})=>e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[s.leftElement,typeof s.label=="string"?e.jsxRuntimeExports.jsx(m.WrappedText,{size:x,truncated:i,variant:s.variant||(o?"onContrast":"default"),children:s.label}):s.label]}),C=({placeholder:s="",placeholderElement:o,...i})=>{const x=e.useSelectContext(),n=a.useMemo(()=>x.selectedItems[0],[x]);return e.jsxRuntimeExports.jsxs(t.SelectTrigger,{children:[!n&&o,e.jsxRuntimeExports.jsx(t.SelectValueText,{placeholder:s,children:n&&e.jsxRuntimeExports.jsx(p,{item:n,...i})})]})},T=g.withFormControl(({clearable:s,placeholderElement:o,emptyPlaceholder:i="No options available",loading:x,onContrast:n,options:c,placeholder:R="",selectRef:E,shouldTruncateText:j,size:l="md",...h})=>{const S=n?"onContrast":"default",u=a.useMemo(()=>e.createListCollection({items:c??[],itemToString:r=>typeof r.label=="string"?r.label:r.valueText||"",itemToValue:r=>r.value}),[c]);return e.jsxRuntimeExports.jsxs(t.SelectRoot,{className:"Select","data-testid":"kibble-select",collection:u,size:l,variant:S,...h,children:[e.jsxRuntimeExports.jsx(t.SelectHiddenSelect,{ref:E}),e.jsxRuntimeExports.jsxs(t.SelectControl,{children:[e.jsxRuntimeExports.jsx(C,{placeholder:R,placeholderElement:o,onContrast:!!n,shouldTruncateText:!!j,size:l}),e.jsxRuntimeExports.jsxs(t.SelectIndicatorGroup,{children:[s&&e.jsxRuntimeExports.jsx(t.SelectClearTrigger,{asChild:!0,children:e.jsxRuntimeExports.jsx(v.Button,{iconName:"close",onContrast:n,size:l==="lg"?"sm":"xs",variant:"ghostNeutral"})}),e.jsxRuntimeExports.jsx(b.Icon,{name:"chevronDown",size:l,variant:n?"onContrast":"default"})]})]}),e.jsxRuntimeExports.jsx(e.Portal,{children:e.jsxRuntimeExports.jsx(t.SelectPositioner,{children:e.jsxRuntimeExports.jsx(t.SelectContent,{children:x?e.jsxRuntimeExports.jsx(t.Flex,{w:"100%",justifyContent:"center",py:3,children:e.jsxRuntimeExports.jsx(f.Spinner,{variant:n?"brandOnContrast":"brand",size:l})}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:u.items.length?u.items.map(r=>e.jsxRuntimeExports.jsx(t.SelectItem,{item:r,children:e.jsxRuntimeExports.jsx(p,{item:r,onContrast:!!n,shouldTruncateText:!!j,size:l})},r.value)):e.jsxRuntimeExports.jsx(t.Flex,{w:"100%",justifyContent:"center",py:3,children:e.jsxRuntimeExports.jsx(m.WrappedText,{size:"sm",variant:n?"subtleOnContrast":"subtle",children:i})})})})})})]})}),d=a.forwardRef((s,o)=>e.jsxRuntimeExports.jsx(T,{selectRef:o,...s}));d.displayName="Select";exports.WrappedSelect=d;
-//# sourceMappingURL=select.component-h5lPMmWB.js.map
+"use strict";const e=require("./vendor-D-x6W6ez.js"),a=require("react"),g=require("./withFormControl-BJSHfbF_.js"),b=require("./icon.component-CzjzLiO_.js"),v=require("./button.component-DDjwI0xh.js"),m=require("./text.component-CBa_saMP.js"),f=require("./spinner.component-CUuidnSK.js"),t=require("./chakra-DmF8Cxqs.js"),p=({item:s,onContrast:o,shouldTruncateText:i,size:x})=>e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[s.leftElement,typeof s.label=="string"?e.jsxRuntimeExports.jsx(m.WrappedText,{size:x,truncated:i,variant:s.variant||(o?"onContrast":"default"),children:s.label}):s.label]}),C=({placeholder:s="",placeholderElement:o,...i})=>{const x=e.useSelectContext(),n=a.useMemo(()=>x.selectedItems[0],[x]);return e.jsxRuntimeExports.jsxs(t.SelectTrigger,{children:[!n&&o,e.jsxRuntimeExports.jsx(t.SelectValueText,{placeholder:s,children:n&&e.jsxRuntimeExports.jsx(p,{item:n,...i})})]})},T=g.withFormControl(({clearable:s,placeholderElement:o,emptyPlaceholder:i="No options available",loading:x,onContrast:n,options:c,placeholder:R="",selectRef:E,shouldTruncateText:j,size:l="md",...h})=>{const S=n?"onContrast":"default",u=a.useMemo(()=>e.createListCollection({items:c??[],itemToString:r=>typeof r.label=="string"?r.label:r.valueText||"",itemToValue:r=>r.value}),[c]);return e.jsxRuntimeExports.jsxs(t.SelectRoot,{className:"Select","data-testid":"kibble-select",collection:u,size:l,variant:S,...h,children:[e.jsxRuntimeExports.jsx(t.SelectHiddenSelect,{ref:E}),e.jsxRuntimeExports.jsxs(t.SelectControl,{children:[e.jsxRuntimeExports.jsx(C,{placeholder:R,placeholderElement:o,onContrast:!!n,shouldTruncateText:!!j,size:l}),e.jsxRuntimeExports.jsxs(t.SelectIndicatorGroup,{children:[s&&e.jsxRuntimeExports.jsx(t.SelectClearTrigger,{asChild:!0,children:e.jsxRuntimeExports.jsx(v.Button,{iconName:"close",onContrast:n,size:l==="lg"?"sm":"xs",variant:"ghostNeutral"})}),e.jsxRuntimeExports.jsx(b.Icon,{name:"chevronDown",size:l,variant:n?"onContrast":"default"})]})]}),e.jsxRuntimeExports.jsx(e.Portal,{children:e.jsxRuntimeExports.jsx(t.SelectPositioner,{children:e.jsxRuntimeExports.jsx(t.SelectContent,{children:x?e.jsxRuntimeExports.jsx(t.Flex,{w:"100%",justifyContent:"center",py:3,children:e.jsxRuntimeExports.jsx(f.Spinner,{variant:n?"brandOnContrast":"brand",size:l})}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:u.items.length?u.items.map(r=>e.jsxRuntimeExports.jsx(t.SelectItem,{item:r,children:e.jsxRuntimeExports.jsx(p,{item:r,onContrast:!!n,shouldTruncateText:!!j,size:l})},r.value)):e.jsxRuntimeExports.jsx(t.Flex,{w:"100%",justifyContent:"center",py:3,children:e.jsxRuntimeExports.jsx(m.WrappedText,{size:"sm",variant:n?"subtleOnContrast":"subtle",children:i})})})})})})]})}),d=a.forwardRef((s,o)=>e.jsxRuntimeExports.jsx(T,{selectRef:o,...s}));d.displayName="Select";exports.WrappedSelect=d;
+//# sourceMappingURL=select.component-CQQ4z--7.js.map

package/dist/chunks/{select.component-h5lPMmWB.js.map → select.component-CQQ4z--7.js.map}

@@ -1 +1 @@
-{"version":3,"file":"select.component-h5lPMmWB.js","sources":["../../src/components/Select/components/SelectItemContent/selectItemContent.component.tsx","../../src/components/Select/components/SelectTrigger/selectTrigger.component.tsx","../../src/components/Select/select.component.tsx"],"sourcesContent":["import React from \"react\";\nimport { Text } from \"components/Text/text.component\";\nimport { SelectOption } from \"components/Select/select.types\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\ninterface SelectItemContentProps {\n  item: SelectOption;\n  onContrast: boolean;\n  shouldTruncateText: boolean;\n  size: FormControlSize;\n}\n\nexport const SelectItemContent = ({\n  item,\n  onContrast,\n  shouldTruncateText,\n  size,\n}: SelectItemContentProps): React.JSX.Element => {\n  return (\n    <>\n      {item.leftElement}\n      {typeof item.label === \"string\" ? (\n        <Text\n          size={size}\n          truncated={shouldTruncateText}\n          variant={item.variant || (onContrast ? \"onContrast\" : \"default\")}\n        >\n          {item.label}\n        </Text>\n      ) : (\n        item.label\n      )}\n    </>\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { Select as CSelect, useSelectContext } from \"@chakra-ui/react/select\";\nimport { SelectOption } from \"components/Select/select.types\";\nimport { SelectItemContent } from \"../SelectItemContent/selectItemContent.component\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\ninterface SelectTriggerProps {\n  placeholder?: string;\n  placeholderElement?: React.ReactNode;\n  onContrast: boolean;\n  shouldTruncateText: boolean;\n  size: FormControlSize;\n}\n\nexport const SelectTrigger = ({\n  placeholder = \"\",\n  placeholderElement,\n  ...rest\n}: SelectTriggerProps): React.JSX.Element => {\n  const select = useSelectContext();\n  const selectedItem = useMemo(() => {\n    const items = select.selectedItems as SelectOption[];\n    return items[0];\n  }, [select]);\n\n  return (\n    <CSelect.Trigger>\n      {!selectedItem && placeholderElement}\n      <CSelect.ValueText placeholder={placeholder}>\n        {selectedItem && <SelectItemContent item={selectedItem} {...rest} />}\n      </CSelect.ValueText>\n    </CSelect.Trigger>\n  );\n};\n","import React, { ForwardedRef, useMemo } from \"react\";\nimport { Select as CSelect } from \"@chakra-ui/react/select\";\nimport { Portal } from \"@chakra-ui/react/portal\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\nimport { createListCollection } from \"@chakra-ui/react/collection\";\nimport { Icon } from \"components/Icon/icon.component\";\nimport { Button } from \"components/Button/button.component\";\nimport { Text } from \"components/Text/text.component\";\nimport { Spinner } from \"components/Spinner/spinner.component\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { SelectOption } from \"./select.types\";\nimport { SelectItemContent } from \"./components/SelectItemContent/selectItemContent.component\";\nimport { SelectTrigger } from \"./components/SelectTrigger/selectTrigger.component\";\n\nexport interface SelectProps\n  extends Omit<CSelect.RootProps, \"collection\" | \"multiple\">,\n    WithFormControlProps {\n  clearable?: boolean;\n  emptyPlaceholder?: string;\n  loading?: boolean;\n  options: SelectOption[];\n  placeholder?: string;\n  placeholderElement?: React.ReactNode;\n  selectRef?: ForwardedRef<HTMLSelectElement>;\n  shouldTruncateText?: boolean;\n  size?: FormControlSize;\n}\n\nconst Select = withFormControl(\n  ({\n    clearable,\n    placeholderElement,\n    emptyPlaceholder = \"No options available\",\n    loading,\n    onContrast,\n    options,\n    placeholder = \"\",\n    selectRef,\n    shouldTruncateText,\n    size = \"md\",\n    ...rest\n  }: SelectProps): React.JSX.Element => {\n    const _computedVariant = onContrast ? \"onContrast\" : \"default\";\n    const collection = useMemo(() => {\n      return createListCollection({\n        items: options ?? [],\n        itemToString: (option) =>\n          typeof option.label === \"string\"\n            ? option.label\n            : option.valueText || \"\",\n        itemToValue: (option) => option.value,\n      });\n    }, [options]);\n\n    return (\n      <CSelect.Root\n        className=\"Select\"\n        data-testid=\"kibble-select\"\n        collection={collection}\n        size={size}\n        variant={_computedVariant}\n        {...rest}\n      >\n        <CSelect.HiddenSelect ref={selectRef} />\n        <CSelect.Control>\n          <SelectTrigger\n            placeholder={placeholder}\n            placeholderElement={placeholderElement}\n            onContrast={!!onContrast}\n            shouldTruncateText={!!shouldTruncateText}\n            size={size}\n          />\n          <CSelect.IndicatorGroup>\n            {clearable && (\n              <CSelect.ClearTrigger asChild>\n                <Button\n                  iconName=\"close\"\n                  onContrast={onContrast}\n                  size={size === \"lg\" ? \"sm\" : \"xs\"}\n                  variant=\"ghostNeutral\"\n                />\n              </CSelect.ClearTrigger>\n            )}\n            <Icon\n              name=\"chevronDown\"\n              size={size}\n              variant={onContrast ? \"onContrast\" : \"default\"}\n            />\n          </CSelect.IndicatorGroup>\n        </CSelect.Control>\n        <Portal>\n          <CSelect.Positioner>\n            <CSelect.Content>\n              {loading ? (\n                <Flex w=\"100%\" justifyContent=\"center\" py={3}>\n                  <Spinner\n                    variant={onContrast ? \"brandOnContrast\" : \"brand\"}\n                    size={size}\n                  />\n                </Flex>\n              ) : (\n                <>\n                  {collection.items.length ? (\n                    collection.items.map((item) => (\n                      <CSelect.Item item={item} key={item.value}>\n                        <SelectItemContent\n                          item={item}\n                          onContrast={!!onContrast}\n                          shouldTruncateText={!!shouldTruncateText}\n                          size={size}\n                        />\n                      </CSelect.Item>\n                    ))\n                  ) : (\n                    <Flex w=\"100%\" justifyContent=\"center\" py={3}>\n                      <Text\n                        size=\"sm\"\n                        variant={onContrast ? \"subtleOnContrast\" : \"subtle\"}\n                      >\n                        {emptyPlaceholder}\n                      </Text>\n                    </Flex>\n                  )}\n                </>\n              )}\n            </CSelect.Content>\n          </CSelect.Positioner>\n        </Portal>\n      </CSelect.Root>\n    );\n  },\n);\n\nconst WrappedSelect = React.forwardRef(\n  (props: SelectProps, ref: ForwardedRef<HTMLSelectElement>) => (\n    <Select selectRef={ref} {...props} />\n  ),\n);\n\nWrappedSelect.displayName = \"Select\";\n\nexport { WrappedSelect as Select };\n"],"names":["SelectItemContent","item","onContrast","shouldTruncateText","size","jsxs","Fragment","jsx","Text","SelectTrigger","placeholder","placeholderElement","rest","select","useSelectContext","selectedItem","useMemo","CSelect.Trigger","CSelect.ValueText","Select","withFormControl","clearable","emptyPlaceholder","loading","options","selectRef","_computedVariant","collection","createListCollection","option","CSelect.Root","CSelect.HiddenSelect","CSelect.Control","CSelect.IndicatorGroup","CSelect.ClearTrigger","Button","Icon","Portal","CSelect.Positioner","CSelect.Content","Flex","Spinner","CSelect.Item","WrappedSelect","React","props","ref"],"mappings":"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"}
+{"version":3,"file":"select.component-CQQ4z--7.js","sources":["../../src/components/Select/components/SelectItemContent/selectItemContent.component.tsx","../../src/components/Select/components/SelectTrigger/selectTrigger.component.tsx","../../src/components/Select/select.component.tsx"],"sourcesContent":["import React from \"react\";\nimport { Text } from \"components/Text/text.component\";\nimport { SelectOption } from \"components/Select/select.types\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\ninterface SelectItemContentProps {\n  item: SelectOption;\n  onContrast: boolean;\n  shouldTruncateText: boolean;\n  size: FormControlSize;\n}\n\nexport const SelectItemContent = ({\n  item,\n  onContrast,\n  shouldTruncateText,\n  size,\n}: SelectItemContentProps): React.JSX.Element => {\n  return (\n    <>\n      {item.leftElement}\n      {typeof item.label === \"string\" ? (\n        <Text\n          size={size}\n          truncated={shouldTruncateText}\n          variant={item.variant || (onContrast ? \"onContrast\" : \"default\")}\n        >\n          {item.label}\n        </Text>\n      ) : (\n        item.label\n      )}\n    </>\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { Select as CSelect, useSelectContext } from \"@chakra-ui/react/select\";\nimport { SelectOption } from \"components/Select/select.types\";\nimport { SelectItemContent } from \"../SelectItemContent/selectItemContent.component\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\ninterface SelectTriggerProps {\n  placeholder?: string;\n  placeholderElement?: React.ReactNode;\n  onContrast: boolean;\n  shouldTruncateText: boolean;\n  size: FormControlSize;\n}\n\nexport const SelectTrigger = ({\n  placeholder = \"\",\n  placeholderElement,\n  ...rest\n}: SelectTriggerProps): React.JSX.Element => {\n  const select = useSelectContext();\n  const selectedItem = useMemo(() => {\n    const items = select.selectedItems as SelectOption[];\n    return items[0];\n  }, [select]);\n\n  return (\n    <CSelect.Trigger>\n      {!selectedItem && placeholderElement}\n      <CSelect.ValueText placeholder={placeholder}>\n        {selectedItem && <SelectItemContent item={selectedItem} {...rest} />}\n      </CSelect.ValueText>\n    </CSelect.Trigger>\n  );\n};\n","import React, { ForwardedRef, useMemo } from \"react\";\nimport { Select as CSelect } from \"@chakra-ui/react/select\";\nimport { Portal } from \"@chakra-ui/react/portal\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\nimport { createListCollection } from \"@chakra-ui/react/collection\";\nimport { Icon } from \"components/Icon/icon.component\";\nimport { Button } from \"components/Button/button.component\";\nimport { Text } from \"components/Text/text.component\";\nimport { Spinner } from \"components/Spinner/spinner.component\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { SelectOption } from \"./select.types\";\nimport { SelectItemContent } from \"./components/SelectItemContent/selectItemContent.component\";\nimport { SelectTrigger } from \"./components/SelectTrigger/selectTrigger.component\";\n\nexport interface SelectProps\n  extends Omit<CSelect.RootProps, \"collection\" | \"multiple\">,\n    WithFormControlProps {\n  clearable?: boolean;\n  emptyPlaceholder?: string;\n  loading?: boolean;\n  options: SelectOption[];\n  placeholder?: string;\n  placeholderElement?: React.ReactNode;\n  selectRef?: ForwardedRef<HTMLSelectElement>;\n  shouldTruncateText?: boolean;\n  size?: FormControlSize;\n}\n\nconst Select = withFormControl(\n  ({\n    clearable,\n    placeholderElement,\n    emptyPlaceholder = \"No options available\",\n    loading,\n    onContrast,\n    options,\n    placeholder = \"\",\n    selectRef,\n    shouldTruncateText,\n    size = \"md\",\n    ...rest\n  }: SelectProps): React.JSX.Element => {\n    const _computedVariant = onContrast ? \"onContrast\" : \"default\";\n    const collection = useMemo(() => {\n      return createListCollection({\n        items: options ?? [],\n        itemToString: (option) =>\n          typeof option.label === \"string\"\n            ? option.label\n            : option.valueText || \"\",\n        itemToValue: (option) => option.value,\n      });\n    }, [options]);\n\n    return (\n      <CSelect.Root\n        className=\"Select\"\n        data-testid=\"kibble-select\"\n        collection={collection}\n        size={size}\n        variant={_computedVariant}\n        {...rest}\n      >\n        <CSelect.HiddenSelect ref={selectRef} />\n        <CSelect.Control>\n          <SelectTrigger\n            placeholder={placeholder}\n            placeholderElement={placeholderElement}\n            onContrast={!!onContrast}\n            shouldTruncateText={!!shouldTruncateText}\n            size={size}\n          />\n          <CSelect.IndicatorGroup>\n            {clearable && (\n              <CSelect.ClearTrigger asChild>\n                <Button\n                  iconName=\"close\"\n                  onContrast={onContrast}\n                  size={size === \"lg\" ? \"sm\" : \"xs\"}\n                  variant=\"ghostNeutral\"\n                />\n              </CSelect.ClearTrigger>\n            )}\n            <Icon\n              name=\"chevronDown\"\n              size={size}\n              variant={onContrast ? \"onContrast\" : \"default\"}\n            />\n          </CSelect.IndicatorGroup>\n        </CSelect.Control>\n        <Portal>\n          <CSelect.Positioner>\n            <CSelect.Content>\n              {loading ? (\n                <Flex w=\"100%\" justifyContent=\"center\" py={3}>\n                  <Spinner\n                    variant={onContrast ? \"brandOnContrast\" : \"brand\"}\n                    size={size}\n                  />\n                </Flex>\n              ) : (\n                <>\n                  {collection.items.length ? (\n                    collection.items.map((item) => (\n                      <CSelect.Item item={item} key={item.value}>\n                        <SelectItemContent\n                          item={item}\n                          onContrast={!!onContrast}\n                          shouldTruncateText={!!shouldTruncateText}\n                          size={size}\n                        />\n                      </CSelect.Item>\n                    ))\n                  ) : (\n                    <Flex w=\"100%\" justifyContent=\"center\" py={3}>\n                      <Text\n                        size=\"sm\"\n                        variant={onContrast ? \"subtleOnContrast\" : \"subtle\"}\n                      >\n                        {emptyPlaceholder}\n                      </Text>\n                    </Flex>\n                  )}\n                </>\n              )}\n            </CSelect.Content>\n          </CSelect.Positioner>\n        </Portal>\n      </CSelect.Root>\n    );\n  },\n);\n\nconst WrappedSelect = React.forwardRef(\n  (props: SelectProps, ref: ForwardedRef<HTMLSelectElement>) => (\n    <Select selectRef={ref} {...props} />\n  ),\n);\n\nWrappedSelect.displayName = \"Select\";\n\nexport { WrappedSelect as Select };\n"],"names":["SelectItemContent","item","onContrast","shouldTruncateText","size","jsxs","Fragment","jsx","Text","SelectTrigger","placeholder","placeholderElement","rest","select","useSelectContext","selectedItem","useMemo","CSelect.Trigger","CSelect.ValueText","Select","withFormControl","clearable","emptyPlaceholder","loading","options","selectRef","_computedVariant","collection","createListCollection","option","CSelect.Root","CSelect.HiddenSelect","CSelect.Control","CSelect.IndicatorGroup","CSelect.ClearTrigger","Button","Icon","Portal","CSelect.Positioner","CSelect.Content","Flex","Spinner","CSelect.Item","WrappedSelect","React","props","ref"],"mappings":"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"}

package/dist/chunks/{select.component-HI7aJx11.js → select.component-CqvAx7vP.js}

@@ -1,8 +1,8 @@
 import { x as e, bS as b, bT as g, bP as v } from "./vendor-BBfll6i3.js";
 import C, { useMemo as x } from "react";
-import { w as T } from "./withFormControl-DSNvvAPD.js";
-import { I as y } from "./icon.component-B-BWWGO3.js";
-import { B as I } from "./button.component-BiW8RE1U.js";
+import { w as T } from "./withFormControl-CDQGc9aO.js";
+import { I as y } from "./icon.component-w5bWbfVU.js";
+import { B as I } from "./button.component-CA9bIFbq.js";
 import { W as u } from "./text.component-XYjOAc2s.js";
 import { S as w } from "./spinner.component-D5tkelNc.js";
 import { ae as F, af as N, ag as R, ah as W, ai as P, aj as V, ak as _, al as k, am as B, F as m, an as E } from "./chakra-BqBkjpvZ.js";
@@ -126,4 +126,4 @@ G.displayName = "Select";
 export {
   G as W
 };
-//# sourceMappingURL=select.component-HI7aJx11.js.map
+//# sourceMappingURL=select.component-CqvAx7vP.js.map

package/dist/chunks/{select.component-HI7aJx11.js.map → select.component-CqvAx7vP.js.map}

@@ -1 +1 @@
-{"version":3,"file":"select.component-HI7aJx11.js","sources":["../../src/components/Select/components/SelectItemContent/selectItemContent.component.tsx","../../src/components/Select/components/SelectTrigger/selectTrigger.component.tsx","../../src/components/Select/select.component.tsx"],"sourcesContent":["import React from \"react\";\nimport { Text } from \"components/Text/text.component\";\nimport { SelectOption } from \"components/Select/select.types\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\ninterface SelectItemContentProps {\n  item: SelectOption;\n  onContrast: boolean;\n  shouldTruncateText: boolean;\n  size: FormControlSize;\n}\n\nexport const SelectItemContent = ({\n  item,\n  onContrast,\n  shouldTruncateText,\n  size,\n}: SelectItemContentProps): React.JSX.Element => {\n  return (\n    <>\n      {item.leftElement}\n      {typeof item.label === \"string\" ? (\n        <Text\n          size={size}\n          truncated={shouldTruncateText}\n          variant={item.variant || (onContrast ? \"onContrast\" : \"default\")}\n        >\n          {item.label}\n        </Text>\n      ) : (\n        item.label\n      )}\n    </>\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { Select as CSelect, useSelectContext } from \"@chakra-ui/react/select\";\nimport { SelectOption } from \"components/Select/select.types\";\nimport { SelectItemContent } from \"../SelectItemContent/selectItemContent.component\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\ninterface SelectTriggerProps {\n  placeholder?: string;\n  placeholderElement?: React.ReactNode;\n  onContrast: boolean;\n  shouldTruncateText: boolean;\n  size: FormControlSize;\n}\n\nexport const SelectTrigger = ({\n  placeholder = \"\",\n  placeholderElement,\n  ...rest\n}: SelectTriggerProps): React.JSX.Element => {\n  const select = useSelectContext();\n  const selectedItem = useMemo(() => {\n    const items = select.selectedItems as SelectOption[];\n    return items[0];\n  }, [select]);\n\n  return (\n    <CSelect.Trigger>\n      {!selectedItem && placeholderElement}\n      <CSelect.ValueText placeholder={placeholder}>\n        {selectedItem && <SelectItemContent item={selectedItem} {...rest} />}\n      </CSelect.ValueText>\n    </CSelect.Trigger>\n  );\n};\n","import React, { ForwardedRef, useMemo } from \"react\";\nimport { Select as CSelect } from \"@chakra-ui/react/select\";\nimport { Portal } from \"@chakra-ui/react/portal\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\nimport { createListCollection } from \"@chakra-ui/react/collection\";\nimport { Icon } from \"components/Icon/icon.component\";\nimport { Button } from \"components/Button/button.component\";\nimport { Text } from \"components/Text/text.component\";\nimport { Spinner } from \"components/Spinner/spinner.component\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { SelectOption } from \"./select.types\";\nimport { SelectItemContent } from \"./components/SelectItemContent/selectItemContent.component\";\nimport { SelectTrigger } from \"./components/SelectTrigger/selectTrigger.component\";\n\nexport interface SelectProps\n  extends Omit<CSelect.RootProps, \"collection\" | \"multiple\">,\n    WithFormControlProps {\n  clearable?: boolean;\n  emptyPlaceholder?: string;\n  loading?: boolean;\n  options: SelectOption[];\n  placeholder?: string;\n  placeholderElement?: React.ReactNode;\n  selectRef?: ForwardedRef<HTMLSelectElement>;\n  shouldTruncateText?: boolean;\n  size?: FormControlSize;\n}\n\nconst Select = withFormControl(\n  ({\n    clearable,\n    placeholderElement,\n    emptyPlaceholder = \"No options available\",\n    loading,\n    onContrast,\n    options,\n    placeholder = \"\",\n    selectRef,\n    shouldTruncateText,\n    size = \"md\",\n    ...rest\n  }: SelectProps): React.JSX.Element => {\n    const _computedVariant = onContrast ? \"onContrast\" : \"default\";\n    const collection = useMemo(() => {\n      return createListCollection({\n        items: options ?? [],\n        itemToString: (option) =>\n          typeof option.label === \"string\"\n            ? option.label\n            : option.valueText || \"\",\n        itemToValue: (option) => option.value,\n      });\n    }, [options]);\n\n    return (\n      <CSelect.Root\n        className=\"Select\"\n        data-testid=\"kibble-select\"\n        collection={collection}\n        size={size}\n        variant={_computedVariant}\n        {...rest}\n      >\n        <CSelect.HiddenSelect ref={selectRef} />\n        <CSelect.Control>\n          <SelectTrigger\n            placeholder={placeholder}\n            placeholderElement={placeholderElement}\n            onContrast={!!onContrast}\n            shouldTruncateText={!!shouldTruncateText}\n            size={size}\n          />\n          <CSelect.IndicatorGroup>\n            {clearable && (\n              <CSelect.ClearTrigger asChild>\n                <Button\n                  iconName=\"close\"\n                  onContrast={onContrast}\n                  size={size === \"lg\" ? \"sm\" : \"xs\"}\n                  variant=\"ghostNeutral\"\n                />\n              </CSelect.ClearTrigger>\n            )}\n            <Icon\n              name=\"chevronDown\"\n              size={size}\n              variant={onContrast ? \"onContrast\" : \"default\"}\n            />\n          </CSelect.IndicatorGroup>\n        </CSelect.Control>\n        <Portal>\n          <CSelect.Positioner>\n            <CSelect.Content>\n              {loading ? (\n                <Flex w=\"100%\" justifyContent=\"center\" py={3}>\n                  <Spinner\n                    variant={onContrast ? \"brandOnContrast\" : \"brand\"}\n                    size={size}\n                  />\n                </Flex>\n              ) : (\n                <>\n                  {collection.items.length ? (\n                    collection.items.map((item) => (\n                      <CSelect.Item item={item} key={item.value}>\n                        <SelectItemContent\n                          item={item}\n                          onContrast={!!onContrast}\n                          shouldTruncateText={!!shouldTruncateText}\n                          size={size}\n                        />\n                      </CSelect.Item>\n                    ))\n                  ) : (\n                    <Flex w=\"100%\" justifyContent=\"center\" py={3}>\n                      <Text\n                        size=\"sm\"\n                        variant={onContrast ? \"subtleOnContrast\" : \"subtle\"}\n                      >\n                        {emptyPlaceholder}\n                      </Text>\n                    </Flex>\n                  )}\n                </>\n              )}\n            </CSelect.Content>\n          </CSelect.Positioner>\n        </Portal>\n      </CSelect.Root>\n    );\n  },\n);\n\nconst WrappedSelect = React.forwardRef(\n  (props: SelectProps, ref: ForwardedRef<HTMLSelectElement>) => (\n    <Select selectRef={ref} {...props} />\n  ),\n);\n\nWrappedSelect.displayName = \"Select\";\n\nexport { WrappedSelect as Select };\n"],"names":["SelectItemContent","item","onContrast","shouldTruncateText","size","jsxs","Fragment","jsx","Text","SelectTrigger","placeholder","placeholderElement","rest","select","useSelectContext","selectedItem","useMemo","CSelect.Trigger","CSelect.ValueText","Select","withFormControl","clearable","emptyPlaceholder","loading","options","selectRef","_computedVariant","collection","createListCollection","option","CSelect.Root","CSelect.HiddenSelect","CSelect.Control","CSelect.IndicatorGroup","CSelect.ClearTrigger","Button","Icon","Portal","CSelect.Positioner","CSelect.Content","Flex","Spinner","CSelect.Item","WrappedSelect","React","props","ref"],"mappings":"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"}
+{"version":3,"file":"select.component-CqvAx7vP.js","sources":["../../src/components/Select/components/SelectItemContent/selectItemContent.component.tsx","../../src/components/Select/components/SelectTrigger/selectTrigger.component.tsx","../../src/components/Select/select.component.tsx"],"sourcesContent":["import React from \"react\";\nimport { Text } from \"components/Text/text.component\";\nimport { SelectOption } from \"components/Select/select.types\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\ninterface SelectItemContentProps {\n  item: SelectOption;\n  onContrast: boolean;\n  shouldTruncateText: boolean;\n  size: FormControlSize;\n}\n\nexport const SelectItemContent = ({\n  item,\n  onContrast,\n  shouldTruncateText,\n  size,\n}: SelectItemContentProps): React.JSX.Element => {\n  return (\n    <>\n      {item.leftElement}\n      {typeof item.label === \"string\" ? (\n        <Text\n          size={size}\n          truncated={shouldTruncateText}\n          variant={item.variant || (onContrast ? \"onContrast\" : \"default\")}\n        >\n          {item.label}\n        </Text>\n      ) : (\n        item.label\n      )}\n    </>\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { Select as CSelect, useSelectContext } from \"@chakra-ui/react/select\";\nimport { SelectOption } from \"components/Select/select.types\";\nimport { SelectItemContent } from \"../SelectItemContent/selectItemContent.component\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\ninterface SelectTriggerProps {\n  placeholder?: string;\n  placeholderElement?: React.ReactNode;\n  onContrast: boolean;\n  shouldTruncateText: boolean;\n  size: FormControlSize;\n}\n\nexport const SelectTrigger = ({\n  placeholder = \"\",\n  placeholderElement,\n  ...rest\n}: SelectTriggerProps): React.JSX.Element => {\n  const select = useSelectContext();\n  const selectedItem = useMemo(() => {\n    const items = select.selectedItems as SelectOption[];\n    return items[0];\n  }, [select]);\n\n  return (\n    <CSelect.Trigger>\n      {!selectedItem && placeholderElement}\n      <CSelect.ValueText placeholder={placeholder}>\n        {selectedItem && <SelectItemContent item={selectedItem} {...rest} />}\n      </CSelect.ValueText>\n    </CSelect.Trigger>\n  );\n};\n","import React, { ForwardedRef, useMemo } from \"react\";\nimport { Select as CSelect } from \"@chakra-ui/react/select\";\nimport { Portal } from \"@chakra-ui/react/portal\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\nimport { createListCollection } from \"@chakra-ui/react/collection\";\nimport { Icon } from \"components/Icon/icon.component\";\nimport { Button } from \"components/Button/button.component\";\nimport { Text } from \"components/Text/text.component\";\nimport { Spinner } from \"components/Spinner/spinner.component\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { SelectOption } from \"./select.types\";\nimport { SelectItemContent } from \"./components/SelectItemContent/selectItemContent.component\";\nimport { SelectTrigger } from \"./components/SelectTrigger/selectTrigger.component\";\n\nexport interface SelectProps\n  extends Omit<CSelect.RootProps, \"collection\" | \"multiple\">,\n    WithFormControlProps {\n  clearable?: boolean;\n  emptyPlaceholder?: string;\n  loading?: boolean;\n  options: SelectOption[];\n  placeholder?: string;\n  placeholderElement?: React.ReactNode;\n  selectRef?: ForwardedRef<HTMLSelectElement>;\n  shouldTruncateText?: boolean;\n  size?: FormControlSize;\n}\n\nconst Select = withFormControl(\n  ({\n    clearable,\n    placeholderElement,\n    emptyPlaceholder = \"No options available\",\n    loading,\n    onContrast,\n    options,\n    placeholder = \"\",\n    selectRef,\n    shouldTruncateText,\n    size = \"md\",\n    ...rest\n  }: SelectProps): React.JSX.Element => {\n    const _computedVariant = onContrast ? \"onContrast\" : \"default\";\n    const collection = useMemo(() => {\n      return createListCollection({\n        items: options ?? [],\n        itemToString: (option) =>\n          typeof option.label === \"string\"\n            ? option.label\n            : option.valueText || \"\",\n        itemToValue: (option) => option.value,\n      });\n    }, [options]);\n\n    return (\n      <CSelect.Root\n        className=\"Select\"\n        data-testid=\"kibble-select\"\n        collection={collection}\n        size={size}\n        variant={_computedVariant}\n        {...rest}\n      >\n        <CSelect.HiddenSelect ref={selectRef} />\n        <CSelect.Control>\n          <SelectTrigger\n            placeholder={placeholder}\n            placeholderElement={placeholderElement}\n            onContrast={!!onContrast}\n            shouldTruncateText={!!shouldTruncateText}\n            size={size}\n          />\n          <CSelect.IndicatorGroup>\n            {clearable && (\n              <CSelect.ClearTrigger asChild>\n                <Button\n                  iconName=\"close\"\n                  onContrast={onContrast}\n                  size={size === \"lg\" ? \"sm\" : \"xs\"}\n                  variant=\"ghostNeutral\"\n                />\n              </CSelect.ClearTrigger>\n            )}\n            <Icon\n              name=\"chevronDown\"\n              size={size}\n              variant={onContrast ? \"onContrast\" : \"default\"}\n            />\n          </CSelect.IndicatorGroup>\n        </CSelect.Control>\n        <Portal>\n          <CSelect.Positioner>\n            <CSelect.Content>\n              {loading ? (\n                <Flex w=\"100%\" justifyContent=\"center\" py={3}>\n                  <Spinner\n                    variant={onContrast ? \"brandOnContrast\" : \"brand\"}\n                    size={size}\n                  />\n                </Flex>\n              ) : (\n                <>\n                  {collection.items.length ? (\n                    collection.items.map((item) => (\n                      <CSelect.Item item={item} key={item.value}>\n                        <SelectItemContent\n                          item={item}\n                          onContrast={!!onContrast}\n                          shouldTruncateText={!!shouldTruncateText}\n                          size={size}\n                        />\n                      </CSelect.Item>\n                    ))\n                  ) : (\n                    <Flex w=\"100%\" justifyContent=\"center\" py={3}>\n                      <Text\n                        size=\"sm\"\n                        variant={onContrast ? \"subtleOnContrast\" : \"subtle\"}\n                      >\n                        {emptyPlaceholder}\n                      </Text>\n                    </Flex>\n                  )}\n                </>\n              )}\n            </CSelect.Content>\n          </CSelect.Positioner>\n        </Portal>\n      </CSelect.Root>\n    );\n  },\n);\n\nconst WrappedSelect = React.forwardRef(\n  (props: SelectProps, ref: ForwardedRef<HTMLSelectElement>) => (\n    <Select selectRef={ref} {...props} />\n  ),\n);\n\nWrappedSelect.displayName = \"Select\";\n\nexport { WrappedSelect as Select };\n"],"names":["SelectItemContent","item","onContrast","shouldTruncateText","size","jsxs","Fragment","jsx","Text","SelectTrigger","placeholder","placeholderElement","rest","select","useSelectContext","selectedItem","useMemo","CSelect.Trigger","CSelect.ValueText","Select","withFormControl","clearable","emptyPlaceholder","loading","options","selectRef","_computedVariant","collection","createListCollection","option","CSelect.Root","CSelect.HiddenSelect","CSelect.Control","CSelect.IndicatorGroup","CSelect.ClearTrigger","Button","Icon","Portal","CSelect.Positioner","CSelect.Content","Flex","Spinner","CSelect.Item","WrappedSelect","React","props","ref"],"mappings":"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"}

package/dist/chunks/{sortableList.component-B2hSRuex.js → sortableList.component-DcjKdsDK.js}

@@ -1,2 +1,2 @@
-"use strict";const e=require("./vendor-D-x6W6ez.js"),c=require("react"),t=require("./dnd-4IMP_kRN.js"),v=require("./button.component-Dufh_y5v.js"),E=require("./text.component-CBa_saMP.js"),j=require("./chakra-DmF8Cxqs.js"),g=c.createContext({attributes:void 0,listeners:void 0,ref(){}}),R=({...n})=>{const{attributes:s,listeners:o,ref:d}=c.useContext(g),i=t.useDndContext();return e.jsxRuntimeExports.jsx(v.Button,{className:"SortableList__DragHandle","data-testid":"kibble-sortable-list-drag-handle",ref:d,cursor:i.activatorEvent?"grabbing":"grab",iconName:"grid",size:"sm",variant:"ghostNeutral",...s,...o,...n})},S=({content:n,hideHandle:s,id:o,itemProps:d})=>{const{attributes:i,isDragging:x,listeners:a,setNodeRef:u,setActivatorNodeRef:b,transform:r,transition:l}=t.useSortable({id:o}),m=c.useMemo(()=>({attributes:i,listeners:a,ref:b}),[i,a,b]);return e.jsxRuntimeExports.jsx(g.Provider,{value:m,children:e.jsxRuntimeExports.jsx(j.ListItem,{className:"SortableList__Item","data-testid":"kibble-sortable-list-item",ref:u,...d,listStyleType:"none",...x&&{opacity:.4},transition:l,transform:t.CSS.Translate.toString(r),children:e.jsxRuntimeExports.jsxs(j.Flex,{alignItems:"center",gap:2,width:"100%",children:[!s&&e.jsxRuntimeExports.jsx(R,{}),typeof n=="string"?e.jsxRuntimeExports.jsx(E.WrappedText,{size:"sm",children:n}):n]})})})},h=({hideHandle:n=!1,items:s,itemsProps:o,onChange:d,...i})=>{const[x,a]=c.useState(null),u=c.useMemo(()=>s.find(r=>r.id===x?.id),[x,s]),b=t.useSensors(t.useSensor(t.PointerSensor),t.useSensor(t.KeyboardSensor,{coordinateGetter:t.sortableKeyboardCoordinates}));return e.jsxRuntimeExports.jsx(t.DndContext,{sensors:b,onDragStart:({active:r})=>{a(r)},onDragEnd:({active:r,over:l})=>{if(l&&r.id!==l?.id){const m=s.findIndex(({id:p})=>p===r.id),f=s.findIndex(({id:p})=>p===l.id);d(t.arrayMove(s,m,f))}a(null)},onDragCancel:()=>a(null),children:e.jsxRuntimeExports.jsx(t.SortableContext,{items:s,children:e.jsxRuntimeExports.jsxs(j.ListRoot,{className:"SortableList","data-testid":"kibble-sortable-list",gap:2,...i,children:[s.map(r=>e.jsxRuntimeExports.jsx(S,{...r,itemProps:o,hideHandle:n},r.id)),u&&e.jsxRuntimeExports.jsx(t.DragOverlay,{dropAnimation:C,children:e.jsxRuntimeExports.jsx(S,{...u,itemProps:o,hideHandle:n})})]})})})},C={sideEffects:t.defaultDropAnimationSideEffects({styles:{active:{opacity:"0.4"}}})};exports.SortableList=h;
-//# sourceMappingURL=sortableList.component-B2hSRuex.js.map
+"use strict";const e=require("./vendor-D-x6W6ez.js"),c=require("react"),t=require("./dnd-4IMP_kRN.js"),v=require("./button.component-DDjwI0xh.js"),E=require("./text.component-CBa_saMP.js"),j=require("./chakra-DmF8Cxqs.js"),g=c.createContext({attributes:void 0,listeners:void 0,ref(){}}),R=({...n})=>{const{attributes:s,listeners:o,ref:d}=c.useContext(g),i=t.useDndContext();return e.jsxRuntimeExports.jsx(v.Button,{className:"SortableList__DragHandle","data-testid":"kibble-sortable-list-drag-handle",ref:d,cursor:i.activatorEvent?"grabbing":"grab",iconName:"grid",size:"sm",variant:"ghostNeutral",...s,...o,...n})},S=({content:n,hideHandle:s,id:o,itemProps:d})=>{const{attributes:i,isDragging:x,listeners:a,setNodeRef:u,setActivatorNodeRef:b,transform:r,transition:l}=t.useSortable({id:o}),m=c.useMemo(()=>({attributes:i,listeners:a,ref:b}),[i,a,b]);return e.jsxRuntimeExports.jsx(g.Provider,{value:m,children:e.jsxRuntimeExports.jsx(j.ListItem,{className:"SortableList__Item","data-testid":"kibble-sortable-list-item",ref:u,...d,listStyleType:"none",...x&&{opacity:.4},transition:l,transform:t.CSS.Translate.toString(r),children:e.jsxRuntimeExports.jsxs(j.Flex,{alignItems:"center",gap:2,width:"100%",children:[!s&&e.jsxRuntimeExports.jsx(R,{}),typeof n=="string"?e.jsxRuntimeExports.jsx(E.WrappedText,{size:"sm",children:n}):n]})})})},h=({hideHandle:n=!1,items:s,itemsProps:o,onChange:d,...i})=>{const[x,a]=c.useState(null),u=c.useMemo(()=>s.find(r=>r.id===x?.id),[x,s]),b=t.useSensors(t.useSensor(t.PointerSensor),t.useSensor(t.KeyboardSensor,{coordinateGetter:t.sortableKeyboardCoordinates}));return e.jsxRuntimeExports.jsx(t.DndContext,{sensors:b,onDragStart:({active:r})=>{a(r)},onDragEnd:({active:r,over:l})=>{if(l&&r.id!==l?.id){const m=s.findIndex(({id:p})=>p===r.id),f=s.findIndex(({id:p})=>p===l.id);d(t.arrayMove(s,m,f))}a(null)},onDragCancel:()=>a(null),children:e.jsxRuntimeExports.jsx(t.SortableContext,{items:s,children:e.jsxRuntimeExports.jsxs(j.ListRoot,{className:"SortableList","data-testid":"kibble-sortable-list",gap:2,...i,children:[s.map(r=>e.jsxRuntimeExports.jsx(S,{...r,itemProps:o,hideHandle:n},r.id)),u&&e.jsxRuntimeExports.jsx(t.DragOverlay,{dropAnimation:C,children:e.jsxRuntimeExports.jsx(S,{...u,itemProps:o,hideHandle:n})})]})})})},C={sideEffects:t.defaultDropAnimationSideEffects({styles:{active:{opacity:"0.4"}}})};exports.SortableList=h;
+//# sourceMappingURL=sortableList.component-DcjKdsDK.js.map

package/dist/chunks/{sortableList.component-B2hSRuex.js.map → sortableList.component-DcjKdsDK.js.map}

@@ -1 +1 @@
-{"version":3,"file":"sortableList.component-B2hSRuex.js","sources":["../../src/components/SortableList/components/SortableListItem/sortableListItem.context.ts","../../src/components/SortableList/components/SortableListDragHandle/sortableListDragHandle.component.tsx","../../src/components/SortableList/components/SortableListItem/sortableListItem.component.tsx","../../src/components/SortableList/sortableList.component.tsx"],"sourcesContent":["import {\n  DraggableAttributes,\n  DraggableSyntheticListeners,\n} from \"@dnd-kit/core/dist/hooks/useDraggable\";\nimport { createContext } from \"react\";\n\ninterface Context {\n  attributes?: DraggableAttributes;\n  listeners: DraggableSyntheticListeners;\n  ref(node: HTMLElement | null): void;\n}\n\nexport const SortableItemContext = createContext<Context>({\n  attributes: undefined,\n  listeners: undefined,\n  ref() {},\n});\n","import React, { useContext } from \"react\";\n\nimport { useDndContext } from \"@dnd-kit/core\";\nimport { Button, ButtonProps } from \"../../../Button/button.component\";\nimport { SortableItemContext } from \"../SortableListItem/sortableListItem.context\";\n\nexport const SortableListDragHandle = ({\n  ...rest\n}: ButtonProps): React.JSX.Element => {\n  const { attributes, listeners, ref } = useContext(SortableItemContext);\n  const dndContext = useDndContext();\n\n  return (\n    <Button\n      className=\"SortableList__DragHandle\"\n      data-testid=\"kibble-sortable-list-drag-handle\"\n      ref={ref}\n      cursor={dndContext.activatorEvent ? \"grabbing\" : \"grab\"}\n      iconName=\"grid\"\n      size=\"sm\"\n      variant=\"ghostNeutral\"\n      {...attributes}\n      {...listeners}\n      {...rest}\n    />\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { List } from \"@chakra-ui/react/list\";\nimport { UniqueIdentifier } from \"@dnd-kit/core\";\nimport { useSortable } from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { SortableItemContext } from \"./sortableListItem.context\";\nimport { SortableListDragHandle } from \"../SortableListDragHandle/sortableListDragHandle.component\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Text } from \"components/Text/text.component\";\n\nexport interface SortableListItemProps {\n  content: React.ReactNode;\n  id: UniqueIdentifier;\n}\n\ninterface InternalSortableListItemProps extends SortableListItemProps {\n  hideHandle?: boolean;\n  itemProps?: Omit<List.ItemProps, \"id\" | \"content\">;\n}\n\nexport const SortableListItem = ({\n  content,\n  hideHandle,\n  id,\n  itemProps,\n}: InternalSortableListItemProps): React.JSX.Element => {\n  const {\n    attributes,\n    isDragging,\n    listeners,\n    setNodeRef,\n    setActivatorNodeRef,\n    transform,\n    transition,\n  } = useSortable({\n    id,\n  });\n\n  const context = useMemo(\n    () => ({\n      attributes,\n      listeners,\n      ref: setActivatorNodeRef,\n    }),\n    [attributes, listeners, setActivatorNodeRef],\n  );\n\n  return (\n    <SortableItemContext.Provider value={context}>\n      <List.Item\n        className=\"SortableList__Item\"\n        data-testid=\"kibble-sortable-list-item\"\n        ref={setNodeRef}\n        {...itemProps}\n        listStyleType=\"none\"\n        {...(isDragging && { opacity: 0.4 })}\n        transition={transition}\n        transform={CSS.Translate.toString(transform)}\n      >\n        <Flex alignItems=\"center\" gap={2} width=\"100%\">\n          {!hideHandle && <SortableListDragHandle />}\n          {typeof content === \"string\" ? (\n            <Text size=\"sm\">{content}</Text>\n          ) : (\n            content\n          )}\n        </Flex>\n      </List.Item>\n    </SortableItemContext.Provider>\n  );\n};\n","import React, { useMemo, useState } from \"react\";\nimport { List } from \"@chakra-ui/react/list\";\nimport {\n  defaultDropAnimationSideEffects,\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport type { Active, DropAnimation } from \"@dnd-kit/core\";\nimport {\n  SortableContext,\n  arrayMove,\n  sortableKeyboardCoordinates,\n} from \"@dnd-kit/sortable\";\nimport {\n  SortableListItem,\n  SortableListItemProps,\n} from \"./components/SortableListItem/sortableListItem.component\";\n\nexport interface SortableListProps extends Omit<List.RootProps, \"onChange\"> {\n  hideHandle?: boolean;\n  items: SortableListItemProps[];\n  itemsProps?: Omit<List.ItemProps, \"id\" | \"content\">;\n  onChange(items: SortableListItemProps[]): void;\n}\n\nexport const SortableList = ({\n  hideHandle = false,\n  items,\n  itemsProps,\n  onChange,\n  ...rest\n}: SortableListProps): React.JSX.Element => {\n  const [active, setActive] = useState<Active | null>(null);\n  const activeItem = useMemo(\n    () => items.find((item) => item.id === active?.id),\n    [active, items],\n  );\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  );\n\n  return (\n    <DndContext\n      sensors={sensors}\n      onDragStart={({ active }): void => {\n        setActive(active);\n      }}\n      onDragEnd={({ active, over }): void => {\n        if (over && active.id !== over?.id) {\n          const activeIndex = items.findIndex(({ id }) => id === active.id);\n          const overIndex = items.findIndex(({ id }) => id === over.id);\n\n          onChange(arrayMove(items, activeIndex, overIndex));\n        }\n        setActive(null);\n      }}\n      onDragCancel={(): void => setActive(null)}\n    >\n      <SortableContext items={items}>\n        <List.Root\n          className=\"SortableList\"\n          data-testid=\"kibble-sortable-list\"\n          gap={2}\n          {...rest}\n        >\n          {items.map((item) => (\n            <SortableListItem\n              key={item.id}\n              {...item}\n              itemProps={itemsProps}\n              hideHandle={hideHandle}\n            />\n          ))}\n\n          {activeItem && (\n            <DragOverlay dropAnimation={dropAnimationConfig}>\n              <SortableListItem\n                {...activeItem}\n                itemProps={itemsProps}\n                hideHandle={hideHandle}\n              />\n            </DragOverlay>\n          )}\n        </List.Root>\n      </SortableContext>\n    </DndContext>\n  );\n};\n\nconst dropAnimationConfig: DropAnimation = {\n  sideEffects: defaultDropAnimationSideEffects({\n    styles: {\n      active: {\n        opacity: \"0.4\",\n      },\n    },\n  }),\n};\n"],"names":["SortableItemContext","createContext","SortableListDragHandle","rest","attributes","listeners","ref","useContext","dndContext","useDndContext","jsx","Button","SortableListItem","content","hideHandle","id","itemProps","isDragging","setNodeRef","setActivatorNodeRef","transform","transition","useSortable","context","useMemo","List.Item","CSS","Flex","Text","SortableList","items","itemsProps","onChange","active","setActive","useState","activeItem","item","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","over","activeIndex","overIndex","arrayMove","SortableContext","jsxs","List.Root","DragOverlay","dropAnimationConfig","defaultDropAnimationSideEffects"],"mappings":"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"}
+{"version":3,"file":"sortableList.component-DcjKdsDK.js","sources":["../../src/components/SortableList/components/SortableListItem/sortableListItem.context.ts","../../src/components/SortableList/components/SortableListDragHandle/sortableListDragHandle.component.tsx","../../src/components/SortableList/components/SortableListItem/sortableListItem.component.tsx","../../src/components/SortableList/sortableList.component.tsx"],"sourcesContent":["import {\n  DraggableAttributes,\n  DraggableSyntheticListeners,\n} from \"@dnd-kit/core/dist/hooks/useDraggable\";\nimport { createContext } from \"react\";\n\ninterface Context {\n  attributes?: DraggableAttributes;\n  listeners: DraggableSyntheticListeners;\n  ref(node: HTMLElement | null): void;\n}\n\nexport const SortableItemContext = createContext<Context>({\n  attributes: undefined,\n  listeners: undefined,\n  ref() {},\n});\n","import React, { useContext } from \"react\";\n\nimport { useDndContext } from \"@dnd-kit/core\";\nimport { Button, ButtonProps } from \"../../../Button/button.component\";\nimport { SortableItemContext } from \"../SortableListItem/sortableListItem.context\";\n\nexport const SortableListDragHandle = ({\n  ...rest\n}: ButtonProps): React.JSX.Element => {\n  const { attributes, listeners, ref } = useContext(SortableItemContext);\n  const dndContext = useDndContext();\n\n  return (\n    <Button\n      className=\"SortableList__DragHandle\"\n      data-testid=\"kibble-sortable-list-drag-handle\"\n      ref={ref}\n      cursor={dndContext.activatorEvent ? \"grabbing\" : \"grab\"}\n      iconName=\"grid\"\n      size=\"sm\"\n      variant=\"ghostNeutral\"\n      {...attributes}\n      {...listeners}\n      {...rest}\n    />\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { List } from \"@chakra-ui/react/list\";\nimport { UniqueIdentifier } from \"@dnd-kit/core\";\nimport { useSortable } from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { SortableItemContext } from \"./sortableListItem.context\";\nimport { SortableListDragHandle } from \"../SortableListDragHandle/sortableListDragHandle.component\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Text } from \"components/Text/text.component\";\n\nexport interface SortableListItemProps {\n  content: React.ReactNode;\n  id: UniqueIdentifier;\n}\n\ninterface InternalSortableListItemProps extends SortableListItemProps {\n  hideHandle?: boolean;\n  itemProps?: Omit<List.ItemProps, \"id\" | \"content\">;\n}\n\nexport const SortableListItem = ({\n  content,\n  hideHandle,\n  id,\n  itemProps,\n}: InternalSortableListItemProps): React.JSX.Element => {\n  const {\n    attributes,\n    isDragging,\n    listeners,\n    setNodeRef,\n    setActivatorNodeRef,\n    transform,\n    transition,\n  } = useSortable({\n    id,\n  });\n\n  const context = useMemo(\n    () => ({\n      attributes,\n      listeners,\n      ref: setActivatorNodeRef,\n    }),\n    [attributes, listeners, setActivatorNodeRef],\n  );\n\n  return (\n    <SortableItemContext.Provider value={context}>\n      <List.Item\n        className=\"SortableList__Item\"\n        data-testid=\"kibble-sortable-list-item\"\n        ref={setNodeRef}\n        {...itemProps}\n        listStyleType=\"none\"\n        {...(isDragging && { opacity: 0.4 })}\n        transition={transition}\n        transform={CSS.Translate.toString(transform)}\n      >\n        <Flex alignItems=\"center\" gap={2} width=\"100%\">\n          {!hideHandle && <SortableListDragHandle />}\n          {typeof content === \"string\" ? (\n            <Text size=\"sm\">{content}</Text>\n          ) : (\n            content\n          )}\n        </Flex>\n      </List.Item>\n    </SortableItemContext.Provider>\n  );\n};\n","import React, { useMemo, useState } from \"react\";\nimport { List } from \"@chakra-ui/react/list\";\nimport {\n  defaultDropAnimationSideEffects,\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport type { Active, DropAnimation } from \"@dnd-kit/core\";\nimport {\n  SortableContext,\n  arrayMove,\n  sortableKeyboardCoordinates,\n} from \"@dnd-kit/sortable\";\nimport {\n  SortableListItem,\n  SortableListItemProps,\n} from \"./components/SortableListItem/sortableListItem.component\";\n\nexport interface SortableListProps extends Omit<List.RootProps, \"onChange\"> {\n  hideHandle?: boolean;\n  items: SortableListItemProps[];\n  itemsProps?: Omit<List.ItemProps, \"id\" | \"content\">;\n  onChange(items: SortableListItemProps[]): void;\n}\n\nexport const SortableList = ({\n  hideHandle = false,\n  items,\n  itemsProps,\n  onChange,\n  ...rest\n}: SortableListProps): React.JSX.Element => {\n  const [active, setActive] = useState<Active | null>(null);\n  const activeItem = useMemo(\n    () => items.find((item) => item.id === active?.id),\n    [active, items],\n  );\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  );\n\n  return (\n    <DndContext\n      sensors={sensors}\n      onDragStart={({ active }): void => {\n        setActive(active);\n      }}\n      onDragEnd={({ active, over }): void => {\n        if (over && active.id !== over?.id) {\n          const activeIndex = items.findIndex(({ id }) => id === active.id);\n          const overIndex = items.findIndex(({ id }) => id === over.id);\n\n          onChange(arrayMove(items, activeIndex, overIndex));\n        }\n        setActive(null);\n      }}\n      onDragCancel={(): void => setActive(null)}\n    >\n      <SortableContext items={items}>\n        <List.Root\n          className=\"SortableList\"\n          data-testid=\"kibble-sortable-list\"\n          gap={2}\n          {...rest}\n        >\n          {items.map((item) => (\n            <SortableListItem\n              key={item.id}\n              {...item}\n              itemProps={itemsProps}\n              hideHandle={hideHandle}\n            />\n          ))}\n\n          {activeItem && (\n            <DragOverlay dropAnimation={dropAnimationConfig}>\n              <SortableListItem\n                {...activeItem}\n                itemProps={itemsProps}\n                hideHandle={hideHandle}\n              />\n            </DragOverlay>\n          )}\n        </List.Root>\n      </SortableContext>\n    </DndContext>\n  );\n};\n\nconst dropAnimationConfig: DropAnimation = {\n  sideEffects: defaultDropAnimationSideEffects({\n    styles: {\n      active: {\n        opacity: \"0.4\",\n      },\n    },\n  }),\n};\n"],"names":["SortableItemContext","createContext","SortableListDragHandle","rest","attributes","listeners","ref","useContext","dndContext","useDndContext","jsx","Button","SortableListItem","content","hideHandle","id","itemProps","isDragging","setNodeRef","setActivatorNodeRef","transform","transition","useSortable","context","useMemo","List.Item","CSS","Flex","Text","SortableList","items","itemsProps","onChange","active","setActive","useState","activeItem","item","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","over","activeIndex","overIndex","arrayMove","SortableContext","jsxs","List.Root","DragOverlay","dropAnimationConfig","defaultDropAnimationSideEffects"],"mappings":"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"}

package/dist/chunks/{sortableList.component-DAIHsGEA.js → sortableList.component-_DXfCTac.js}

@@ -1,7 +1,7 @@
 import { x as t } from "./vendor-BBfll6i3.js";
 import { createContext as v, useContext as j, useMemo as S, useState as C } from "react";
 import { u as D, a as h, C as y, b as I, c as m, D as L, S as N, d as A, e as E, f as P, s as R, K as _, P as k } from "./dnd-DDR6viHX.js";
-import { B as K } from "./button.component-BiW8RE1U.js";
+import { B as K } from "./button.component-CA9bIFbq.js";
 import { W as T } from "./text.component-XYjOAc2s.js";
 import { aC as z, F as B, aD as F } from "./chakra-BqBkjpvZ.js";
 const g = v({
@@ -142,4 +142,4 @@ const g = v({
 export {
   Q as S
 };
-//# sourceMappingURL=sortableList.component-DAIHsGEA.js.map
+//# sourceMappingURL=sortableList.component-_DXfCTac.js.map

package/dist/chunks/{sortableList.component-DAIHsGEA.js.map → sortableList.component-_DXfCTac.js.map}

@@ -1 +1 @@
-{"version":3,"file":"sortableList.component-DAIHsGEA.js","sources":["../../src/components/SortableList/components/SortableListItem/sortableListItem.context.ts","../../src/components/SortableList/components/SortableListDragHandle/sortableListDragHandle.component.tsx","../../src/components/SortableList/components/SortableListItem/sortableListItem.component.tsx","../../src/components/SortableList/sortableList.component.tsx"],"sourcesContent":["import {\n  DraggableAttributes,\n  DraggableSyntheticListeners,\n} from \"@dnd-kit/core/dist/hooks/useDraggable\";\nimport { createContext } from \"react\";\n\ninterface Context {\n  attributes?: DraggableAttributes;\n  listeners: DraggableSyntheticListeners;\n  ref(node: HTMLElement | null): void;\n}\n\nexport const SortableItemContext = createContext<Context>({\n  attributes: undefined,\n  listeners: undefined,\n  ref() {},\n});\n","import React, { useContext } from \"react\";\n\nimport { useDndContext } from \"@dnd-kit/core\";\nimport { Button, ButtonProps } from \"../../../Button/button.component\";\nimport { SortableItemContext } from \"../SortableListItem/sortableListItem.context\";\n\nexport const SortableListDragHandle = ({\n  ...rest\n}: ButtonProps): React.JSX.Element => {\n  const { attributes, listeners, ref } = useContext(SortableItemContext);\n  const dndContext = useDndContext();\n\n  return (\n    <Button\n      className=\"SortableList__DragHandle\"\n      data-testid=\"kibble-sortable-list-drag-handle\"\n      ref={ref}\n      cursor={dndContext.activatorEvent ? \"grabbing\" : \"grab\"}\n      iconName=\"grid\"\n      size=\"sm\"\n      variant=\"ghostNeutral\"\n      {...attributes}\n      {...listeners}\n      {...rest}\n    />\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { List } from \"@chakra-ui/react/list\";\nimport { UniqueIdentifier } from \"@dnd-kit/core\";\nimport { useSortable } from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { SortableItemContext } from \"./sortableListItem.context\";\nimport { SortableListDragHandle } from \"../SortableListDragHandle/sortableListDragHandle.component\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Text } from \"components/Text/text.component\";\n\nexport interface SortableListItemProps {\n  content: React.ReactNode;\n  id: UniqueIdentifier;\n}\n\ninterface InternalSortableListItemProps extends SortableListItemProps {\n  hideHandle?: boolean;\n  itemProps?: Omit<List.ItemProps, \"id\" | \"content\">;\n}\n\nexport const SortableListItem = ({\n  content,\n  hideHandle,\n  id,\n  itemProps,\n}: InternalSortableListItemProps): React.JSX.Element => {\n  const {\n    attributes,\n    isDragging,\n    listeners,\n    setNodeRef,\n    setActivatorNodeRef,\n    transform,\n    transition,\n  } = useSortable({\n    id,\n  });\n\n  const context = useMemo(\n    () => ({\n      attributes,\n      listeners,\n      ref: setActivatorNodeRef,\n    }),\n    [attributes, listeners, setActivatorNodeRef],\n  );\n\n  return (\n    <SortableItemContext.Provider value={context}>\n      <List.Item\n        className=\"SortableList__Item\"\n        data-testid=\"kibble-sortable-list-item\"\n        ref={setNodeRef}\n        {...itemProps}\n        listStyleType=\"none\"\n        {...(isDragging && { opacity: 0.4 })}\n        transition={transition}\n        transform={CSS.Translate.toString(transform)}\n      >\n        <Flex alignItems=\"center\" gap={2} width=\"100%\">\n          {!hideHandle && <SortableListDragHandle />}\n          {typeof content === \"string\" ? (\n            <Text size=\"sm\">{content}</Text>\n          ) : (\n            content\n          )}\n        </Flex>\n      </List.Item>\n    </SortableItemContext.Provider>\n  );\n};\n","import React, { useMemo, useState } from \"react\";\nimport { List } from \"@chakra-ui/react/list\";\nimport {\n  defaultDropAnimationSideEffects,\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport type { Active, DropAnimation } from \"@dnd-kit/core\";\nimport {\n  SortableContext,\n  arrayMove,\n  sortableKeyboardCoordinates,\n} from \"@dnd-kit/sortable\";\nimport {\n  SortableListItem,\n  SortableListItemProps,\n} from \"./components/SortableListItem/sortableListItem.component\";\n\nexport interface SortableListProps extends Omit<List.RootProps, \"onChange\"> {\n  hideHandle?: boolean;\n  items: SortableListItemProps[];\n  itemsProps?: Omit<List.ItemProps, \"id\" | \"content\">;\n  onChange(items: SortableListItemProps[]): void;\n}\n\nexport const SortableList = ({\n  hideHandle = false,\n  items,\n  itemsProps,\n  onChange,\n  ...rest\n}: SortableListProps): React.JSX.Element => {\n  const [active, setActive] = useState<Active | null>(null);\n  const activeItem = useMemo(\n    () => items.find((item) => item.id === active?.id),\n    [active, items],\n  );\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  );\n\n  return (\n    <DndContext\n      sensors={sensors}\n      onDragStart={({ active }): void => {\n        setActive(active);\n      }}\n      onDragEnd={({ active, over }): void => {\n        if (over && active.id !== over?.id) {\n          const activeIndex = items.findIndex(({ id }) => id === active.id);\n          const overIndex = items.findIndex(({ id }) => id === over.id);\n\n          onChange(arrayMove(items, activeIndex, overIndex));\n        }\n        setActive(null);\n      }}\n      onDragCancel={(): void => setActive(null)}\n    >\n      <SortableContext items={items}>\n        <List.Root\n          className=\"SortableList\"\n          data-testid=\"kibble-sortable-list\"\n          gap={2}\n          {...rest}\n        >\n          {items.map((item) => (\n            <SortableListItem\n              key={item.id}\n              {...item}\n              itemProps={itemsProps}\n              hideHandle={hideHandle}\n            />\n          ))}\n\n          {activeItem && (\n            <DragOverlay dropAnimation={dropAnimationConfig}>\n              <SortableListItem\n                {...activeItem}\n                itemProps={itemsProps}\n                hideHandle={hideHandle}\n              />\n            </DragOverlay>\n          )}\n        </List.Root>\n      </SortableContext>\n    </DndContext>\n  );\n};\n\nconst dropAnimationConfig: DropAnimation = {\n  sideEffects: defaultDropAnimationSideEffects({\n    styles: {\n      active: {\n        opacity: \"0.4\",\n      },\n    },\n  }),\n};\n"],"names":["SortableItemContext","createContext","SortableListDragHandle","rest","attributes","listeners","ref","useContext","dndContext","useDndContext","jsx","Button","SortableListItem","content","hideHandle","id","itemProps","isDragging","setNodeRef","setActivatorNodeRef","transform","transition","useSortable","context","useMemo","List.Item","CSS","Flex","Text","SortableList","items","itemsProps","onChange","active","setActive","useState","activeItem","item","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","over","activeIndex","overIndex","arrayMove","SortableContext","jsxs","List.Root","DragOverlay","dropAnimationConfig","defaultDropAnimationSideEffects"],"mappings":"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"}
+{"version":3,"file":"sortableList.component-_DXfCTac.js","sources":["../../src/components/SortableList/components/SortableListItem/sortableListItem.context.ts","../../src/components/SortableList/components/SortableListDragHandle/sortableListDragHandle.component.tsx","../../src/components/SortableList/components/SortableListItem/sortableListItem.component.tsx","../../src/components/SortableList/sortableList.component.tsx"],"sourcesContent":["import {\n  DraggableAttributes,\n  DraggableSyntheticListeners,\n} from \"@dnd-kit/core/dist/hooks/useDraggable\";\nimport { createContext } from \"react\";\n\ninterface Context {\n  attributes?: DraggableAttributes;\n  listeners: DraggableSyntheticListeners;\n  ref(node: HTMLElement | null): void;\n}\n\nexport const SortableItemContext = createContext<Context>({\n  attributes: undefined,\n  listeners: undefined,\n  ref() {},\n});\n","import React, { useContext } from \"react\";\n\nimport { useDndContext } from \"@dnd-kit/core\";\nimport { Button, ButtonProps } from \"../../../Button/button.component\";\nimport { SortableItemContext } from \"../SortableListItem/sortableListItem.context\";\n\nexport const SortableListDragHandle = ({\n  ...rest\n}: ButtonProps): React.JSX.Element => {\n  const { attributes, listeners, ref } = useContext(SortableItemContext);\n  const dndContext = useDndContext();\n\n  return (\n    <Button\n      className=\"SortableList__DragHandle\"\n      data-testid=\"kibble-sortable-list-drag-handle\"\n      ref={ref}\n      cursor={dndContext.activatorEvent ? \"grabbing\" : \"grab\"}\n      iconName=\"grid\"\n      size=\"sm\"\n      variant=\"ghostNeutral\"\n      {...attributes}\n      {...listeners}\n      {...rest}\n    />\n  );\n};\n","import React, { useMemo } from \"react\";\nimport { List } from \"@chakra-ui/react/list\";\nimport { UniqueIdentifier } from \"@dnd-kit/core\";\nimport { useSortable } from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { SortableItemContext } from \"./sortableListItem.context\";\nimport { SortableListDragHandle } from \"../SortableListDragHandle/sortableListDragHandle.component\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Text } from \"components/Text/text.component\";\n\nexport interface SortableListItemProps {\n  content: React.ReactNode;\n  id: UniqueIdentifier;\n}\n\ninterface InternalSortableListItemProps extends SortableListItemProps {\n  hideHandle?: boolean;\n  itemProps?: Omit<List.ItemProps, \"id\" | \"content\">;\n}\n\nexport const SortableListItem = ({\n  content,\n  hideHandle,\n  id,\n  itemProps,\n}: InternalSortableListItemProps): React.JSX.Element => {\n  const {\n    attributes,\n    isDragging,\n    listeners,\n    setNodeRef,\n    setActivatorNodeRef,\n    transform,\n    transition,\n  } = useSortable({\n    id,\n  });\n\n  const context = useMemo(\n    () => ({\n      attributes,\n      listeners,\n      ref: setActivatorNodeRef,\n    }),\n    [attributes, listeners, setActivatorNodeRef],\n  );\n\n  return (\n    <SortableItemContext.Provider value={context}>\n      <List.Item\n        className=\"SortableList__Item\"\n        data-testid=\"kibble-sortable-list-item\"\n        ref={setNodeRef}\n        {...itemProps}\n        listStyleType=\"none\"\n        {...(isDragging && { opacity: 0.4 })}\n        transition={transition}\n        transform={CSS.Translate.toString(transform)}\n      >\n        <Flex alignItems=\"center\" gap={2} width=\"100%\">\n          {!hideHandle && <SortableListDragHandle />}\n          {typeof content === \"string\" ? (\n            <Text size=\"sm\">{content}</Text>\n          ) : (\n            content\n          )}\n        </Flex>\n      </List.Item>\n    </SortableItemContext.Provider>\n  );\n};\n","import React, { useMemo, useState } from \"react\";\nimport { List } from \"@chakra-ui/react/list\";\nimport {\n  defaultDropAnimationSideEffects,\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport type { Active, DropAnimation } from \"@dnd-kit/core\";\nimport {\n  SortableContext,\n  arrayMove,\n  sortableKeyboardCoordinates,\n} from \"@dnd-kit/sortable\";\nimport {\n  SortableListItem,\n  SortableListItemProps,\n} from \"./components/SortableListItem/sortableListItem.component\";\n\nexport interface SortableListProps extends Omit<List.RootProps, \"onChange\"> {\n  hideHandle?: boolean;\n  items: SortableListItemProps[];\n  itemsProps?: Omit<List.ItemProps, \"id\" | \"content\">;\n  onChange(items: SortableListItemProps[]): void;\n}\n\nexport const SortableList = ({\n  hideHandle = false,\n  items,\n  itemsProps,\n  onChange,\n  ...rest\n}: SortableListProps): React.JSX.Element => {\n  const [active, setActive] = useState<Active | null>(null);\n  const activeItem = useMemo(\n    () => items.find((item) => item.id === active?.id),\n    [active, items],\n  );\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  );\n\n  return (\n    <DndContext\n      sensors={sensors}\n      onDragStart={({ active }): void => {\n        setActive(active);\n      }}\n      onDragEnd={({ active, over }): void => {\n        if (over && active.id !== over?.id) {\n          const activeIndex = items.findIndex(({ id }) => id === active.id);\n          const overIndex = items.findIndex(({ id }) => id === over.id);\n\n          onChange(arrayMove(items, activeIndex, overIndex));\n        }\n        setActive(null);\n      }}\n      onDragCancel={(): void => setActive(null)}\n    >\n      <SortableContext items={items}>\n        <List.Root\n          className=\"SortableList\"\n          data-testid=\"kibble-sortable-list\"\n          gap={2}\n          {...rest}\n        >\n          {items.map((item) => (\n            <SortableListItem\n              key={item.id}\n              {...item}\n              itemProps={itemsProps}\n              hideHandle={hideHandle}\n            />\n          ))}\n\n          {activeItem && (\n            <DragOverlay dropAnimation={dropAnimationConfig}>\n              <SortableListItem\n                {...activeItem}\n                itemProps={itemsProps}\n                hideHandle={hideHandle}\n              />\n            </DragOverlay>\n          )}\n        </List.Root>\n      </SortableContext>\n    </DndContext>\n  );\n};\n\nconst dropAnimationConfig: DropAnimation = {\n  sideEffects: defaultDropAnimationSideEffects({\n    styles: {\n      active: {\n        opacity: \"0.4\",\n      },\n    },\n  }),\n};\n"],"names":["SortableItemContext","createContext","SortableListDragHandle","rest","attributes","listeners","ref","useContext","dndContext","useDndContext","jsx","Button","SortableListItem","content","hideHandle","id","itemProps","isDragging","setNodeRef","setActivatorNodeRef","transform","transition","useSortable","context","useMemo","List.Item","CSS","Flex","Text","SortableList","items","itemsProps","onChange","active","setActive","useState","activeItem","item","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","over","activeIndex","overIndex","arrayMove","SortableContext","jsxs","List.Root","DragOverlay","dropAnimationConfig","defaultDropAnimationSideEffects"],"mappings":"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"}

package/dist/chunks/{styledAvatar.types-DbSO8s7o.js → styledAvatar.types-ByQoyukM.js}

@@ -1,5 +1,5 @@
 import { x as c } from "./vendor-BBfll6i3.js";
-import { A as p } from "./avatar.component-DzvE2D-d.js";
+import { A as p } from "./avatar.component-DLqm7tQt.js";
 const y = ({
   type: l = "Client",
   ...o
@@ -61,4 +61,4 @@ export {
   y as S,
   C as s
 };
-//# sourceMappingURL=styledAvatar.types-DbSO8s7o.js.map
+//# sourceMappingURL=styledAvatar.types-ByQoyukM.js.map

package/dist/chunks/{styledAvatar.types-DbSO8s7o.js.map → styledAvatar.types-ByQoyukM.js.map}

@@ -1 +1 @@
-{"version":3,"file":"styledAvatar.types-DbSO8s7o.js","sources":["../../src/patterns/StyledAvatar/styledAvatar.component.tsx","../../src/patterns/StyledAvatar/styledAvatar.types.ts"],"sourcesContent":["import React from \"react\";\nimport { Avatar, AvatarProps } from \"components/Avatar/avatar.component\";\nimport { StyledAvatarType } from \"./styledAvatar.types\";\n\nexport interface StyledAvatarProps extends AvatarProps {\n  type?: StyledAvatarType;\n}\n\nexport const StyledAvatar = ({\n  type = \"Client\",\n  ...rest\n}: StyledAvatarProps): React.JSX.Element => {\n  const {\n    name,\n    tooltipProps = { placement: \"top\", ...rest.tooltipProps },\n    onClick,\n  } = rest;\n\n  const testClientStyleProps: Partial<AvatarProps> = {\n    variant: \"outlineYellow\",\n    tooltipProps: {\n      ...tooltipProps,\n      label: tooltipProps?.label || `${name} (Test Client)`,\n    },\n  };\n\n  const smsStyleProps: Partial<AvatarProps> = {\n    iconName: \"cellphone\",\n    tooltipProps: {\n      ...tooltipProps,\n      label:\n        tooltipProps?.label ||\n        `Text messages sent from ${name || \"unknown number\"}`,\n    },\n  };\n\n  const automatedStyleProps: Partial<AvatarProps> = {\n    iconName: \"robot\",\n    backgroundColor: \"background.primary\",\n    hideBorder: true,\n    color: \"text.contrast\",\n    size: \"sm\",\n    showTooltip: false,\n    cursor: \"default\",\n  };\n\n  const clinicStyleProps: Partial<AvatarProps> = {\n    variant: \"outlineAccent\",\n    name: name || \"Sys\",\n  };\n\n  const styleProps: Record<StyledAvatarType, Partial<AvatarProps>> = {\n    Automated: automatedStyleProps,\n    Client: {},\n    Clinic: clinicStyleProps,\n    SMS: smsStyleProps,\n    TestClient: testClientStyleProps,\n  };\n\n  return (\n    <Avatar\n      className=\"StyledAvatar\"\n      data-testid={`kibble-styled-avatar-${type}`}\n      onClick={(e): void => {\n        e.stopPropagation();\n        if (onClick) {\n          onClick(e);\n        }\n      }}\n      {...rest}\n      {...styleProps[type]}\n    />\n  );\n};\n","export const styledAvatarTypes = [\n  \"Client\",\n  \"SMS\",\n  \"TestClient\",\n  \"Automated\",\n  \"Clinic\",\n] as const;\nexport type StyledAvatarType = (typeof styledAvatarTypes)[number];\n"],"names":["StyledAvatar","type","rest","name","tooltipProps","onClick","testClientStyleProps","smsStyleProps","styleProps","jsx","Avatar","e","styledAvatarTypes"],"mappings":";;AAQO,MAAMA,IAAe,CAAC;AAAA,EAC3B,MAAAC,IAAO;AAAA,EACP,GAAGC;AACL,MAA4C;AACpC,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,cAAAC,IAAe,EAAE,WAAW,OAAO,GAAGF,EAAK,aAAa;AAAA,IACxD,SAAAG;AAAA,EAAA,IACEH,GAEEI,IAA6C;AAAA,IACjD,SAAS;AAAA,IACT,cAAc;AAAA,MACZ,GAAGF;AAAA,MACH,OAAOA,GAAc,SAAS,GAAGD,CAAI;AAAA,IAAA;AAAA,EAEzC,GAEMI,IAAsC;AAAA,IAC1C,UAAU;AAAA,IACV,cAAc;AAAA,MACZ,GAAGH;AAAA,MACH,OACEA,GAAc,SACd,2BAA2BD,KAAQ,gBAAgB;AAAA,IAAA;AAAA,EAEzD,GAiBMK,IAA6D;AAAA,IACjE,WAhBgD;AAAA,MAChD,UAAU;AAAA,MACV,iBAAiB;AAAA,MACjB,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,MAAM;AAAA,MACN,aAAa;AAAA,MACb,QAAQ;AAAA,IACV;AAAA,IASE,QAAQ,CAAC;AAAA,IACT,QAR6C;AAAA,MAC7C,SAAS;AAAA,MACT,MAAML,KAAQ;AAAA,IAChB;AAAA,IAME,KAAKI;AAAA,IACL,YAAYD;AAAA,EACd;AAGE,SAAAG,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa,wBAAwBT,CAAI;AAAA,MACzC,SAAS,CAACU,MAAY;AACpB,QAAAA,EAAE,gBAAgB,GACdN,KACFA,EAAQM,CAAC;AAAA,MAEb;AAAA,MACC,GAAGT;AAAA,MACH,GAAGM,EAAWP,CAAI;AAAA,IAAA;AAAA,EACrB;AAEJ,GCzEaW,IAAoB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;"}
+{"version":3,"file":"styledAvatar.types-ByQoyukM.js","sources":["../../src/patterns/StyledAvatar/styledAvatar.component.tsx","../../src/patterns/StyledAvatar/styledAvatar.types.ts"],"sourcesContent":["import React from \"react\";\nimport { Avatar, AvatarProps } from \"components/Avatar/avatar.component\";\nimport { StyledAvatarType } from \"./styledAvatar.types\";\n\nexport interface StyledAvatarProps extends AvatarProps {\n  type?: StyledAvatarType;\n}\n\nexport const StyledAvatar = ({\n  type = \"Client\",\n  ...rest\n}: StyledAvatarProps): React.JSX.Element => {\n  const {\n    name,\n    tooltipProps = { placement: \"top\", ...rest.tooltipProps },\n    onClick,\n  } = rest;\n\n  const testClientStyleProps: Partial<AvatarProps> = {\n    variant: \"outlineYellow\",\n    tooltipProps: {\n      ...tooltipProps,\n      label: tooltipProps?.label || `${name} (Test Client)`,\n    },\n  };\n\n  const smsStyleProps: Partial<AvatarProps> = {\n    iconName: \"cellphone\",\n    tooltipProps: {\n      ...tooltipProps,\n      label:\n        tooltipProps?.label ||\n        `Text messages sent from ${name || \"unknown number\"}`,\n    },\n  };\n\n  const automatedStyleProps: Partial<AvatarProps> = {\n    iconName: \"robot\",\n    backgroundColor: \"background.primary\",\n    hideBorder: true,\n    color: \"text.contrast\",\n    size: \"sm\",\n    showTooltip: false,\n    cursor: \"default\",\n  };\n\n  const clinicStyleProps: Partial<AvatarProps> = {\n    variant: \"outlineAccent\",\n    name: name || \"Sys\",\n  };\n\n  const styleProps: Record<StyledAvatarType, Partial<AvatarProps>> = {\n    Automated: automatedStyleProps,\n    Client: {},\n    Clinic: clinicStyleProps,\n    SMS: smsStyleProps,\n    TestClient: testClientStyleProps,\n  };\n\n  return (\n    <Avatar\n      className=\"StyledAvatar\"\n      data-testid={`kibble-styled-avatar-${type}`}\n      onClick={(e): void => {\n        e.stopPropagation();\n        if (onClick) {\n          onClick(e);\n        }\n      }}\n      {...rest}\n      {...styleProps[type]}\n    />\n  );\n};\n","export const styledAvatarTypes = [\n  \"Client\",\n  \"SMS\",\n  \"TestClient\",\n  \"Automated\",\n  \"Clinic\",\n] as const;\nexport type StyledAvatarType = (typeof styledAvatarTypes)[number];\n"],"names":["StyledAvatar","type","rest","name","tooltipProps","onClick","testClientStyleProps","smsStyleProps","styleProps","jsx","Avatar","e","styledAvatarTypes"],"mappings":";;AAQO,MAAMA,IAAe,CAAC;AAAA,EAC3B,MAAAC,IAAO;AAAA,EACP,GAAGC;AACL,MAA4C;AACpC,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,cAAAC,IAAe,EAAE,WAAW,OAAO,GAAGF,EAAK,aAAa;AAAA,IACxD,SAAAG;AAAA,EAAA,IACEH,GAEEI,IAA6C;AAAA,IACjD,SAAS;AAAA,IACT,cAAc;AAAA,MACZ,GAAGF;AAAA,MACH,OAAOA,GAAc,SAAS,GAAGD,CAAI;AAAA,IAAA;AAAA,EAEzC,GAEMI,IAAsC;AAAA,IAC1C,UAAU;AAAA,IACV,cAAc;AAAA,MACZ,GAAGH;AAAA,MACH,OACEA,GAAc,SACd,2BAA2BD,KAAQ,gBAAgB;AAAA,IAAA;AAAA,EAEzD,GAiBMK,IAA6D;AAAA,IACjE,WAhBgD;AAAA,MAChD,UAAU;AAAA,MACV,iBAAiB;AAAA,MACjB,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,MAAM;AAAA,MACN,aAAa;AAAA,MACb,QAAQ;AAAA,IACV;AAAA,IASE,QAAQ,CAAC;AAAA,IACT,QAR6C;AAAA,MAC7C,SAAS;AAAA,MACT,MAAML,KAAQ;AAAA,IAChB;AAAA,IAME,KAAKI;AAAA,IACL,YAAYD;AAAA,EACd;AAGE,SAAAG,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa,wBAAwBT,CAAI;AAAA,MACzC,SAAS,CAACU,MAAY;AACpB,QAAAA,EAAE,gBAAgB,GACdN,KACFA,EAAQM,CAAC;AAAA,MAEb;AAAA,MACC,GAAGT;AAAA,MACH,GAAGM,EAAWP,CAAI;AAAA,IAAA;AAAA,EACrB;AAEJ,GCzEaW,IAAoB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;"}

package/dist/chunks/{styledAvatar.types-Cj3j5vXC.js → styledAvatar.types-CpU5SOAS.js}

@@ -1,2 +1,2 @@
-"use strict";const c=require("./vendor-D-x6W6ez.js"),p=require("./avatar.component-Coq-0l7p.js"),d=({type:l="Client",...e})=>{const{name:o,tooltipProps:t={placement:"top",...e.tooltipProps},onClick:s}=e,n={variant:"outlineYellow",tooltipProps:{...t,label:t?.label||`${o} (Test Client)`}},r={iconName:"cellphone",tooltipProps:{...t,label:t?.label||`Text messages sent from ${o||"unknown number"}`}},i={Automated:{iconName:"robot",backgroundColor:"background.primary",hideBorder:!0,color:"text.contrast",size:"sm",showTooltip:!1,cursor:"default"},Client:{},Clinic:{variant:"outlineAccent",name:o||"Sys"},SMS:r,TestClient:n};return c.jsxRuntimeExports.jsx(p.Avatar,{className:"StyledAvatar","data-testid":`kibble-styled-avatar-${l}`,onClick:a=>{a.stopPropagation(),s&&s(a)},...e,...i[l]})},m=["Client","SMS","TestClient","Automated","Clinic"];exports.StyledAvatar=d;exports.styledAvatarTypes=m;
-//# sourceMappingURL=styledAvatar.types-Cj3j5vXC.js.map
+"use strict";const c=require("./vendor-D-x6W6ez.js"),p=require("./avatar.component-B14bRpeL.js"),d=({type:l="Client",...e})=>{const{name:o,tooltipProps:t={placement:"top",...e.tooltipProps},onClick:s}=e,n={variant:"outlineYellow",tooltipProps:{...t,label:t?.label||`${o} (Test Client)`}},r={iconName:"cellphone",tooltipProps:{...t,label:t?.label||`Text messages sent from ${o||"unknown number"}`}},i={Automated:{iconName:"robot",backgroundColor:"background.primary",hideBorder:!0,color:"text.contrast",size:"sm",showTooltip:!1,cursor:"default"},Client:{},Clinic:{variant:"outlineAccent",name:o||"Sys"},SMS:r,TestClient:n};return c.jsxRuntimeExports.jsx(p.Avatar,{className:"StyledAvatar","data-testid":`kibble-styled-avatar-${l}`,onClick:a=>{a.stopPropagation(),s&&s(a)},...e,...i[l]})},m=["Client","SMS","TestClient","Automated","Clinic"];exports.StyledAvatar=d;exports.styledAvatarTypes=m;
+//# sourceMappingURL=styledAvatar.types-CpU5SOAS.js.map

package/dist/chunks/{styledAvatar.types-Cj3j5vXC.js.map → styledAvatar.types-CpU5SOAS.js.map}

@@ -1 +1 @@
-{"version":3,"file":"styledAvatar.types-Cj3j5vXC.js","sources":["../../src/patterns/StyledAvatar/styledAvatar.component.tsx","../../src/patterns/StyledAvatar/styledAvatar.types.ts"],"sourcesContent":["import React from \"react\";\nimport { Avatar, AvatarProps } from \"components/Avatar/avatar.component\";\nimport { StyledAvatarType } from \"./styledAvatar.types\";\n\nexport interface StyledAvatarProps extends AvatarProps {\n  type?: StyledAvatarType;\n}\n\nexport const StyledAvatar = ({\n  type = \"Client\",\n  ...rest\n}: StyledAvatarProps): React.JSX.Element => {\n  const {\n    name,\n    tooltipProps = { placement: \"top\", ...rest.tooltipProps },\n    onClick,\n  } = rest;\n\n  const testClientStyleProps: Partial<AvatarProps> = {\n    variant: \"outlineYellow\",\n    tooltipProps: {\n      ...tooltipProps,\n      label: tooltipProps?.label || `${name} (Test Client)`,\n    },\n  };\n\n  const smsStyleProps: Partial<AvatarProps> = {\n    iconName: \"cellphone\",\n    tooltipProps: {\n      ...tooltipProps,\n      label:\n        tooltipProps?.label ||\n        `Text messages sent from ${name || \"unknown number\"}`,\n    },\n  };\n\n  const automatedStyleProps: Partial<AvatarProps> = {\n    iconName: \"robot\",\n    backgroundColor: \"background.primary\",\n    hideBorder: true,\n    color: \"text.contrast\",\n    size: \"sm\",\n    showTooltip: false,\n    cursor: \"default\",\n  };\n\n  const clinicStyleProps: Partial<AvatarProps> = {\n    variant: \"outlineAccent\",\n    name: name || \"Sys\",\n  };\n\n  const styleProps: Record<StyledAvatarType, Partial<AvatarProps>> = {\n    Automated: automatedStyleProps,\n    Client: {},\n    Clinic: clinicStyleProps,\n    SMS: smsStyleProps,\n    TestClient: testClientStyleProps,\n  };\n\n  return (\n    <Avatar\n      className=\"StyledAvatar\"\n      data-testid={`kibble-styled-avatar-${type}`}\n      onClick={(e): void => {\n        e.stopPropagation();\n        if (onClick) {\n          onClick(e);\n        }\n      }}\n      {...rest}\n      {...styleProps[type]}\n    />\n  );\n};\n","export const styledAvatarTypes = [\n  \"Client\",\n  \"SMS\",\n  \"TestClient\",\n  \"Automated\",\n  \"Clinic\",\n] as const;\nexport type StyledAvatarType = (typeof styledAvatarTypes)[number];\n"],"names":["StyledAvatar","type","rest","name","tooltipProps","onClick","testClientStyleProps","smsStyleProps","styleProps","jsx","Avatar","e","styledAvatarTypes"],"mappings":"iGAQaA,EAAe,CAAC,CAC3B,KAAAC,EAAO,SACP,GAAGC,CACL,IAA4C,CACpC,KAAA,CACJ,KAAAC,EACA,aAAAC,EAAe,CAAE,UAAW,MAAO,GAAGF,EAAK,YAAa,EACxD,QAAAG,CAAA,EACEH,EAEEI,EAA6C,CACjD,QAAS,gBACT,aAAc,CACZ,GAAGF,EACH,MAAOA,GAAc,OAAS,GAAGD,CAAI,gBAAA,CAEzC,EAEMI,EAAsC,CAC1C,SAAU,YACV,aAAc,CACZ,GAAGH,EACH,MACEA,GAAc,OACd,2BAA2BD,GAAQ,gBAAgB,EAAA,CAEzD,EAiBMK,EAA6D,CACjE,UAhBgD,CAChD,SAAU,QACV,gBAAiB,qBACjB,WAAY,GACZ,MAAO,gBACP,KAAM,KACN,YAAa,GACb,OAAQ,SACV,EASE,OAAQ,CAAC,EACT,OAR6C,CAC7C,QAAS,gBACT,KAAML,GAAQ,KAChB,EAME,IAAKI,EACL,WAAYD,CACd,EAGE,OAAAG,EAAA,kBAAA,IAACC,EAAA,OAAA,CACC,UAAU,eACV,cAAa,wBAAwBT,CAAI,GACzC,QAAUU,GAAY,CACpBA,EAAE,gBAAgB,EACdN,GACFA,EAAQM,CAAC,CAEb,EACC,GAAGT,EACH,GAAGM,EAAWP,CAAI,CAAA,CACrB,CAEJ,ECzEaW,EAAoB,CAC/B,SACA,MACA,aACA,YACA,QACF"}
+{"version":3,"file":"styledAvatar.types-CpU5SOAS.js","sources":["../../src/patterns/StyledAvatar/styledAvatar.component.tsx","../../src/patterns/StyledAvatar/styledAvatar.types.ts"],"sourcesContent":["import React from \"react\";\nimport { Avatar, AvatarProps } from \"components/Avatar/avatar.component\";\nimport { StyledAvatarType } from \"./styledAvatar.types\";\n\nexport interface StyledAvatarProps extends AvatarProps {\n  type?: StyledAvatarType;\n}\n\nexport const StyledAvatar = ({\n  type = \"Client\",\n  ...rest\n}: StyledAvatarProps): React.JSX.Element => {\n  const {\n    name,\n    tooltipProps = { placement: \"top\", ...rest.tooltipProps },\n    onClick,\n  } = rest;\n\n  const testClientStyleProps: Partial<AvatarProps> = {\n    variant: \"outlineYellow\",\n    tooltipProps: {\n      ...tooltipProps,\n      label: tooltipProps?.label || `${name} (Test Client)`,\n    },\n  };\n\n  const smsStyleProps: Partial<AvatarProps> = {\n    iconName: \"cellphone\",\n    tooltipProps: {\n      ...tooltipProps,\n      label:\n        tooltipProps?.label ||\n        `Text messages sent from ${name || \"unknown number\"}`,\n    },\n  };\n\n  const automatedStyleProps: Partial<AvatarProps> = {\n    iconName: \"robot\",\n    backgroundColor: \"background.primary\",\n    hideBorder: true,\n    color: \"text.contrast\",\n    size: \"sm\",\n    showTooltip: false,\n    cursor: \"default\",\n  };\n\n  const clinicStyleProps: Partial<AvatarProps> = {\n    variant: \"outlineAccent\",\n    name: name || \"Sys\",\n  };\n\n  const styleProps: Record<StyledAvatarType, Partial<AvatarProps>> = {\n    Automated: automatedStyleProps,\n    Client: {},\n    Clinic: clinicStyleProps,\n    SMS: smsStyleProps,\n    TestClient: testClientStyleProps,\n  };\n\n  return (\n    <Avatar\n      className=\"StyledAvatar\"\n      data-testid={`kibble-styled-avatar-${type}`}\n      onClick={(e): void => {\n        e.stopPropagation();\n        if (onClick) {\n          onClick(e);\n        }\n      }}\n      {...rest}\n      {...styleProps[type]}\n    />\n  );\n};\n","export const styledAvatarTypes = [\n  \"Client\",\n  \"SMS\",\n  \"TestClient\",\n  \"Automated\",\n  \"Clinic\",\n] as const;\nexport type StyledAvatarType = (typeof styledAvatarTypes)[number];\n"],"names":["StyledAvatar","type","rest","name","tooltipProps","onClick","testClientStyleProps","smsStyleProps","styleProps","jsx","Avatar","e","styledAvatarTypes"],"mappings":"iGAQaA,EAAe,CAAC,CAC3B,KAAAC,EAAO,SACP,GAAGC,CACL,IAA4C,CACpC,KAAA,CACJ,KAAAC,EACA,aAAAC,EAAe,CAAE,UAAW,MAAO,GAAGF,EAAK,YAAa,EACxD,QAAAG,CAAA,EACEH,EAEEI,EAA6C,CACjD,QAAS,gBACT,aAAc,CACZ,GAAGF,EACH,MAAOA,GAAc,OAAS,GAAGD,CAAI,gBAAA,CAEzC,EAEMI,EAAsC,CAC1C,SAAU,YACV,aAAc,CACZ,GAAGH,EACH,MACEA,GAAc,OACd,2BAA2BD,GAAQ,gBAAgB,EAAA,CAEzD,EAiBMK,EAA6D,CACjE,UAhBgD,CAChD,SAAU,QACV,gBAAiB,qBACjB,WAAY,GACZ,MAAO,gBACP,KAAM,KACN,YAAa,GACb,OAAQ,SACV,EASE,OAAQ,CAAC,EACT,OAR6C,CAC7C,QAAS,gBACT,KAAML,GAAQ,KAChB,EAME,IAAKI,EACL,WAAYD,CACd,EAGE,OAAAG,EAAA,kBAAA,IAACC,EAAA,OAAA,CACC,UAAU,eACV,cAAa,wBAAwBT,CAAI,GACzC,QAAUU,GAAY,CACpBA,EAAE,gBAAgB,EACdN,GACFA,EAAQM,CAAC,CAEb,EACC,GAAGT,EACH,GAAGM,EAAWP,CAAI,CAAA,CACrB,CAEJ,ECzEaW,EAAoB,CAC/B,SACA,MACA,aACA,YACA,QACF"}

package/dist/chunks/{switch.component-B1fXLRiO.js → switch.component-C9WMHurt.js}

@@ -1,6 +1,6 @@
 import { x as t } from "./vendor-BBfll6i3.js";
 import n, { useMemo as l } from "react";
-import { w as m } from "./withFormControl-DSNvvAPD.js";
+import { w as m } from "./withFormControl-CDQGc9aO.js";
 import { S as w, a as d, b as h, c as p } from "./chakra-BqBkjpvZ.js";
 const f = m(
   ({
@@ -50,4 +50,4 @@ u.displayName = "Switch";
 export {
   u as W
 };
-//# sourceMappingURL=switch.component-B1fXLRiO.js.map
+//# sourceMappingURL=switch.component-C9WMHurt.js.map

package/dist/chunks/{switch.component-B1fXLRiO.js.map → switch.component-C9WMHurt.js.map}

@@ -1 +1 @@
-{"version":3,"file":"switch.component-B1fXLRiO.js","sources":["../../src/components/Switch/switch.component.tsx"],"sourcesContent":["import React, { ForwardedRef, useMemo } from \"react\";\nimport { Switch as CSwitch } from \"@chakra-ui/react/switch\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\nexport interface SwitchProps\n  extends WithFormControlProps,\n    Omit<CSwitch.RootProps, \"label\" | \"onChange\"> {\n  indeterminate?: boolean;\n  switchRef?: ForwardedRef<HTMLLabelElement>;\n  size?: FormControlSize;\n}\n\nconst Switch = withFormControl(\n  ({\n    children,\n    indeterminate = false,\n    onContrast,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    label,\n    size = \"md\",\n    switchRef,\n    ...rest\n  }: SwitchProps): React.JSX.Element => {\n    const _computedVariant = useMemo(() => {\n      if (indeterminate) {\n        return onContrast ? \"indeterminateOnContrast\" : \"indeterminate\";\n      } else {\n        return onContrast ? \"onContrast\" : \"default\";\n      }\n    }, [indeterminate, onContrast]);\n\n    return (\n      <CSwitch.Root\n        className=\"Switch\"\n        data-testid=\"kibble-switch\"\n        ref={switchRef}\n        size={size}\n        variant={_computedVariant}\n        {...rest}\n      >\n        <CSwitch.HiddenInput\n          className=\"Switch_Input\"\n          data-testid=\"kibble-switch-input\"\n        />\n        <CSwitch.Control\n          className=\"Switch_Control\"\n          data-testid=\"kibble-switch-control\"\n        />\n        {!!children && <CSwitch.Label>{children}</CSwitch.Label>}\n      </CSwitch.Root>\n    );\n  },\n);\n\nconst WrappedSwitch = React.forwardRef(\n  (props: SwitchProps, ref: ForwardedRef<HTMLLabelElement>) => (\n    <Switch switchRef={ref} {...props} />\n  ),\n);\n\nWrappedSwitch.displayName = \"Switch\";\n\nexport { WrappedSwitch as Switch };\n"],"names":["Switch","withFormControl","children","indeterminate","onContrast","label","size","switchRef","rest","_computedVariant","useMemo","jsxs","CSwitch.Root","jsx","CSwitch.HiddenInput","CSwitch.Control","CSwitch.Label","WrappedSwitch","React","props","ref"],"mappings":";;;;AAgBA,MAAMA,IAASC;AAAA,EACb,CAAC;AAAA,IACC,UAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,YAAAC;AAAA;AAAA,IAEA,OAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,MACiC;AAC9B,UAAAC,IAAmBC,EAAQ,MAC3BP,IACKC,IAAa,4BAA4B,kBAEzCA,IAAa,eAAe,WAEpC,CAACD,GAAeC,CAAU,CAAC;AAG5B,WAAAO,gBAAAA,EAAA;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,eAAY;AAAA,QACZ,KAAKL;AAAA,QACL,MAAAD;AAAA,QACA,SAASG;AAAA,QACR,GAAGD;AAAA,QAEJ,UAAA;AAAA,UAAAK,gBAAAA,EAAA;AAAA,YAACC;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAY;AAAA,YAAA;AAAA,UACd;AAAA,UACAD,gBAAAA,EAAA;AAAA,YAACE;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAY;AAAA,YAAA;AAAA,UACd;AAAA,UACC,CAAC,CAACb,2BAAac,GAAA,EAAe,UAAAd,EAAS,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAC1C;AAAA,EAAA;AAGN,GAEMe,IAAgBC,EAAM;AAAA,EAC1B,CAACC,GAAoBC,MACnBP,gBAAAA,MAACb,KAAO,WAAWoB,GAAM,GAAGD,EAAO,CAAA;AAEvC;AAEAF,EAAc,cAAc;"}
+{"version":3,"file":"switch.component-C9WMHurt.js","sources":["../../src/components/Switch/switch.component.tsx"],"sourcesContent":["import React, { ForwardedRef, useMemo } from \"react\";\nimport { Switch as CSwitch } from \"@chakra-ui/react/switch\";\nimport {\n  withFormControl,\n  WithFormControlProps,\n} from \"hocs/withFormControl/withFormControl\";\nimport { FormControlSize } from \"hocs/withFormControl/withFormControl.types\";\n\nexport interface SwitchProps\n  extends WithFormControlProps,\n    Omit<CSwitch.RootProps, \"label\" | \"onChange\"> {\n  indeterminate?: boolean;\n  switchRef?: ForwardedRef<HTMLLabelElement>;\n  size?: FormControlSize;\n}\n\nconst Switch = withFormControl(\n  ({\n    children,\n    indeterminate = false,\n    onContrast,\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    label,\n    size = \"md\",\n    switchRef,\n    ...rest\n  }: SwitchProps): React.JSX.Element => {\n    const _computedVariant = useMemo(() => {\n      if (indeterminate) {\n        return onContrast ? \"indeterminateOnContrast\" : \"indeterminate\";\n      } else {\n        return onContrast ? \"onContrast\" : \"default\";\n      }\n    }, [indeterminate, onContrast]);\n\n    return (\n      <CSwitch.Root\n        className=\"Switch\"\n        data-testid=\"kibble-switch\"\n        ref={switchRef}\n        size={size}\n        variant={_computedVariant}\n        {...rest}\n      >\n        <CSwitch.HiddenInput\n          className=\"Switch_Input\"\n          data-testid=\"kibble-switch-input\"\n        />\n        <CSwitch.Control\n          className=\"Switch_Control\"\n          data-testid=\"kibble-switch-control\"\n        />\n        {!!children && <CSwitch.Label>{children}</CSwitch.Label>}\n      </CSwitch.Root>\n    );\n  },\n);\n\nconst WrappedSwitch = React.forwardRef(\n  (props: SwitchProps, ref: ForwardedRef<HTMLLabelElement>) => (\n    <Switch switchRef={ref} {...props} />\n  ),\n);\n\nWrappedSwitch.displayName = \"Switch\";\n\nexport { WrappedSwitch as Switch };\n"],"names":["Switch","withFormControl","children","indeterminate","onContrast","label","size","switchRef","rest","_computedVariant","useMemo","jsxs","CSwitch.Root","jsx","CSwitch.HiddenInput","CSwitch.Control","CSwitch.Label","WrappedSwitch","React","props","ref"],"mappings":";;;;AAgBA,MAAMA,IAASC;AAAA,EACb,CAAC;AAAA,IACC,UAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,YAAAC;AAAA;AAAA,IAEA,OAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,MACiC;AAC9B,UAAAC,IAAmBC,EAAQ,MAC3BP,IACKC,IAAa,4BAA4B,kBAEzCA,IAAa,eAAe,WAEpC,CAACD,GAAeC,CAAU,CAAC;AAG5B,WAAAO,gBAAAA,EAAA;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,eAAY;AAAA,QACZ,KAAKL;AAAA,QACL,MAAAD;AAAA,QACA,SAASG;AAAA,QACR,GAAGD;AAAA,QAEJ,UAAA;AAAA,UAAAK,gBAAAA,EAAA;AAAA,YAACC;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAY;AAAA,YAAA;AAAA,UACd;AAAA,UACAD,gBAAAA,EAAA;AAAA,YAACE;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAY;AAAA,YAAA;AAAA,UACd;AAAA,UACC,CAAC,CAACb,2BAAac,GAAA,EAAe,UAAAd,EAAS,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAC1C;AAAA,EAAA;AAGN,GAEMe,IAAgBC,EAAM;AAAA,EAC1B,CAACC,GAAoBC,MACnBP,gBAAAA,MAACb,KAAO,WAAWoB,GAAM,GAAGD,EAAO,CAAA;AAEvC;AAEAF,EAAc,cAAc;"}