@televet/kibble-ui 4.0.0-beta.4 → 4.0.0-beta.40

package/dist/chunks/hocs/index-B-_GN7vC.js

@@ -1,2 +0,0 @@
-"use strict";const o=require("../chunks/vendor-D-x6W6ez.js"),l=require("react"),w=require("../components/index-FWhwzxBg.js"),r=require("../chunks/chakra-DmF8Cxqs.js"),E=require("../theme/index-7w_EQF8b.js"),T=e=>{const s=l.memo(e);function n({truncated:m=!1,noOfLines:g=1,children:x,tooltipProps:u,...d}){const[h,p]=l.useState(!1),a=l.useRef(null),b=l.useRef(null),t=l.useCallback(()=>{if(a.current){const c=a.current?.children[0].scrollHeight||0,i=a.current?.offsetHeight||0;p(c>i)}},[]);return l.useEffect(()=>{if(m&&a.current){let c;const i=()=>{window.clearTimeout(c),c=window.setTimeout(t,100)};return b.current=new ResizeObserver(()=>{i()}),b.current.observe(a.current),t(),()=>{window.clearTimeout(c),b.current&&b.current.disconnect()}}},[m,t]),m?o.jsxRuntimeExports.jsx(w.Tooltip,{...u,label:u?.label||x?.toLocaleString()||"",disabled:!h,"data-testid":"kibble-truncated-text-tooltip",children:o.jsxRuntimeExports.jsx(r.Box,{ref:a,display:"inline-block",position:"relative",className:"TruncatedText__Wrapper","data-testid":"kibble-truncated-text-wrapper",children:o.jsxRuntimeExports.jsx(s,{className:"TruncatedText__TextContent","data-testid":"kibble-truncated-text-content",...h&&{cursor:"pointer"},lineClamp:g,style:{textOverflow:"ellipsis",overflow:"hidden",wordWrap:"break-word",wordBreak:"break-word"},...d,children:x})})}):o.jsxRuntimeExports.jsx(s,{...d,children:x})}return n.displayName=`withTruncation(${e.displayName||e.name}`,l.memo(n)},N={sm:10,md:12,lg:14},z=e=>{const s=({disabled:n=!1,errorText:m="Field is invalid",formControlStyle:g,helperText:x,inlineField:u=!1,invalid:d=!1,invalidIconColor:h="warning",label:p,labelPosition:a="start",labelStyle:b,onContrast:t=!1,readOnly:c=!1,required:i=!1,showRequiredElement:_=!1,size:f="md",useInvalidIcon:S=!1,useInvalidText:v=!0,...F})=>{const j=o.jsxRuntimeExports.jsxs(r.FieldLabel,{className:"FormControl__Label",color:t?"text.contrast":"text",fontSize:E.fontSizes[f],...b,onClick:y=>{y.stopPropagation()},children:[p,_&&o.jsxRuntimeExports.jsx(r.FieldRequiredIndicator,{className:"FormControl__RequiredIndicator",color:t?"text.danger.contrast":"text.danger",...!i&&{fallback:o.jsxRuntimeExports.jsxs(w.WrappedText,{variant:t?"subtleOnContrast":"subtle",fontSize:N[f],children:[" ","(Optional)"]})}})]});return o.jsxRuntimeExports.jsxs(r.FieldRoot,{className:"FormControl group",disabled:n,invalid:d,readOnly:c,required:i,width:"auto",...g,children:[o.jsxRuntimeExports.jsxs(r.Flex,{className:"FormControl__Container",flexDirection:u?"row":"column",w:u?"max-content":"100%",gap:2,children:[p&&a==="start"&&j,o.jsxRuntimeExports.jsxs(r.Flex,{className:"FormControl__Content",alignItems:"center",gap:2,w:u?"max-content":"100%",children:[o.jsxRuntimeExports.jsx(e,{disabled:n,invalid:d,onContrast:t,readOnly:c,required:i,size:f,...F}),S&&d&&o.jsxRuntimeExports.jsx(w.Icon,{className:"FormControl__InvalidIcon",name:"warningSign",variant:h,size:f})]}),p&&a==="end"&&j]}),v&&d&&o.jsxRuntimeExports.jsx(r.FieldErrorText,{className:"FormControl__ErrorText",fontSize:"xs",color:t?"text.danger.contrast":"text.danger",children:m}),x&&o.jsxRuntimeExports.jsx(r.FieldHelperText,{className:"FormControl__HelperText",fontSize:"xs",color:t?"text.subtle.contrast":"text.subtle",children:x})]})};return s.displayName=`withFormControl(${e.displayName||e.name}`,s},M={default:{bgColor:"background",borderWidth:"1px",borderColor:"border",borderRadius:"base",outline:"2px transparent",color:"text",_placeholder:{color:"text.placeholder"}},onContrast:{bgColor:"background.contrast",borderWidth:"1px",borderColor:"border.contrast",borderRadius:"base",color:"text.contrast",_placeholder:{color:"text.placeholder.contrast"}}},W={default:{borderColor:"border.danger",borderWidth:"1px",boxShadow:"0 0 0 1px var(--chakra-colors-border-danger)",_hover:{borderColor:"border.danger"}},onContrast:{borderColor:"border.danger.contrast",boxShadow:"0 0 0 1px var(--chakra-colors-border-danger-contrast)",_hover:{borderColor:"border.danger.contrast"}}},H={default:{bgColor:"border",borderColor:"border",cursor:"not-allowed",opacity:.6,_placeholder:{color:"text.placeholder",opacity:1}},onContrast:{bgColor:"border.contrast",borderColor:"border.contrast",cursor:"not-allowed",opacity:.6,_placeholder:{color:"text.placeholder.contrast",opacity:1}}},k={default:{borderColor:"border.focus",borderWidth:"1px",boxShadow:"0 0 0 1px var(--chakra-colors-border-focus) !important",_hover:{boxShadow:"0 0 0 1px var(--chakra-colors-border-focus)",borderColor:"border.focus"}},onContrast:{borderColor:"border.focus.contrast",borderWidth:"1px",boxShadow:"0 0 0 1px var(--chakra-colors-border-focus-contrast) !important",_hover:{boxShadow:"0 0 0 1px var(--chakra-colors-border-focus-contrast)",borderColor:"border.focus.contrast"}}},I={default:{borderColor:"border.strong"},onContrast:{borderColor:"border.strong.contrast"}},C=e=>({...M[e],_hover:{...I[e]},_disabled:{...H[e]},_focus:{...k[e]},_invalid:{...W[e]}}),R={sm:{fontSize:"sm",minH:"32px"},md:{fontSize:"md",minH:"40px"},lg:{fontSize:"lg",minH:"48px"}},O=r.defineRecipe({variants:{variant:{default:C("default"),onContrast:C("onContrast")},size:R},defaultVariants:{size:"md",variant:"default"}}),L=l.forwardRef(function(s,n){return o.jsxRuntimeExports.jsx(r.Box,{color:"fg",display:"contents",className:"chakra-theme dark","data-testid":"kibble-dark-mode",colorScheme:"dark",ref:n,...s})}),q=e=>o.jsxRuntimeExports.jsx(L,{children:e}),D=l.forwardRef(function(s,n){return o.jsxRuntimeExports.jsx(r.Box,{display:"contents",className:"chakra-theme light","data-testid":"kibble-light-mode",colorScheme:"light",ref:n,...s})}),B=e=>o.jsxRuntimeExports.jsx(D,{children:e});exports.fieldRecipe=O;exports.fieldSizeStyles=R;exports.focusStyle=k;exports.getFieldStyles=C;exports.withDarkMode=q;exports.withFormControl=z;exports.withLightMode=B;exports.withTruncation=T;
-//# sourceMappingURL=index-B-_GN7vC.js.map

package/dist/chunks/hocs/index-B-_GN7vC.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-B-_GN7vC.js","sources":["../../../src/hocs/withTruncation.tsx","../../../src/hocs/withFormControl/withFormControl.records.ts","../../../src/hocs/withFormControl/withFormControl.tsx","../../../src/hocs/withFormControl/withFormControl.recipe.ts","../../../src/hocs/withDarkMode/index.tsx","../../../src/hocs/withLightMode/index.tsx"],"sourcesContent":["import React, {\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  memo,\n} from \"react\";\nimport { Box } from \"@chakra-ui/react/box\";\nimport { Tooltip, TooltipProps } from \"components/Tooltip\";\n\nexport interface WithTruncationProps {\n  truncated?: boolean;\n  noOfLines?: number;\n  tooltipProps?: Omit<TooltipProps, \"disabled\">;\n  children?: ReactNode | string;\n}\n\nexport const withTruncation = <P extends WithTruncationProps>(\n  Component: React.ComponentType<P>,\n): React.FC<P> => {\n  const MemoizedComponent = memo(Component);\n\n  function WithTruncation({\n    truncated = false,\n    noOfLines = 1,\n    children,\n    tooltipProps,\n    ...rest\n  }: WithTruncationProps): React.JSX.Element {\n    const [isTextOverFlowing, setIsTextOverFlowing] = useState<boolean>(false);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const resizeObserverRef = useRef<ResizeObserver | null>(null);\n\n    const checkOverflow = useCallback(() => {\n      if (containerRef.current) {\n        const textScrollHeight =\n          containerRef.current?.children[0].scrollHeight || 0;\n        const containerOffsetHeight = containerRef.current?.offsetHeight || 0;\n        setIsTextOverFlowing(textScrollHeight > containerOffsetHeight);\n      }\n    }, []);\n\n    useEffect(() => {\n      if (truncated && containerRef.current) {\n        let timeoutId: number;\n\n        const debouncedCheck = (): void => {\n          window.clearTimeout(timeoutId);\n          timeoutId = window.setTimeout(checkOverflow, 100);\n        };\n\n        resizeObserverRef.current = new ResizeObserver(() => {\n          debouncedCheck();\n        });\n\n        resizeObserverRef.current.observe(containerRef.current);\n        checkOverflow(); // Initial check\n\n        return (): void => {\n          window.clearTimeout(timeoutId);\n          if (resizeObserverRef.current) {\n            resizeObserverRef.current.disconnect();\n          }\n        };\n      }\n    }, [truncated, checkOverflow]);\n\n    if (!truncated) {\n      return <MemoizedComponent {...(rest as P)}>{children}</MemoizedComponent>;\n    }\n\n    return (\n      <Tooltip\n        {...tooltipProps}\n        label={tooltipProps?.label || children?.toLocaleString() || \"\"}\n        disabled={!isTextOverFlowing}\n        data-testid=\"kibble-truncated-text-tooltip\"\n      >\n        <Box\n          ref={containerRef}\n          display=\"inline-block\"\n          position=\"relative\"\n          className=\"TruncatedText__Wrapper\"\n          data-testid=\"kibble-truncated-text-wrapper\"\n        >\n          <MemoizedComponent\n            className=\"TruncatedText__TextContent\"\n            data-testid=\"kibble-truncated-text-content\"\n            {...(isTextOverFlowing && { cursor: \"pointer\" })}\n            lineClamp={noOfLines}\n            style={{\n              textOverflow: \"ellipsis\",\n              overflow: \"hidden\",\n              wordWrap: \"break-word\",\n              wordBreak: \"break-word\",\n            }}\n            {...(rest as P)}\n          >\n            {children}\n          </MemoizedComponent>\n        </Box>\n      </Tooltip>\n    );\n  }\n\n  WithTruncation.displayName = `withTruncation(${Component.displayName || Component.name}`;\n\n  return memo(WithTruncation);\n};\n","import { FormControlSize } from \"./withFormControl.types\";\n\nexport const optionalTextSizeMap: Record<FormControlSize, number> = {\n  sm: 10,\n  md: 12,\n  lg: 14,\n};\n","import React from \"react\";\nimport { Field } from \"@chakra-ui/react/field\";\nimport {\n  FormControlLabelPosition,\n  FormControlSize,\n} from \"./withFormControl.types\";\nimport { SystemStyleObject } from \"@chakra-ui/react/styled-system\";\nimport { TypographyVariant } from \"shared/types/typography\";\nimport { Text } from \"components/Text/text.component\";\nimport { optionalTextSizeMap } from \"./withFormControl.records\";\nimport { fontSizes } from \"theme/tokens/typography/typography.records\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Icon } from \"components/Icon/icon.component\";\n\nexport interface WithFormControlProps {\n  disabled?: boolean;\n  errorText?: string;\n  formControlStyle?: SystemStyleObject;\n  helperText?: string;\n  inlineField?: boolean;\n  invalid?: boolean;\n  invalidIconColor?: TypographyVariant;\n  label?: string | React.ReactNode;\n  labelPosition?: FormControlLabelPosition;\n  labelStyle?: SystemStyleObject;\n  onContrast?: boolean;\n  readOnly?: boolean;\n  required?: boolean;\n  showRequiredElement?: boolean;\n  size?: FormControlSize;\n  useInvalidIcon?: boolean;\n  useInvalidText?: boolean;\n}\n\nexport const withFormControl = <P extends WithFormControlProps>(\n  Component: React.ComponentType<P>,\n): React.FC<P> => {\n  const WithFormControl = ({\n    disabled = false,\n    errorText = \"Field is invalid\",\n    formControlStyle,\n    helperText,\n    inlineField = false,\n    invalid = false,\n    invalidIconColor = \"warning\",\n    label,\n    labelPosition = \"start\",\n    labelStyle,\n    onContrast = false,\n    readOnly = false,\n    required = false,\n    showRequiredElement = false,\n    size = \"md\",\n    useInvalidIcon = false,\n    useInvalidText = true,\n    ...props\n  }: WithFormControlProps): React.JSX.Element => {\n    const labelComponent = (\n      <Field.Label\n        className=\"FormControl__Label\"\n        color={onContrast ? \"text.contrast\" : \"text\"}\n        fontSize={fontSizes[size]}\n        {...labelStyle}\n        onClick={(e) => {\n          e.stopPropagation();\n        }}\n      >\n        {label}\n        {showRequiredElement && (\n          <Field.RequiredIndicator\n            className=\"FormControl__RequiredIndicator\"\n            color={onContrast ? \"text.danger.contrast\" : \"text.danger\"}\n            {...(!required && {\n              fallback: (\n                <Text\n                  variant={onContrast ? \"subtleOnContrast\" : \"subtle\"}\n                  fontSize={optionalTextSizeMap[size]}\n                >\n                  {\" \"}\n                  (Optional)\n                </Text>\n              ),\n            })}\n          />\n        )}\n      </Field.Label>\n    );\n\n    return (\n      <Field.Root\n        className=\"FormControl group\"\n        disabled={disabled}\n        invalid={invalid}\n        readOnly={readOnly}\n        required={required}\n        width=\"auto\"\n        {...formControlStyle}\n      >\n        <Flex\n          className=\"FormControl__Container\"\n          flexDirection={inlineField ? \"row\" : \"column\"}\n          w={inlineField ? \"max-content\" : \"100%\"}\n          gap={2}\n        >\n          {label && labelPosition === \"start\" && labelComponent}\n          <Flex\n            className=\"FormControl__Content\"\n            alignItems=\"center\"\n            gap={2}\n            w={inlineField ? \"max-content\" : \"100%\"}\n          >\n            <Component\n              disabled={disabled}\n              invalid={invalid}\n              onContrast={onContrast}\n              readOnly={readOnly}\n              required={required}\n              size={size}\n              {...(props as P)}\n            />\n            {useInvalidIcon && invalid && (\n              <Icon\n                className=\"FormControl__InvalidIcon\"\n                name=\"warningSign\"\n                variant={invalidIconColor}\n                size={size}\n              />\n            )}\n          </Flex>\n          {label && labelPosition === \"end\" && labelComponent}\n        </Flex>\n        {useInvalidText && invalid && (\n          <Field.ErrorText\n            className=\"FormControl__ErrorText\"\n            fontSize=\"xs\"\n            color={onContrast ? \"text.danger.contrast\" : \"text.danger\"}\n          >\n            {errorText}\n          </Field.ErrorText>\n        )}\n        {helperText && (\n          <Field.HelperText\n            className=\"FormControl__HelperText\"\n            fontSize=\"xs\"\n            color={onContrast ? \"text.subtle.contrast\" : \"text.subtle\"}\n          >\n            {helperText}\n          </Field.HelperText>\n        )}\n      </Field.Root>\n    );\n  };\n  WithFormControl.displayName = `withFormControl(${Component.displayName || Component.name}`;\n\n  return WithFormControl;\n};\n","import {\n  defineRecipe,\n  SystemStyleObject,\n} from \"@chakra-ui/react/styled-system\";\nimport { FormControlSize, FormVariant } from \"./withFormControl.types\";\n\nconst baseStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    bgColor: \"background\",\n    borderWidth: \"1px\",\n    borderColor: \"border\",\n    borderRadius: \"base\",\n    outline: \"2px transparent\",\n    color: \"text\",\n    _placeholder: {\n      color: \"text.placeholder\",\n    },\n  },\n  onContrast: {\n    bgColor: \"background.contrast\",\n    borderWidth: \"1px\",\n    borderColor: \"border.contrast\",\n    borderRadius: \"base\",\n    color: \"text.contrast\",\n    _placeholder: {\n      color: \"text.placeholder.contrast\",\n    },\n  },\n};\n\nconst invalidStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    borderColor: \"border.danger\",\n    borderWidth: \"1px\",\n    boxShadow: \"0 0 0 1px var(--chakra-colors-border-danger)\",\n    _hover: {\n      borderColor: \"border.danger\",\n    },\n  },\n  onContrast: {\n    borderColor: \"border.danger.contrast\",\n    boxShadow: \"0 0 0 1px var(--chakra-colors-border-danger-contrast)\",\n    _hover: {\n      borderColor: \"border.danger.contrast\",\n    },\n  },\n};\n\nconst disabledStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    bgColor: \"border\",\n    borderColor: \"border\",\n    cursor: \"not-allowed\",\n    opacity: 0.6,\n    _placeholder: {\n      color: \"text.placeholder\",\n      opacity: 1,\n    },\n  },\n  onContrast: {\n    bgColor: \"border.contrast\",\n    borderColor: \"border.contrast\",\n    cursor: \"not-allowed\",\n    opacity: 0.6,\n    _placeholder: {\n      color: \"text.placeholder.contrast\",\n      opacity: 1,\n    },\n  },\n};\n\nexport const focusStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    borderColor: \"border.focus\",\n    borderWidth: \"1px\",\n    boxShadow: \"0 0 0 1px var(--chakra-colors-border-focus) !important\",\n    _hover: {\n      boxShadow: \"0 0 0 1px var(--chakra-colors-border-focus)\",\n      borderColor: \"border.focus\",\n    },\n  },\n  onContrast: {\n    borderColor: \"border.focus.contrast\",\n    borderWidth: \"1px\",\n    boxShadow:\n      \"0 0 0 1px var(--chakra-colors-border-focus-contrast) !important\",\n    _hover: {\n      boxShadow: \"0 0 0 1px var(--chakra-colors-border-focus-contrast)\",\n      borderColor: \"border.focus.contrast\",\n    },\n  },\n};\n\nconst hoverStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    borderColor: \"border.strong\",\n  },\n  onContrast: {\n    borderColor: \"border.strong.contrast\",\n  },\n};\n\nexport const getFieldStyles = (variant: FormVariant): SystemStyleObject => {\n  return {\n    ...baseStyle[variant],\n    _hover: {\n      ...hoverStyle[variant],\n    },\n    _disabled: {\n      ...disabledStyle[variant],\n    },\n    _focus: {\n      ...focusStyle[variant],\n    },\n    _invalid: {\n      ...invalidStyle[variant],\n    },\n  };\n};\n\nexport const fieldSizeStyles: Record<FormControlSize, SystemStyleObject> = {\n  sm: {\n    fontSize: \"sm\",\n    minH: \"32px\",\n  },\n  md: {\n    fontSize: \"md\",\n    minH: \"40px\",\n  },\n  lg: {\n    fontSize: \"lg\",\n    minH: \"48px\",\n  },\n};\n\nexport const fieldRecipe = defineRecipe({\n  variants: {\n    variant: {\n      default: getFieldStyles(\"default\"),\n      onContrast: getFieldStyles(\"onContrast\"),\n    },\n    size: fieldSizeStyles,\n  },\n  defaultVariants: {\n    size: \"md\",\n    variant: \"default\",\n  },\n});\n","import React from \"react\";\nimport { Box, BoxProps } from \"@chakra-ui/react/box\";\n\nconst DarkMode = React.forwardRef<HTMLDivElement, BoxProps>(\n  function DarkMode(props, ref) {\n    return (\n      <Box\n        color=\"fg\"\n        display=\"contents\"\n        className=\"chakra-theme dark\"\n        data-testid=\"kibble-dark-mode\"\n        colorScheme=\"dark\"\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n\nexport const withDarkMode = (children: React.ReactNode): React.JSX.Element => {\n  return <DarkMode>{children}</DarkMode>;\n};\n","import React from \"react\";\nimport { Box, BoxProps } from \"@chakra-ui/react/box\";\n\nconst LightMode = React.forwardRef<HTMLDivElement, BoxProps>(\n  function LightMode(props, ref) {\n    return (\n      <Box\n        display=\"contents\"\n        className=\"chakra-theme light\"\n        data-testid=\"kibble-light-mode\"\n        colorScheme=\"light\"\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n\nexport const withLightMode = (children: React.ReactNode): React.JSX.Element => {\n  return <LightMode>{children}</LightMode>;\n};\n"],"names":["withTruncation","Component","MemoizedComponent","memo","WithTruncation","truncated","noOfLines","children","tooltipProps","rest","isTextOverFlowing","setIsTextOverFlowing","useState","containerRef","useRef","resizeObserverRef","checkOverflow","useCallback","textScrollHeight","containerOffsetHeight","useEffect","timeoutId","debouncedCheck","jsx","Tooltip","Box","optionalTextSizeMap","withFormControl","WithFormControl","disabled","errorText","formControlStyle","helperText","inlineField","invalid","invalidIconColor","label","labelPosition","labelStyle","onContrast","readOnly","required","showRequiredElement","size","useInvalidIcon","useInvalidText","props","labelComponent","jsxs","Field.Label","fontSizes","e","Field.RequiredIndicator","Text","Field.Root","Flex","Icon","Field.ErrorText","Field.HelperText","baseStyle","invalidStyle","disabledStyle","focusStyle","hoverStyle","getFieldStyles","variant","fieldSizeStyles","fieldRecipe","defineRecipe","DarkMode","React","ref","withDarkMode","LightMode","withLightMode"],"mappings":"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"}

package/dist/chunks/hocs/index-BnAHqZKA.js

@@ -1,374 +0,0 @@
-import { x as r } from "../chunks/vendor-CBMqSZOw.js";
-import S, { memo as w, useState as N, useRef as C, useCallback as R, useEffect as z } from "react";
-import { T as W, W as H, I } from "../components/index-DPP6HXLU.js";
-import { B as p, aN as O, aO as M, aP as L, F as _, aQ as D, aR as E, m as B } from "../chunks/chakra-BnJq9Kzm.js";
-import { f as $ } from "../theme/index-CR7sF4U7.js";
-const eo = (o) => {
-  const t = w(o);
-  function a({
-    truncated: x = !1,
-    noOfLines: h = 1,
-    children: d,
-    tooltipProps: i,
-    ...l
-  }) {
-    const [f, u] = N(!1), s = C(null), b = C(null), e = R(() => {
-      if (s.current) {
-        const n = s.current?.children[0].scrollHeight || 0, c = s.current?.offsetHeight || 0;
-        u(n > c);
-      }
-    }, []);
-    return z(() => {
-      if (x && s.current) {
-        let n;
-        const c = () => {
-          window.clearTimeout(n), n = window.setTimeout(e, 100);
-        };
-        return b.current = new ResizeObserver(() => {
-          c();
-        }), b.current.observe(s.current), e(), () => {
-          window.clearTimeout(n), b.current && b.current.disconnect();
-        };
-      }
-    }, [x, e]), x ? /* @__PURE__ */ r.jsx(
-      W,
-      {
-        ...i,
-        label: i?.label || d?.toLocaleString() || "",
-        disabled: !f,
-        "data-testid": "kibble-truncated-text-tooltip",
-        children: /* @__PURE__ */ r.jsx(
-          p,
-          {
-            ref: s,
-            display: "inline-block",
-            position: "relative",
-            className: "TruncatedText__Wrapper",
-            "data-testid": "kibble-truncated-text-wrapper",
-            children: /* @__PURE__ */ r.jsx(
-              t,
-              {
-                className: "TruncatedText__TextContent",
-                "data-testid": "kibble-truncated-text-content",
-                ...f && { cursor: "pointer" },
-                lineClamp: h,
-                style: {
-                  textOverflow: "ellipsis",
-                  overflow: "hidden",
-                  wordWrap: "break-word",
-                  wordBreak: "break-word"
-                },
-                ...l,
-                children: d
-              }
-            )
-          }
-        )
-      }
-    ) : /* @__PURE__ */ r.jsx(t, { ...l, children: d });
-  }
-  return a.displayName = `withTruncation(${o.displayName || o.name}`, w(a);
-}, Q = {
-  sm: 10,
-  md: 12,
-  lg: 14
-}, to = (o) => {
-  const t = ({
-    disabled: a = !1,
-    errorText: x = "Field is invalid",
-    formControlStyle: h,
-    helperText: d,
-    inlineField: i = !1,
-    invalid: l = !1,
-    invalidIconColor: f = "warning",
-    label: u,
-    labelPosition: s = "start",
-    labelStyle: b,
-    onContrast: e = !1,
-    readOnly: n = !1,
-    required: c = !1,
-    showRequiredElement: v = !1,
-    size: m = "md",
-    useInvalidIcon: F = !1,
-    useInvalidText: T = !0,
-    ...j
-  }) => {
-    const g = /* @__PURE__ */ r.jsxs(
-      O,
-      {
-        className: "FormControl__Label",
-        color: e ? "text.contrast" : "text",
-        fontSize: $[m],
-        ...b,
-        onClick: (y) => {
-          y.stopPropagation();
-        },
-        children: [
-          u,
-          v && /* @__PURE__ */ r.jsx(
-            M,
-            {
-              className: "FormControl__RequiredIndicator",
-              color: e ? "text.danger.contrast" : "text.danger",
-              ...!c && {
-                fallback: /* @__PURE__ */ r.jsxs(
-                  H,
-                  {
-                    variant: e ? "subtleOnContrast" : "subtle",
-                    fontSize: Q[m],
-                    children: [
-                      " ",
-                      "(Optional)"
-                    ]
-                  }
-                )
-              }
-            }
-          )
-        ]
-      }
-    );
-    return /* @__PURE__ */ r.jsxs(
-      L,
-      {
-        className: "FormControl group",
-        disabled: a,
-        invalid: l,
-        readOnly: n,
-        required: c,
-        width: "auto",
-        ...h,
-        children: [
-          /* @__PURE__ */ r.jsxs(
-            _,
-            {
-              className: "FormControl__Container",
-              flexDirection: i ? "row" : "column",
-              w: i ? "max-content" : "100%",
-              gap: 2,
-              children: [
-                u && s === "start" && g,
-                /* @__PURE__ */ r.jsxs(
-                  _,
-                  {
-                    className: "FormControl__Content",
-                    alignItems: "center",
-                    gap: 2,
-                    w: i ? "max-content" : "100%",
-                    children: [
-                      /* @__PURE__ */ r.jsx(
-                        o,
-                        {
-                          disabled: a,
-                          invalid: l,
-                          onContrast: e,
-                          readOnly: n,
-                          required: c,
-                          size: m,
-                          ...j
-                        }
-                      ),
-                      F && l && /* @__PURE__ */ r.jsx(
-                        I,
-                        {
-                          className: "FormControl__InvalidIcon",
-                          name: "warningSign",
-                          variant: f,
-                          size: m
-                        }
-                      )
-                    ]
-                  }
-                ),
-                u && s === "end" && g
-              ]
-            }
-          ),
-          T && l && /* @__PURE__ */ r.jsx(
-            D,
-            {
-              className: "FormControl__ErrorText",
-              fontSize: "xs",
-              color: e ? "text.danger.contrast" : "text.danger",
-              children: x
-            }
-          ),
-          d && /* @__PURE__ */ r.jsx(
-            E,
-            {
-              className: "FormControl__HelperText",
-              fontSize: "xs",
-              color: e ? "text.subtle.contrast" : "text.subtle",
-              children: d
-            }
-          )
-        ]
-      }
-    );
-  };
-  return t.displayName = `withFormControl(${o.displayName || o.name}`, t;
-}, V = {
-  default: {
-    bgColor: "background",
-    borderWidth: "1px",
-    borderColor: "border",
-    borderRadius: "base",
-    outline: "2px transparent",
-    color: "text",
-    _placeholder: {
-      color: "text.placeholder"
-    }
-  },
-  onContrast: {
-    bgColor: "background.contrast",
-    borderWidth: "1px",
-    borderColor: "border.contrast",
-    borderRadius: "base",
-    color: "text.contrast",
-    _placeholder: {
-      color: "text.placeholder.contrast"
-    }
-  }
-}, q = {
-  default: {
-    borderColor: "border.danger",
-    borderWidth: "1px",
-    boxShadow: "0 0 0 1px var(--chakra-colors-border-danger)",
-    _hover: {
-      borderColor: "border.danger"
-    }
-  },
-  onContrast: {
-    borderColor: "border.danger.contrast",
-    boxShadow: "0 0 0 1px var(--chakra-colors-border-danger-contrast)",
-    _hover: {
-      borderColor: "border.danger.contrast"
-    }
-  }
-}, A = {
-  default: {
-    bgColor: "border",
-    borderColor: "border",
-    cursor: "not-allowed",
-    opacity: 0.6,
-    _placeholder: {
-      color: "text.placeholder",
-      opacity: 1
-    }
-  },
-  onContrast: {
-    bgColor: "border.contrast",
-    borderColor: "border.contrast",
-    cursor: "not-allowed",
-    opacity: 0.6,
-    _placeholder: {
-      color: "text.placeholder.contrast",
-      opacity: 1
-    }
-  }
-}, G = {
-  default: {
-    borderColor: "border.focus",
-    borderWidth: "1px",
-    boxShadow: "0 0 0 1px var(--chakra-colors-border-focus) !important",
-    _hover: {
-      boxShadow: "0 0 0 1px var(--chakra-colors-border-focus)",
-      borderColor: "border.focus"
-    }
-  },
-  onContrast: {
-    borderColor: "border.focus.contrast",
-    borderWidth: "1px",
-    boxShadow: "0 0 0 1px var(--chakra-colors-border-focus-contrast) !important",
-    _hover: {
-      boxShadow: "0 0 0 1px var(--chakra-colors-border-focus-contrast)",
-      borderColor: "border.focus.contrast"
-    }
-  }
-}, J = {
-  default: {
-    borderColor: "border.strong"
-  },
-  onContrast: {
-    borderColor: "border.strong.contrast"
-  }
-}, k = (o) => ({
-  ...V[o],
-  _hover: {
-    ...J[o]
-  },
-  _disabled: {
-    ...A[o]
-  },
-  _focus: {
-    ...G[o]
-  },
-  _invalid: {
-    ...q[o]
-  }
-}), K = {
-  sm: {
-    fontSize: "sm",
-    minH: "32px"
-  },
-  md: {
-    fontSize: "md",
-    minH: "40px"
-  },
-  lg: {
-    fontSize: "lg",
-    minH: "48px"
-  }
-}, ao = B({
-  variants: {
-    variant: {
-      default: k("default"),
-      onContrast: k("onContrast")
-    },
-    size: K
-  },
-  defaultVariants: {
-    size: "md",
-    variant: "default"
-  }
-}), P = S.forwardRef(
-  function(t, a) {
-    return /* @__PURE__ */ r.jsx(
-      p,
-      {
-        color: "fg",
-        display: "contents",
-        className: "chakra-theme dark",
-        "data-testid": "kibble-dark-mode",
-        colorScheme: "dark",
-        ref: a,
-        ...t
-      }
-    );
-  }
-), so = (o) => /* @__PURE__ */ r.jsx(P, { children: o }), U = S.forwardRef(
-  function(t, a) {
-    return /* @__PURE__ */ r.jsx(
-      p,
-      {
-        display: "contents",
-        className: "chakra-theme light",
-        "data-testid": "kibble-light-mode",
-        colorScheme: "light",
-        ref: a,
-        ...t
-      }
-    );
-  }
-), no = (o) => /* @__PURE__ */ r.jsx(U, { children: o });
-export {
-  to as a,
-  G as b,
-  ao as c,
-  so as d,
-  no as e,
-  K as f,
-  k as g,
-  eo as w
-};
-//# sourceMappingURL=index-BnAHqZKA.js.map

package/dist/chunks/hocs/index-BnAHqZKA.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-BnAHqZKA.js","sources":["../../../src/hocs/withTruncation.tsx","../../../src/hocs/withFormControl/withFormControl.records.ts","../../../src/hocs/withFormControl/withFormControl.tsx","../../../src/hocs/withFormControl/withFormControl.recipe.ts","../../../src/hocs/withDarkMode/index.tsx","../../../src/hocs/withLightMode/index.tsx"],"sourcesContent":["import React, {\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  memo,\n} from \"react\";\nimport { Box } from \"@chakra-ui/react/box\";\nimport { Tooltip, TooltipProps } from \"components/Tooltip\";\n\nexport interface WithTruncationProps {\n  truncated?: boolean;\n  noOfLines?: number;\n  tooltipProps?: Omit<TooltipProps, \"disabled\">;\n  children?: ReactNode | string;\n}\n\nexport const withTruncation = <P extends WithTruncationProps>(\n  Component: React.ComponentType<P>,\n): React.FC<P> => {\n  const MemoizedComponent = memo(Component);\n\n  function WithTruncation({\n    truncated = false,\n    noOfLines = 1,\n    children,\n    tooltipProps,\n    ...rest\n  }: WithTruncationProps): React.JSX.Element {\n    const [isTextOverFlowing, setIsTextOverFlowing] = useState<boolean>(false);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const resizeObserverRef = useRef<ResizeObserver | null>(null);\n\n    const checkOverflow = useCallback(() => {\n      if (containerRef.current) {\n        const textScrollHeight =\n          containerRef.current?.children[0].scrollHeight || 0;\n        const containerOffsetHeight = containerRef.current?.offsetHeight || 0;\n        setIsTextOverFlowing(textScrollHeight > containerOffsetHeight);\n      }\n    }, []);\n\n    useEffect(() => {\n      if (truncated && containerRef.current) {\n        let timeoutId: number;\n\n        const debouncedCheck = (): void => {\n          window.clearTimeout(timeoutId);\n          timeoutId = window.setTimeout(checkOverflow, 100);\n        };\n\n        resizeObserverRef.current = new ResizeObserver(() => {\n          debouncedCheck();\n        });\n\n        resizeObserverRef.current.observe(containerRef.current);\n        checkOverflow(); // Initial check\n\n        return (): void => {\n          window.clearTimeout(timeoutId);\n          if (resizeObserverRef.current) {\n            resizeObserverRef.current.disconnect();\n          }\n        };\n      }\n    }, [truncated, checkOverflow]);\n\n    if (!truncated) {\n      return <MemoizedComponent {...(rest as P)}>{children}</MemoizedComponent>;\n    }\n\n    return (\n      <Tooltip\n        {...tooltipProps}\n        label={tooltipProps?.label || children?.toLocaleString() || \"\"}\n        disabled={!isTextOverFlowing}\n        data-testid=\"kibble-truncated-text-tooltip\"\n      >\n        <Box\n          ref={containerRef}\n          display=\"inline-block\"\n          position=\"relative\"\n          className=\"TruncatedText__Wrapper\"\n          data-testid=\"kibble-truncated-text-wrapper\"\n        >\n          <MemoizedComponent\n            className=\"TruncatedText__TextContent\"\n            data-testid=\"kibble-truncated-text-content\"\n            {...(isTextOverFlowing && { cursor: \"pointer\" })}\n            lineClamp={noOfLines}\n            style={{\n              textOverflow: \"ellipsis\",\n              overflow: \"hidden\",\n              wordWrap: \"break-word\",\n              wordBreak: \"break-word\",\n            }}\n            {...(rest as P)}\n          >\n            {children}\n          </MemoizedComponent>\n        </Box>\n      </Tooltip>\n    );\n  }\n\n  WithTruncation.displayName = `withTruncation(${Component.displayName || Component.name}`;\n\n  return memo(WithTruncation);\n};\n","import { FormControlSize } from \"./withFormControl.types\";\n\nexport const optionalTextSizeMap: Record<FormControlSize, number> = {\n  sm: 10,\n  md: 12,\n  lg: 14,\n};\n","import React from \"react\";\nimport { Field } from \"@chakra-ui/react/field\";\nimport {\n  FormControlLabelPosition,\n  FormControlSize,\n} from \"./withFormControl.types\";\nimport { SystemStyleObject } from \"@chakra-ui/react/styled-system\";\nimport { TypographyVariant } from \"shared/types/typography\";\nimport { Text } from \"components/Text/text.component\";\nimport { optionalTextSizeMap } from \"./withFormControl.records\";\nimport { fontSizes } from \"theme/tokens/typography/typography.records\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport { Icon } from \"components/Icon/icon.component\";\n\nexport interface WithFormControlProps {\n  disabled?: boolean;\n  errorText?: string;\n  formControlStyle?: SystemStyleObject;\n  helperText?: string;\n  inlineField?: boolean;\n  invalid?: boolean;\n  invalidIconColor?: TypographyVariant;\n  label?: string | React.ReactNode;\n  labelPosition?: FormControlLabelPosition;\n  labelStyle?: SystemStyleObject;\n  onContrast?: boolean;\n  readOnly?: boolean;\n  required?: boolean;\n  showRequiredElement?: boolean;\n  size?: FormControlSize;\n  useInvalidIcon?: boolean;\n  useInvalidText?: boolean;\n}\n\nexport const withFormControl = <P extends WithFormControlProps>(\n  Component: React.ComponentType<P>,\n): React.FC<P> => {\n  const WithFormControl = ({\n    disabled = false,\n    errorText = \"Field is invalid\",\n    formControlStyle,\n    helperText,\n    inlineField = false,\n    invalid = false,\n    invalidIconColor = \"warning\",\n    label,\n    labelPosition = \"start\",\n    labelStyle,\n    onContrast = false,\n    readOnly = false,\n    required = false,\n    showRequiredElement = false,\n    size = \"md\",\n    useInvalidIcon = false,\n    useInvalidText = true,\n    ...props\n  }: WithFormControlProps): React.JSX.Element => {\n    const labelComponent = (\n      <Field.Label\n        className=\"FormControl__Label\"\n        color={onContrast ? \"text.contrast\" : \"text\"}\n        fontSize={fontSizes[size]}\n        {...labelStyle}\n        onClick={(e) => {\n          e.stopPropagation();\n        }}\n      >\n        {label}\n        {showRequiredElement && (\n          <Field.RequiredIndicator\n            className=\"FormControl__RequiredIndicator\"\n            color={onContrast ? \"text.danger.contrast\" : \"text.danger\"}\n            {...(!required && {\n              fallback: (\n                <Text\n                  variant={onContrast ? \"subtleOnContrast\" : \"subtle\"}\n                  fontSize={optionalTextSizeMap[size]}\n                >\n                  {\" \"}\n                  (Optional)\n                </Text>\n              ),\n            })}\n          />\n        )}\n      </Field.Label>\n    );\n\n    return (\n      <Field.Root\n        className=\"FormControl group\"\n        disabled={disabled}\n        invalid={invalid}\n        readOnly={readOnly}\n        required={required}\n        width=\"auto\"\n        {...formControlStyle}\n      >\n        <Flex\n          className=\"FormControl__Container\"\n          flexDirection={inlineField ? \"row\" : \"column\"}\n          w={inlineField ? \"max-content\" : \"100%\"}\n          gap={2}\n        >\n          {label && labelPosition === \"start\" && labelComponent}\n          <Flex\n            className=\"FormControl__Content\"\n            alignItems=\"center\"\n            gap={2}\n            w={inlineField ? \"max-content\" : \"100%\"}\n          >\n            <Component\n              disabled={disabled}\n              invalid={invalid}\n              onContrast={onContrast}\n              readOnly={readOnly}\n              required={required}\n              size={size}\n              {...(props as P)}\n            />\n            {useInvalidIcon && invalid && (\n              <Icon\n                className=\"FormControl__InvalidIcon\"\n                name=\"warningSign\"\n                variant={invalidIconColor}\n                size={size}\n              />\n            )}\n          </Flex>\n          {label && labelPosition === \"end\" && labelComponent}\n        </Flex>\n        {useInvalidText && invalid && (\n          <Field.ErrorText\n            className=\"FormControl__ErrorText\"\n            fontSize=\"xs\"\n            color={onContrast ? \"text.danger.contrast\" : \"text.danger\"}\n          >\n            {errorText}\n          </Field.ErrorText>\n        )}\n        {helperText && (\n          <Field.HelperText\n            className=\"FormControl__HelperText\"\n            fontSize=\"xs\"\n            color={onContrast ? \"text.subtle.contrast\" : \"text.subtle\"}\n          >\n            {helperText}\n          </Field.HelperText>\n        )}\n      </Field.Root>\n    );\n  };\n  WithFormControl.displayName = `withFormControl(${Component.displayName || Component.name}`;\n\n  return WithFormControl;\n};\n","import {\n  defineRecipe,\n  SystemStyleObject,\n} from \"@chakra-ui/react/styled-system\";\nimport { FormControlSize, FormVariant } from \"./withFormControl.types\";\n\nconst baseStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    bgColor: \"background\",\n    borderWidth: \"1px\",\n    borderColor: \"border\",\n    borderRadius: \"base\",\n    outline: \"2px transparent\",\n    color: \"text\",\n    _placeholder: {\n      color: \"text.placeholder\",\n    },\n  },\n  onContrast: {\n    bgColor: \"background.contrast\",\n    borderWidth: \"1px\",\n    borderColor: \"border.contrast\",\n    borderRadius: \"base\",\n    color: \"text.contrast\",\n    _placeholder: {\n      color: \"text.placeholder.contrast\",\n    },\n  },\n};\n\nconst invalidStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    borderColor: \"border.danger\",\n    borderWidth: \"1px\",\n    boxShadow: \"0 0 0 1px var(--chakra-colors-border-danger)\",\n    _hover: {\n      borderColor: \"border.danger\",\n    },\n  },\n  onContrast: {\n    borderColor: \"border.danger.contrast\",\n    boxShadow: \"0 0 0 1px var(--chakra-colors-border-danger-contrast)\",\n    _hover: {\n      borderColor: \"border.danger.contrast\",\n    },\n  },\n};\n\nconst disabledStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    bgColor: \"border\",\n    borderColor: \"border\",\n    cursor: \"not-allowed\",\n    opacity: 0.6,\n    _placeholder: {\n      color: \"text.placeholder\",\n      opacity: 1,\n    },\n  },\n  onContrast: {\n    bgColor: \"border.contrast\",\n    borderColor: \"border.contrast\",\n    cursor: \"not-allowed\",\n    opacity: 0.6,\n    _placeholder: {\n      color: \"text.placeholder.contrast\",\n      opacity: 1,\n    },\n  },\n};\n\nexport const focusStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    borderColor: \"border.focus\",\n    borderWidth: \"1px\",\n    boxShadow: \"0 0 0 1px var(--chakra-colors-border-focus) !important\",\n    _hover: {\n      boxShadow: \"0 0 0 1px var(--chakra-colors-border-focus)\",\n      borderColor: \"border.focus\",\n    },\n  },\n  onContrast: {\n    borderColor: \"border.focus.contrast\",\n    borderWidth: \"1px\",\n    boxShadow:\n      \"0 0 0 1px var(--chakra-colors-border-focus-contrast) !important\",\n    _hover: {\n      boxShadow: \"0 0 0 1px var(--chakra-colors-border-focus-contrast)\",\n      borderColor: \"border.focus.contrast\",\n    },\n  },\n};\n\nconst hoverStyle: Record<FormVariant, SystemStyleObject> = {\n  default: {\n    borderColor: \"border.strong\",\n  },\n  onContrast: {\n    borderColor: \"border.strong.contrast\",\n  },\n};\n\nexport const getFieldStyles = (variant: FormVariant): SystemStyleObject => {\n  return {\n    ...baseStyle[variant],\n    _hover: {\n      ...hoverStyle[variant],\n    },\n    _disabled: {\n      ...disabledStyle[variant],\n    },\n    _focus: {\n      ...focusStyle[variant],\n    },\n    _invalid: {\n      ...invalidStyle[variant],\n    },\n  };\n};\n\nexport const fieldSizeStyles: Record<FormControlSize, SystemStyleObject> = {\n  sm: {\n    fontSize: \"sm\",\n    minH: \"32px\",\n  },\n  md: {\n    fontSize: \"md\",\n    minH: \"40px\",\n  },\n  lg: {\n    fontSize: \"lg\",\n    minH: \"48px\",\n  },\n};\n\nexport const fieldRecipe = defineRecipe({\n  variants: {\n    variant: {\n      default: getFieldStyles(\"default\"),\n      onContrast: getFieldStyles(\"onContrast\"),\n    },\n    size: fieldSizeStyles,\n  },\n  defaultVariants: {\n    size: \"md\",\n    variant: \"default\",\n  },\n});\n","import React from \"react\";\nimport { Box, BoxProps } from \"@chakra-ui/react/box\";\n\nconst DarkMode = React.forwardRef<HTMLDivElement, BoxProps>(\n  function DarkMode(props, ref) {\n    return (\n      <Box\n        color=\"fg\"\n        display=\"contents\"\n        className=\"chakra-theme dark\"\n        data-testid=\"kibble-dark-mode\"\n        colorScheme=\"dark\"\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n\nexport const withDarkMode = (children: React.ReactNode): React.JSX.Element => {\n  return <DarkMode>{children}</DarkMode>;\n};\n","import React from \"react\";\nimport { Box, BoxProps } from \"@chakra-ui/react/box\";\n\nconst LightMode = React.forwardRef<HTMLDivElement, BoxProps>(\n  function LightMode(props, ref) {\n    return (\n      <Box\n        display=\"contents\"\n        className=\"chakra-theme light\"\n        data-testid=\"kibble-light-mode\"\n        colorScheme=\"light\"\n        ref={ref}\n        {...props}\n      />\n    );\n  },\n);\n\nexport const withLightMode = (children: React.ReactNode): React.JSX.Element => {\n  return <LightMode>{children}</LightMode>;\n};\n"],"names":["withTruncation","Component","MemoizedComponent","memo","WithTruncation","truncated","noOfLines","children","tooltipProps","rest","isTextOverFlowing","setIsTextOverFlowing","useState","containerRef","useRef","resizeObserverRef","checkOverflow","useCallback","textScrollHeight","containerOffsetHeight","useEffect","timeoutId","debouncedCheck","jsx","Tooltip","Box","optionalTextSizeMap","withFormControl","WithFormControl","disabled","errorText","formControlStyle","helperText","inlineField","invalid","invalidIconColor","label","labelPosition","labelStyle","onContrast","readOnly","required","showRequiredElement","size","useInvalidIcon","useInvalidText","props","labelComponent","jsxs","Field.Label","fontSizes","e","Field.RequiredIndicator","Text","Field.Root","Flex","Icon","Field.ErrorText","Field.HelperText","baseStyle","invalidStyle","disabledStyle","focusStyle","hoverStyle","getFieldStyles","variant","fieldSizeStyles","fieldRecipe","defineRecipe","DarkMode","React","ref","withDarkMode","LightMode","withLightMode"],"mappings":"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"}

package/dist/chunks/hooks/index-B-kdA6en.js

@@ -1,39 +0,0 @@
-import { bW as r } from "../chunks/vendor-CBMqSZOw.js";
-const a = (e) => {
-  switch (e) {
-    case "xs":
-      return "xs";
-    case "sm":
-      return "sm";
-    case "md":
-      return "md";
-    case "lg":
-    case "xl":
-    case "2xl":
-    case "3xl":
-    case "4xl":
-      return "lg";
-    case "5xl":
-    case "6xl":
-      return "2xl";
-  }
-}, t = () => {
-  const { resolvedTheme: e, setTheme: o, forcedTheme: s } = r();
-  return {
-    colorMode: e,
-    forcedTheme: s,
-    setColorMode: o,
-    toggleColorMode: () => {
-      o(e === "dark" ? "light" : "dark");
-    }
-  };
-}, d = (e, o) => {
-  const { colorMode: s } = t();
-  return s === "dark" ? o : e;
-};
-export {
-  t as a,
-  d as b,
-  a as u
-};
-//# sourceMappingURL=index-B-kdA6en.js.map

package/dist/chunks/hooks/index-B-kdA6en.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-B-kdA6en.js","sources":["../../../src/hooks/useIconTextSizeMap.ts","../../../src/hooks/useColorMode/index.tsx","../../../src/hooks/useColorModeValue/index.tsx"],"sourcesContent":["import { IconSize } from \"components/Icon/icon.types\";\nimport { TextSize } from \"components/Text/text.types\";\n\nexport const useIconTextSizeMap = (textSize: TextSize): IconSize => {\n  switch (textSize) {\n    case \"xs\":\n      return \"xs\";\n    case \"sm\":\n      return \"sm\";\n    case \"md\":\n      return \"md\";\n    case \"lg\":\n    case \"xl\":\n    case \"2xl\":\n    case \"3xl\":\n    case \"4xl\":\n      return \"lg\";\n    case \"5xl\":\n    case \"6xl\":\n      return \"2xl\";\n  }\n};\n","import { useTheme } from \"next-themes\";\nimport { ColorMode } from \"shared/types/theme\";\n\nexport interface UseColorModeReturn {\n  colorMode: ColorMode;\n  setColorMode: (colorMode: ColorMode) => void;\n  toggleColorMode: () => void;\n  forcedTheme?: ColorMode;\n}\n\nexport const useColorMode = (): UseColorModeReturn => {\n  const { resolvedTheme, setTheme, forcedTheme } = useTheme();\n  const toggleColorMode = (): void => {\n    setTheme(resolvedTheme === \"dark\" ? \"light\" : \"dark\");\n  };\n  return {\n    colorMode: resolvedTheme as ColorMode,\n    forcedTheme: forcedTheme as ColorMode,\n    setColorMode: setTheme,\n    toggleColorMode,\n  };\n};\n","import { useColorMode } from \"../useColorMode\";\n\nexport const useColorModeValue = <T,>(light: T, dark: T): T => {\n  const { colorMode } = useColorMode();\n  return colorMode === \"dark\" ? dark : light;\n};\n"],"names":["useIconTextSizeMap","textSize","useColorMode","resolvedTheme","setTheme","forcedTheme","useTheme","useColorModeValue","light","dark","colorMode"],"mappings":";AAGa,MAAAA,IAAqB,CAACC,MAAiC;AAClE,UAAQA,GAAU;AAAA,IAChB,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AACI,aAAA;AAAA,EAAA;AAEb,GCXaC,IAAe,MAA0B;AACpD,QAAM,EAAE,eAAAC,GAAe,UAAAC,GAAU,aAAAC,EAAA,IAAgBC,EAAS;AAInD,SAAA;AAAA,IACL,WAAWH;AAAA,IACX,aAAAE;AAAA,IACA,cAAcD;AAAA,IACd,iBAPsB,MAAY;AACzB,MAAAA,EAAAD,MAAkB,SAAS,UAAU,MAAM;AAAA,IACtD;AAAA,EAMA;AACF,GCnBaI,IAAoB,CAAKC,GAAUC,MAAe;AACvD,QAAA,EAAE,WAAAC,EAAU,IAAIR,EAAa;AAC5B,SAAAQ,MAAc,SAASD,IAAOD;AACvC;"}

package/dist/chunks/hooks/index-XFgKMPJ2.js

@@ -1,2 +0,0 @@
-"use strict";const c=require("../chunks/vendor-D-x6W6ez.js"),l=e=>{switch(e){case"xs":return"xs";case"sm":return"sm";case"md":return"md";case"lg":case"xl":case"2xl":case"3xl":case"4xl":return"lg";case"5xl":case"6xl":return"2xl"}},r=()=>{const{resolvedTheme:e,setTheme:o,forcedTheme:s}=c.z();return{colorMode:e,forcedTheme:s,setColorMode:o,toggleColorMode:()=>{o(e==="dark"?"light":"dark")}}},t=(e,o)=>{const{colorMode:s}=r();return s==="dark"?o:e};exports.useColorMode=r;exports.useColorModeValue=t;exports.useIconTextSizeMap=l;
-//# sourceMappingURL=index-XFgKMPJ2.js.map

package/dist/chunks/hooks/index-XFgKMPJ2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-XFgKMPJ2.js","sources":["../../../src/hooks/useIconTextSizeMap.ts","../../../src/hooks/useColorMode/index.tsx","../../../src/hooks/useColorModeValue/index.tsx"],"sourcesContent":["import { IconSize } from \"components/Icon/icon.types\";\nimport { TextSize } from \"components/Text/text.types\";\n\nexport const useIconTextSizeMap = (textSize: TextSize): IconSize => {\n  switch (textSize) {\n    case \"xs\":\n      return \"xs\";\n    case \"sm\":\n      return \"sm\";\n    case \"md\":\n      return \"md\";\n    case \"lg\":\n    case \"xl\":\n    case \"2xl\":\n    case \"3xl\":\n    case \"4xl\":\n      return \"lg\";\n    case \"5xl\":\n    case \"6xl\":\n      return \"2xl\";\n  }\n};\n","import { useTheme } from \"next-themes\";\nimport { ColorMode } from \"shared/types/theme\";\n\nexport interface UseColorModeReturn {\n  colorMode: ColorMode;\n  setColorMode: (colorMode: ColorMode) => void;\n  toggleColorMode: () => void;\n  forcedTheme?: ColorMode;\n}\n\nexport const useColorMode = (): UseColorModeReturn => {\n  const { resolvedTheme, setTheme, forcedTheme } = useTheme();\n  const toggleColorMode = (): void => {\n    setTheme(resolvedTheme === \"dark\" ? \"light\" : \"dark\");\n  };\n  return {\n    colorMode: resolvedTheme as ColorMode,\n    forcedTheme: forcedTheme as ColorMode,\n    setColorMode: setTheme,\n    toggleColorMode,\n  };\n};\n","import { useColorMode } from \"../useColorMode\";\n\nexport const useColorModeValue = <T,>(light: T, dark: T): T => {\n  const { colorMode } = useColorMode();\n  return colorMode === \"dark\" ? dark : light;\n};\n"],"names":["useIconTextSizeMap","textSize","useColorMode","resolvedTheme","setTheme","forcedTheme","useTheme","useColorModeValue","light","dark","colorMode"],"mappings":"6DAGaA,EAAsBC,GAAiC,CAClE,OAAQA,EAAU,CAChB,IAAK,KACI,MAAA,KACT,IAAK,KACI,MAAA,KACT,IAAK,KACI,MAAA,KACT,IAAK,KACL,IAAK,KACL,IAAK,MACL,IAAK,MACL,IAAK,MACI,MAAA,KACT,IAAK,MACL,IAAK,MACI,MAAA,KAAA,CAEb,ECXaC,EAAe,IAA0B,CACpD,KAAM,CAAE,cAAAC,EAAe,SAAAC,EAAU,YAAAC,CAAA,EAAgBC,EAAAA,EAAS,EAInD,MAAA,CACL,UAAWH,EACX,YAAAE,EACA,aAAcD,EACd,gBAPsB,IAAY,CACzBA,EAAAD,IAAkB,OAAS,QAAU,MAAM,CACtD,CAMA,CACF,ECnBaI,EAAoB,CAAKC,EAAUC,IAAe,CACvD,KAAA,CAAE,UAAAC,CAAU,EAAIR,EAAa,EAC5B,OAAAQ,IAAc,OAASD,EAAOD,CACvC"}

package/dist/chunks/shared/index-QeX41Bt9.js

@@ -1,2 +0,0 @@
-"use strict";const a={accent:{color:"text.accent"},accentSubtle:{color:"text.accent.subtle"},brand:{color:"text.brand"},brandOnContrast:{color:"text.brand.contrast"},danger:{color:"text.danger"},dangerOnContrast:{color:"text.danger.contrast"},default:{color:"text.default"},info:{color:"text.info"},interactive:{color:"text.interactive",_hover:{color:"text.interactive.hover"}},interactiveOnContrast:{color:"text.interactive.contrast",_hover:{color:"text.interactive.contrast.hover"}},onContrast:{color:"text.contrast"},placeholder:{color:"text.placeholder"},placeholderOnContrast:{color:"text.placeholder.contrast"},subtle:{color:"text.subtle"},subtleOnContrast:{color:"text.subtle.contrast"},success:{color:"text.success"},warning:{color:"text.warning"}},s={normal:{fontWeight:"normal"},semibold:{fontWeight:"semibold"},bold:{fontWeight:"bold"}},c=o=>o.replace(/([A-Z])/g," $1").replace(/^\w/,e=>e.toUpperCase()),r=({currentSize:o,larger:e=!0,delta:n=1})=>{let t;switch(o){case"xs":t=e?"sm":"xs";break;case"sm":t=e?"md":"xs";break;case"md":t=e?"lg":"sm";break;case"lg":t=e?"xl":"md";break;case"xl":t=e?"2xl":"lg";break;case"2xl":t=e?"2xl":"xl";break;default:t=o;break}return n>1&&(t=r({currentSize:t,larger:e,delta:n-1})),t},l=["top","right","bottom","left","top-start","top-end","right-start","right-end","bottom-start","bottom-end","left-start","left-end"],i=["accent","accentSubtle","brand","brandOnContrast","danger","dangerOnContrast","default","info","interactive","interactiveOnContrast","onContrast","placeholder","placeholderOnContrast","subtle","subtleOnContrast","success","warning"],d=["info","success","warning","error","default"],x=["start","end","center"],b=["row","column","row-reverse","column-reverse"];exports.alignments=x;exports.camelCaseToLabel=c;exports.flexDirections=b;exports.fontWeightStyles=s;exports.getNextIconSize=r;exports.placements=l;exports.statuses=d;exports.typographyVariantStyles=a;exports.typographyVariants=i;
-//# sourceMappingURL=index-QeX41Bt9.js.map

package/dist/chunks/shared/index-QeX41Bt9.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-QeX41Bt9.js","sources":["../../../src/shared/records/typography.ts","../../../src/shared/utils/strings.ts","../../../src/shared/utils/sizes.ts","../../../src/shared/types/placement.ts","../../../src/shared/types/typography.ts","../../../src/shared/types/status.ts","../../../src/shared/types/alignment.ts"],"sourcesContent":["import { SystemStyleObject } from \"@chakra-ui/react/styled-system\";\nimport { TypographyVariant } from \"shared/types/typography\";\nimport { FontWeight } from \"theme/tokens\";\n\nexport const typographyVariantStyles: Record<\n  TypographyVariant,\n  SystemStyleObject\n> = {\n  accent: {\n    color: \"text.accent\",\n  },\n  accentSubtle: {\n    color: \"text.accent.subtle\",\n  },\n  brand: {\n    color: \"text.brand\",\n  },\n  brandOnContrast: {\n    color: \"text.brand.contrast\",\n  },\n  danger: {\n    color: \"text.danger\",\n  },\n  dangerOnContrast: {\n    color: \"text.danger.contrast\",\n  },\n  default: {\n    color: \"text.default\",\n  },\n  info: {\n    color: \"text.info\",\n  },\n  interactive: {\n    color: \"text.interactive\",\n    _hover: {\n      color: \"text.interactive.hover\",\n    },\n  },\n  interactiveOnContrast: {\n    color: \"text.interactive.contrast\",\n    _hover: {\n      color: \"text.interactive.contrast.hover\",\n    },\n  },\n  onContrast: {\n    color: \"text.contrast\",\n  },\n  placeholder: {\n    color: \"text.placeholder\",\n  },\n  placeholderOnContrast: {\n    color: \"text.placeholder.contrast\",\n  },\n  subtle: {\n    color: \"text.subtle\",\n  },\n  subtleOnContrast: {\n    color: \"text.subtle.contrast\",\n  },\n  success: {\n    color: \"text.success\",\n  },\n  warning: {\n    color: \"text.warning\",\n  },\n};\n\nexport const fontWeightStyles: Record<FontWeight, SystemStyleObject> = {\n  normal: { fontWeight: \"normal\" },\n  semibold: { fontWeight: \"semibold\" },\n  bold: { fontWeight: \"bold\" },\n};\n","export const camelCaseToLabel = (s: string): string =>\n  s.replace(/([A-Z])/g, \" $1\").replace(/^\\w/, (c) => c.toUpperCase());\n\nexport const toTitleCase = (s: string): string => {\n  const smallWords =\n    /^(a|an|and|as|at|but|by|en|for|if|in|nor|of|on|or|per|the|to|v.?|vs.?|via)$/i;\n  const alphanumericPattern = /([A-Za-z0-9\\u00C0-\\u00FF])/;\n  const wordSeparators = /([ :–—-])/;\n\n  return s\n    .split(wordSeparators)\n    .map(function (current, index, array) {\n      if (\n        /* Check for small words */\n        current.search(smallWords) > -1 &&\n        /* Skip first and last word */\n        index !== 0 &&\n        index !== array.length - 1 &&\n        /* Ignore title end and subtitle start */\n        array[index - 3] !== \":\" &&\n        array[index + 1] !== \":\" &&\n        /* Ignore small words that start a hyphenated phrase */\n        (array[index + 1] !== \"-\" ||\n          (array[index - 1] === \"-\" && array[index + 1] === \"-\"))\n      ) {\n        return current.toLowerCase();\n      }\n\n      /* Ignore intentional capitalization */\n      if (current.substring(1).search(/[A-Z]|\\../) > -1) {\n        return current;\n      }\n\n      /* Ignore URLs */\n      if (array[index + 1] === \":\" && array[index + 2] !== \"\") {\n        return current;\n      }\n\n      /* Capitalize the first letter */\n      return current.replace(alphanumericPattern, (match) =>\n        match.toUpperCase(),\n      );\n    })\n    .join(\"\");\n};\n","import { AvatarSize } from \"components/Avatar/avatar.types\";\nimport { IconSize } from \"components/Icon/icon.types\";\n\ninterface GetNextIconSizeProps {\n  currentSize: IconSize | AvatarSize;\n  larger: boolean;\n  delta: number;\n}\n\nexport const getNextIconSize = ({\n  currentSize,\n  larger = true,\n  delta = 1,\n}: GetNextIconSizeProps): IconSize => {\n  let nextSize: IconSize;\n  switch (currentSize) {\n    case \"xs\":\n      nextSize = larger ? \"sm\" : \"xs\";\n      break;\n    case \"sm\":\n      nextSize = larger ? \"md\" : \"xs\";\n      break;\n    case \"md\":\n      nextSize = larger ? \"lg\" : \"sm\";\n      break;\n    case \"lg\":\n      nextSize = larger ? \"xl\" : \"md\";\n      break;\n    case \"xl\":\n      nextSize = larger ? \"2xl\" : \"lg\";\n      break;\n    case \"2xl\":\n      nextSize = larger ? \"2xl\" : \"xl\";\n      break;\n    default:\n      nextSize = currentSize as IconSize;\n      break;\n  }\n\n  if (delta > 1) {\n    nextSize = getNextIconSize({\n      currentSize: nextSize,\n      larger,\n      delta: delta - 1,\n    });\n  }\n\n  return nextSize;\n};\n","export const placements = [\n  \"top\",\n  \"right\",\n  \"bottom\",\n  \"left\",\n  \"top-start\",\n  \"top-end\",\n  \"right-start\",\n  \"right-end\",\n  \"bottom-start\",\n  \"bottom-end\",\n  \"left-start\",\n  \"left-end\",\n] as const;\n\nexport type Placement = (typeof placements)[number];\n","export const typographyVariants = [\n  \"accent\",\n  \"accentSubtle\",\n  \"brand\",\n  \"brandOnContrast\",\n  \"danger\",\n  \"dangerOnContrast\",\n  \"default\",\n  \"info\",\n  \"interactive\",\n  \"interactiveOnContrast\",\n  \"onContrast\",\n  \"placeholder\",\n  \"placeholderOnContrast\",\n  \"subtle\",\n  \"subtleOnContrast\",\n  \"success\",\n  \"warning\",\n] as const;\nexport type TypographyVariant = (typeof typographyVariants)[number];\n","export const statuses = [\n  \"info\",\n  \"success\",\n  \"warning\",\n  \"error\",\n  \"default\",\n] as const;\n\nexport type Status = (typeof statuses)[number];\n","export const alignments = [\"start\", \"end\", \"center\"] as const;\nexport type Alignment = (typeof alignments)[number];\n\nexport const flexDirections = [\n  \"row\",\n  \"column\",\n  \"row-reverse\",\n  \"column-reverse\",\n] as const;\nexport type FlexDirection = (typeof flexDirections)[number];\n"],"names":["typographyVariantStyles","fontWeightStyles","camelCaseToLabel","s","c","getNextIconSize","currentSize","larger","delta","nextSize","placements","typographyVariants","statuses","alignments","flexDirections"],"mappings":"aAIO,MAAMA,EAGT,CACF,OAAQ,CACN,MAAO,aACT,EACA,aAAc,CACZ,MAAO,oBACT,EACA,MAAO,CACL,MAAO,YACT,EACA,gBAAiB,CACf,MAAO,qBACT,EACA,OAAQ,CACN,MAAO,aACT,EACA,iBAAkB,CAChB,MAAO,sBACT,EACA,QAAS,CACP,MAAO,cACT,EACA,KAAM,CACJ,MAAO,WACT,EACA,YAAa,CACX,MAAO,mBACP,OAAQ,CACN,MAAO,wBAAA,CAEX,EACA,sBAAuB,CACrB,MAAO,4BACP,OAAQ,CACN,MAAO,iCAAA,CAEX,EACA,WAAY,CACV,MAAO,eACT,EACA,YAAa,CACX,MAAO,kBACT,EACA,sBAAuB,CACrB,MAAO,2BACT,EACA,OAAQ,CACN,MAAO,aACT,EACA,iBAAkB,CAChB,MAAO,sBACT,EACA,QAAS,CACP,MAAO,cACT,EACA,QAAS,CACP,MAAO,cAAA,CAEX,EAEaC,EAA0D,CACrE,OAAQ,CAAE,WAAY,QAAS,EAC/B,SAAU,CAAE,WAAY,UAAW,EACnC,KAAM,CAAE,WAAY,MAAO,CAC7B,ECvEaC,EAAoBC,GAC/BA,EAAE,QAAQ,WAAY,KAAK,EAAE,QAAQ,MAAQC,GAAMA,EAAE,YAAa,CAAA,ECQvDC,EAAkB,CAAC,CAC9B,YAAAC,EACA,OAAAC,EAAS,GACT,MAAAC,EAAQ,CACV,IAAsC,CAChC,IAAAC,EACJ,OAAQH,EAAa,CACnB,IAAK,KACHG,EAAWF,EAAS,KAAO,KAC3B,MACF,IAAK,KACHE,EAAWF,EAAS,KAAO,KAC3B,MACF,IAAK,KACHE,EAAWF,EAAS,KAAO,KAC3B,MACF,IAAK,KACHE,EAAWF,EAAS,KAAO,KAC3B,MACF,IAAK,KACHE,EAAWF,EAAS,MAAQ,KAC5B,MACF,IAAK,MACHE,EAAWF,EAAS,MAAQ,KAC5B,MACF,QACaE,EAAAH,EACX,KAAA,CAGJ,OAAIE,EAAQ,IACVC,EAAWJ,EAAgB,CACzB,YAAaI,EACb,OAAAF,EACA,MAAOC,EAAQ,CAAA,CAChB,GAGIC,CACT,EChDaC,EAAa,CACxB,MACA,QACA,SACA,OACA,YACA,UACA,cACA,YACA,eACA,aACA,aACA,UACF,ECbaC,EAAqB,CAChC,SACA,eACA,QACA,kBACA,SACA,mBACA,UACA,OACA,cACA,wBACA,aACA,cACA,wBACA,SACA,mBACA,UACA,SACF,EClBaC,EAAW,CACtB,OACA,UACA,UACA,QACA,SACF,ECNaC,EAAa,CAAC,QAAS,MAAO,QAAQ,EAGtCC,EAAiB,CAC5B,MACA,SACA,cACA,gBACF"}