@televet/kibble-ui 4.0.0-beta.40 → 4.0.0-beta.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunks/button.component-BWlRjD5a.js.map +1 -1
- package/dist/chunks/button.component-ytAmAAJg.js.map +1 -1
- package/dist/chunks/icon.component-4aaCABoX.js.map +1 -1
- package/dist/chunks/icon.component-BmcWaysM.js.map +1 -1
- package/dist/types/chakra/index.d.ts +2 -2
- package/dist/types/components/Button/button.component.d.ts +2 -3
- package/dist/types/components/Icon/icon.component.d.ts +2 -3
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.component-BWlRjD5a.js","sources":["../../src/shared/utils/strings.ts","../../src/components/Button/button.component.tsx"],"sourcesContent":["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 React, { ForwardedRef, forwardRef, useMemo } from \"react\";\nimport {\n Button as CButton,\n ButtonProps as CButtonProps,\n IconButton as CIconButton,\n} from \"@chakra-ui/react/button\";\nimport { IconName } from \"components/Icon/icon.types\";\nimport {\n ButtonConfigVariant,\n ButtonIconPosition,\n ButtonSize,\n ButtonSpinnerPlacement,\n ButtonVariant,\n} from \"./button.types\";\nimport { camelCaseToLabel } from \"shared/utils/strings\";\nimport { Icon } from \"components/Icon\";\n\nexport interface
|
|
1
|
+
{"version":3,"file":"button.component-BWlRjD5a.js","sources":["../../src/shared/utils/strings.ts","../../src/components/Button/button.component.tsx"],"sourcesContent":["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 React, { ForwardedRef, forwardRef, useMemo } from \"react\";\nimport {\n Button as CButton,\n ButtonProps as CButtonProps,\n IconButton as CIconButton,\n} from \"@chakra-ui/react/button\";\nimport { IconName } from \"components/Icon/icon.types\";\nimport {\n ButtonConfigVariant,\n ButtonIconPosition,\n ButtonSize,\n ButtonSpinnerPlacement,\n ButtonVariant,\n} from \"./button.types\";\nimport { camelCaseToLabel } from \"shared/utils/strings\";\nimport { Icon } from \"components/Icon\";\n\nexport interface ButtonProps extends CButtonProps {\n active?: boolean;\n iconName?: IconName;\n iconPosition?: ButtonIconPosition;\n fullWidth?: boolean;\n size?: ButtonSize;\n spinnerPlacement?: ButtonSpinnerPlacement;\n onContrast?: boolean;\n variant?: ButtonVariant;\n}\n\nexport const Button = forwardRef(\n (\n {\n active,\n children,\n iconName,\n iconPosition = \"left\",\n fullWidth = false,\n onContrast = false,\n size = \"md\",\n variant = \"primary\",\n ...rest\n }: ButtonProps,\n ref: ForwardedRef<HTMLButtonElement>\n ): React.JSX.Element => {\n let icon;\n const computedVariant = useMemo(\n () =>\n `${variant}${onContrast ? \"OnContrast\" : \"\"}` as ButtonConfigVariant,\n [onContrast, variant]\n );\n\n if (iconName) {\n icon = <Icon size={size} name={iconName} />;\n\n if (!children) {\n const label = camelCaseToLabel(iconName);\n return (\n <CIconButton\n className=\"IconButton\"\n data-testid=\"kibble-icon-button\"\n ref={ref}\n aria-label={label}\n size={size}\n variant={computedVariant}\n {...rest}\n {...(fullWidth && { width: \"100%\" })}\n >\n {icon}\n </CIconButton>\n );\n }\n }\n\n return (\n <CButton\n className=\"Button\"\n data-testid=\"kibble-button\"\n fontWeight=\"semibold\"\n ref={ref}\n size={size}\n variant={computedVariant}\n {...(active && { \"data-active\": true })}\n {...rest}\n {...(fullWidth && { width: \"100%\" })}\n {...(!!iconName && {\n gap: size === \"xs\" || size === \"sm\" ? 1 : 2,\n })}\n >\n {icon && iconPosition === \"left\" ? icon : <></>}\n {children}\n {icon && iconPosition === \"right\" ? icon : <></>}\n </CButton>\n );\n }\n);\n\nButton.displayName = \"Button\";\n"],"names":["camelCaseToLabel","c","Button","forwardRef","active","children","iconName","iconPosition","fullWidth","onContrast","size","variant","rest","ref","icon","computedVariant","useMemo","jsx","Icon","label","CIconButton","jsxs","CButton","Fragment"],"mappings":";;;;AAAO,MAAMA,IAAmB,CAAC,MAC/B,EAAE,QAAQ,YAAY,KAAK,EAAE,QAAQ,OAAO,CAACC,MAAMA,EAAE,aAAa,GC2BvDC,IAASC;AAAA,EACpB,CACE;AAAA,IACE,QAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,cAAAC,IAAe;AAAA,IACf,WAAAC,IAAY;AAAA,IACZ,YAAAC,IAAa;AAAA,IACb,MAAAC,IAAO;AAAA,IACP,SAAAC,IAAU;AAAA,IACV,GAAGC;AAAA,KAELC,MACsB;AAClB,QAAAC;AACJ,UAAMC,IAAkBC;AAAA,MACtB,MACE,GAAGL,CAAO,GAAGF,IAAa,eAAe,EAAE;AAAA,MAC7C,CAACA,GAAYE,CAAO;AAAA,IACtB;AAEA,QAAIL,MACFQ,IAAQG,gBAAAA,EAAA,IAAAC,GAAA,EAAK,MAAAR,GAAY,MAAMJ,GAAU,GAErC,CAACD,IAAU;AACP,YAAAc,IAAQnB,EAAiBM,CAAQ;AAErC,aAAAW,gBAAAA,EAAA;AAAA,QAACG;AAAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,eAAY;AAAA,UACZ,KAAAP;AAAA,UACA,cAAYM;AAAA,UACZ,MAAAT;AAAA,UACA,SAASK;AAAA,UACR,GAAGH;AAAA,UACH,GAAIJ,KAAa,EAAE,OAAO,OAAO;AAAA,UAEjC,UAAAM;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAMJ,WAAAO,gBAAAA,EAAA;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,eAAY;AAAA,QACZ,YAAW;AAAA,QACX,KAAAT;AAAA,QACA,MAAAH;AAAA,QACA,SAASK;AAAA,QACR,GAAIX,KAAU,EAAE,eAAe,GAAK;AAAA,QACpC,GAAGQ;AAAA,QACH,GAAIJ,KAAa,EAAE,OAAO,OAAO;AAAA,QACjC,GAAI,CAAC,CAACF,KAAY;AAAA,UACjB,KAAKI,MAAS,QAAQA,MAAS,OAAO,IAAI;AAAA,QAC5C;AAAA,QAEC,UAAA;AAAA,UAAQI,KAAAP,MAAiB,SAASO,IAASG,gBAAAA,EAAA,IAAAM,EAAA,UAAA,EAAA;AAAA,UAC3ClB;AAAA,UACAS,KAAQP,MAAiB,UAAUO,IAASG,gBAAAA,EAAA,IAAAM,EAAA,UAAA,CAAA,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAC/C;AAAA,EAAA;AAGN;AAEArB,EAAO,cAAc;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.component-ytAmAAJg.js","sources":["../../src/shared/utils/strings.ts","../../src/components/Button/button.component.tsx"],"sourcesContent":["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 React, { ForwardedRef, forwardRef, useMemo } from \"react\";\nimport {\n Button as CButton,\n ButtonProps as CButtonProps,\n IconButton as CIconButton,\n} from \"@chakra-ui/react/button\";\nimport { IconName } from \"components/Icon/icon.types\";\nimport {\n ButtonConfigVariant,\n ButtonIconPosition,\n ButtonSize,\n ButtonSpinnerPlacement,\n ButtonVariant,\n} from \"./button.types\";\nimport { camelCaseToLabel } from \"shared/utils/strings\";\nimport { Icon } from \"components/Icon\";\n\nexport interface
|
|
1
|
+
{"version":3,"file":"button.component-ytAmAAJg.js","sources":["../../src/shared/utils/strings.ts","../../src/components/Button/button.component.tsx"],"sourcesContent":["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 React, { ForwardedRef, forwardRef, useMemo } from \"react\";\nimport {\n Button as CButton,\n ButtonProps as CButtonProps,\n IconButton as CIconButton,\n} from \"@chakra-ui/react/button\";\nimport { IconName } from \"components/Icon/icon.types\";\nimport {\n ButtonConfigVariant,\n ButtonIconPosition,\n ButtonSize,\n ButtonSpinnerPlacement,\n ButtonVariant,\n} from \"./button.types\";\nimport { camelCaseToLabel } from \"shared/utils/strings\";\nimport { Icon } from \"components/Icon\";\n\nexport interface ButtonProps extends CButtonProps {\n active?: boolean;\n iconName?: IconName;\n iconPosition?: ButtonIconPosition;\n fullWidth?: boolean;\n size?: ButtonSize;\n spinnerPlacement?: ButtonSpinnerPlacement;\n onContrast?: boolean;\n variant?: ButtonVariant;\n}\n\nexport const Button = forwardRef(\n (\n {\n active,\n children,\n iconName,\n iconPosition = \"left\",\n fullWidth = false,\n onContrast = false,\n size = \"md\",\n variant = \"primary\",\n ...rest\n }: ButtonProps,\n ref: ForwardedRef<HTMLButtonElement>\n ): React.JSX.Element => {\n let icon;\n const computedVariant = useMemo(\n () =>\n `${variant}${onContrast ? \"OnContrast\" : \"\"}` as ButtonConfigVariant,\n [onContrast, variant]\n );\n\n if (iconName) {\n icon = <Icon size={size} name={iconName} />;\n\n if (!children) {\n const label = camelCaseToLabel(iconName);\n return (\n <CIconButton\n className=\"IconButton\"\n data-testid=\"kibble-icon-button\"\n ref={ref}\n aria-label={label}\n size={size}\n variant={computedVariant}\n {...rest}\n {...(fullWidth && { width: \"100%\" })}\n >\n {icon}\n </CIconButton>\n );\n }\n }\n\n return (\n <CButton\n className=\"Button\"\n data-testid=\"kibble-button\"\n fontWeight=\"semibold\"\n ref={ref}\n size={size}\n variant={computedVariant}\n {...(active && { \"data-active\": true })}\n {...rest}\n {...(fullWidth && { width: \"100%\" })}\n {...(!!iconName && {\n gap: size === \"xs\" || size === \"sm\" ? 1 : 2,\n })}\n >\n {icon && iconPosition === \"left\" ? icon : <></>}\n {children}\n {icon && iconPosition === \"right\" ? icon : <></>}\n </CButton>\n );\n }\n);\n\nButton.displayName = \"Button\";\n"],"names":["camelCaseToLabel","s","c","Button","forwardRef","active","children","iconName","iconPosition","fullWidth","onContrast","size","variant","rest","ref","icon","computedVariant","useMemo","jsx","Icon","label","CIconButton","jsxs","CButton","Fragment"],"mappings":"8JAAaA,EAAoBC,GAC/BA,EAAE,QAAQ,WAAY,KAAK,EAAE,QAAQ,MAAQC,GAAMA,EAAE,aAAa,EC2BvDC,EAASC,EAAA,WACpB,CACE,CACE,OAAAC,EACA,SAAAC,EACA,SAAAC,EACA,aAAAC,EAAe,OACf,UAAAC,EAAY,GACZ,WAAAC,EAAa,GACb,KAAAC,EAAO,KACP,QAAAC,EAAU,UACV,GAAGC,GAELC,IACsB,CAClB,IAAAC,EACJ,MAAMC,EAAkBC,EAAA,QACtB,IACE,GAAGL,CAAO,GAAGF,EAAa,aAAe,EAAE,GAC7C,CAACA,EAAYE,CAAO,CACtB,EAEA,GAAIL,IACFQ,EAAQG,EAAA,kBAAA,IAAAC,EAAA,KAAA,CAAK,KAAAR,EAAY,KAAMJ,EAAU,EAErC,CAACD,GAAU,CACP,MAAAc,EAAQpB,EAAiBO,CAAQ,EAErC,OAAAW,EAAA,kBAAA,IAACG,EAAA,WAAA,CACC,UAAU,aACV,cAAY,qBACZ,IAAAP,EACA,aAAYM,EACZ,KAAAT,EACA,QAASK,EACR,GAAGH,EACH,GAAIJ,GAAa,CAAE,MAAO,MAAO,EAEjC,SAAAM,CAAA,CACH,CAAA,CAMJ,OAAAO,EAAA,kBAAA,KAACC,EAAA,OAAA,CACC,UAAU,SACV,cAAY,gBACZ,WAAW,WACX,IAAAT,EACA,KAAAH,EACA,QAASK,EACR,GAAIX,GAAU,CAAE,cAAe,EAAK,EACpC,GAAGQ,EACH,GAAIJ,GAAa,CAAE,MAAO,MAAO,EACjC,GAAI,CAAC,CAACF,GAAY,CACjB,IAAKI,IAAS,MAAQA,IAAS,KAAO,EAAI,CAC5C,EAEC,SAAA,CAAQI,GAAAP,IAAiB,OAASO,EAASG,EAAA,kBAAA,IAAAM,EAAA,kBAAA,SAAA,EAAA,EAC3ClB,EACAS,GAAQP,IAAiB,QAAUO,EAASG,EAAA,kBAAA,IAAAM,EAAA,kBAAA,SAAA,CAAA,CAAA,CAAA,CAAA,CAC/C,CAAA,CAGN,EAEArB,EAAO,YAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.component-4aaCABoX.js","sources":["../../src/components/Icon/icon.records.ts","../../src/components/Icon/icon.component.tsx"],"sourcesContent":["import { IconMap as GeneratedIconMap } from \"./generated/index\";\nimport { IconSize } from \"./icon.types\";\n\nexport const IconMap = GeneratedIconMap;\n\nexport const IconSizeMap: Record<IconSize, number> = {\n xs: 14,\n sm: 16,\n md: 20,\n lg: 24,\n xl: 32,\n \"2xl\": 38,\n};\n","import React, { forwardRef, useMemo } from \"react\";\nimport { IconMap, IconSizeMap } from \"./icon.records\";\nimport { IconName, IconSize } from \"./icon.types\";\nimport { Box, BoxProps } from \"@chakra-ui/react/box\";\nimport { TypographyVariant } from \"shared/types/typography\";\nimport { typographyVariantStyles } from \"shared/records/typography\";\n\nexport interface
|
|
1
|
+
{"version":3,"file":"icon.component-4aaCABoX.js","sources":["../../src/components/Icon/icon.records.ts","../../src/components/Icon/icon.component.tsx"],"sourcesContent":["import { IconMap as GeneratedIconMap } from \"./generated/index\";\nimport { IconSize } from \"./icon.types\";\n\nexport const IconMap = GeneratedIconMap;\n\nexport const IconSizeMap: Record<IconSize, number> = {\n xs: 14,\n sm: 16,\n md: 20,\n lg: 24,\n xl: 32,\n \"2xl\": 38,\n};\n","import React, { forwardRef, useMemo } from \"react\";\nimport { IconMap, IconSizeMap } from \"./icon.records\";\nimport { IconName, IconSize } from \"./icon.types\";\nimport { Box, BoxProps } from \"@chakra-ui/react/box\";\nimport { TypographyVariant } from \"shared/types/typography\";\nimport { typographyVariantStyles } from \"shared/records/typography\";\n\nexport interface IconProps extends BoxProps {\n name: IconName;\n size?: IconSize;\n variant?: TypographyVariant;\n}\n\nexport const Icon = forwardRef(\n (\n { name, size = \"lg\", color, variant, ...rest }: IconProps,\n ref: React.ForwardedRef<IconProps>\n ): React.JSX.Element => {\n const MappedIcon = IconMap[name];\n const d = IconSizeMap[size] + \"px\";\n\n const iconColor = useMemo(() => {\n return variant ? typographyVariantStyles[variant].color : color;\n }, [variant, color]);\n\n return (\n <Box\n className=\"Icon__Wrapper\"\n data-testid=\"kibble-icon-wrapper\"\n color={iconColor}\n display=\"inline-block\"\n {...rest}\n >\n <MappedIcon\n className=\"Icon\"\n data-testid=\"kibble-icon\"\n ref={ref}\n width={d}\n height={d}\n color=\"currentColor\"\n />\n </Box>\n );\n }\n);\n"],"names":["IconMap","GeneratedIconMap","IconSizeMap","Icon","forwardRef","name","size","color","variant","rest","ref","MappedIcon","d","iconColor","useMemo","typographyVariantStyles","jsx","Box"],"mappings":"0MAGaA,EAAUC,EAAA,QAEVC,EAAwC,CACnD,GAAI,GACJ,GAAI,GACJ,GAAI,GACJ,GAAI,GACJ,GAAI,GACJ,MAAO,EACT,ECCaC,EAAOC,EAAA,WAClB,CACE,CAAE,KAAAC,EAAM,KAAAC,EAAO,KAAM,MAAAC,EAAO,QAAAC,EAAS,GAAGC,CAAK,EAC7CC,IACsB,CAChB,MAAAC,EAAaX,EAAQK,CAAI,EACzBO,EAAIV,EAAYI,CAAI,EAAI,KAExBO,EAAYC,EAAAA,QAAQ,IACjBN,EAAUO,EAAA,wBAAwBP,CAAO,EAAE,MAAQD,EACzD,CAACC,EAASD,CAAK,CAAC,EAGjB,OAAAS,EAAA,kBAAA,IAACC,EAAA,IAAA,CACC,UAAU,gBACV,cAAY,sBACZ,MAAOJ,EACP,QAAQ,eACP,GAAGJ,EAEJ,SAAAO,EAAA,kBAAA,IAACL,EAAA,CACC,UAAU,OACV,cAAY,cACZ,IAAAD,EACA,MAAOE,EACP,OAAQA,EACR,MAAM,cAAA,CAAA,CACR,CACF,CAAA,CAGN"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.component-BmcWaysM.js","sources":["../../src/components/Icon/icon.records.ts","../../src/components/Icon/icon.component.tsx"],"sourcesContent":["import { IconMap as GeneratedIconMap } from \"./generated/index\";\nimport { IconSize } from \"./icon.types\";\n\nexport const IconMap = GeneratedIconMap;\n\nexport const IconSizeMap: Record<IconSize, number> = {\n xs: 14,\n sm: 16,\n md: 20,\n lg: 24,\n xl: 32,\n \"2xl\": 38,\n};\n","import React, { forwardRef, useMemo } from \"react\";\nimport { IconMap, IconSizeMap } from \"./icon.records\";\nimport { IconName, IconSize } from \"./icon.types\";\nimport { Box, BoxProps } from \"@chakra-ui/react/box\";\nimport { TypographyVariant } from \"shared/types/typography\";\nimport { typographyVariantStyles } from \"shared/records/typography\";\n\nexport interface
|
|
1
|
+
{"version":3,"file":"icon.component-BmcWaysM.js","sources":["../../src/components/Icon/icon.records.ts","../../src/components/Icon/icon.component.tsx"],"sourcesContent":["import { IconMap as GeneratedIconMap } from \"./generated/index\";\nimport { IconSize } from \"./icon.types\";\n\nexport const IconMap = GeneratedIconMap;\n\nexport const IconSizeMap: Record<IconSize, number> = {\n xs: 14,\n sm: 16,\n md: 20,\n lg: 24,\n xl: 32,\n \"2xl\": 38,\n};\n","import React, { forwardRef, useMemo } from \"react\";\nimport { IconMap, IconSizeMap } from \"./icon.records\";\nimport { IconName, IconSize } from \"./icon.types\";\nimport { Box, BoxProps } from \"@chakra-ui/react/box\";\nimport { TypographyVariant } from \"shared/types/typography\";\nimport { typographyVariantStyles } from \"shared/records/typography\";\n\nexport interface IconProps extends BoxProps {\n name: IconName;\n size?: IconSize;\n variant?: TypographyVariant;\n}\n\nexport const Icon = forwardRef(\n (\n { name, size = \"lg\", color, variant, ...rest }: IconProps,\n ref: React.ForwardedRef<IconProps>\n ): React.JSX.Element => {\n const MappedIcon = IconMap[name];\n const d = IconSizeMap[size] + \"px\";\n\n const iconColor = useMemo(() => {\n return variant ? typographyVariantStyles[variant].color : color;\n }, [variant, color]);\n\n return (\n <Box\n className=\"Icon__Wrapper\"\n data-testid=\"kibble-icon-wrapper\"\n color={iconColor}\n display=\"inline-block\"\n {...rest}\n >\n <MappedIcon\n className=\"Icon\"\n data-testid=\"kibble-icon\"\n ref={ref}\n width={d}\n height={d}\n color=\"currentColor\"\n />\n </Box>\n );\n }\n);\n"],"names":["IconMap","GeneratedIconMap","IconSizeMap","Icon","forwardRef","name","size","color","variant","rest","ref","MappedIcon","d","iconColor","useMemo","typographyVariantStyles","jsx","Box"],"mappings":";;;;;AAGO,MAAMA,IAAUC,GAEVC,IAAwC;AAAA,EACnD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,OAAO;AACT,GCCaC,IAAOC;AAAA,EAClB,CACE,EAAE,MAAAC,GAAM,MAAAC,IAAO,MAAM,OAAAC,GAAO,SAAAC,GAAS,GAAGC,EAAK,GAC7CC,MACsB;AAChB,UAAAC,IAAaX,EAAQK,CAAI,GACzBO,IAAIV,EAAYI,CAAI,IAAI,MAExBO,IAAYC,EAAQ,MACjBN,IAAUO,EAAwBP,CAAO,EAAE,QAAQD,GACzD,CAACC,GAASD,CAAK,CAAC;AAGjB,WAAAS,gBAAAA,EAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,eAAY;AAAA,QACZ,OAAOJ;AAAA,QACP,SAAQ;AAAA,QACP,GAAGJ;AAAA,QAEJ,UAAAO,gBAAAA,EAAA;AAAA,UAACL;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YACZ,KAAAD;AAAA,YACA,OAAOE;AAAA,YACP,QAAQA;AAAA,YACR,OAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACR;AAAA,IACF;AAAA,EAAA;AAGN;"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export { AspectRatio } from '@chakra-ui/react/aspect-ratio';
|
|
2
2
|
export { Bleed } from '@chakra-ui/react/bleed';
|
|
3
|
-
export { Box } from '@chakra-ui/react/box';
|
|
3
|
+
export { Box, type BoxProps } from '@chakra-ui/react/box';
|
|
4
4
|
export { Center } from '@chakra-ui/react/center';
|
|
5
5
|
export { Container } from '@chakra-ui/react/container';
|
|
6
|
-
export { Flex } from '@chakra-ui/react/flex';
|
|
6
|
+
export { Flex, type FlexProps } from '@chakra-ui/react/flex';
|
|
7
7
|
export { Float } from '@chakra-ui/react/float';
|
|
8
8
|
export { Grid, GridItem, SimpleGrid } from '@chakra-ui/react/grid';
|
|
9
9
|
export { Group } from '@chakra-ui/react/group';
|
|
@@ -2,7 +2,7 @@ import { default as React } from 'react';
|
|
|
2
2
|
import { ButtonProps as CButtonProps } from '@chakra-ui/react/button';
|
|
3
3
|
import { IconName } from '../Icon/icon.types';
|
|
4
4
|
import { ButtonIconPosition, ButtonSize, ButtonSpinnerPlacement, ButtonVariant } from './button.types';
|
|
5
|
-
export interface
|
|
5
|
+
export interface ButtonProps extends CButtonProps {
|
|
6
6
|
active?: boolean;
|
|
7
7
|
iconName?: IconName;
|
|
8
8
|
iconPosition?: ButtonIconPosition;
|
|
@@ -12,5 +12,4 @@ export interface KButtonProps {
|
|
|
12
12
|
onContrast?: boolean;
|
|
13
13
|
variant?: ButtonVariant;
|
|
14
14
|
}
|
|
15
|
-
export
|
|
16
|
-
export declare const Button: React.ForwardRefExoticComponent<KButtonProps & CButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
15
|
+
export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -2,10 +2,9 @@ import { default as React } from 'react';
|
|
|
2
2
|
import { IconName, IconSize } from './icon.types';
|
|
3
3
|
import { BoxProps } from '@chakra-ui/react/box';
|
|
4
4
|
import { TypographyVariant } from '../../shared/types/typography';
|
|
5
|
-
export interface
|
|
5
|
+
export interface IconProps extends BoxProps {
|
|
6
6
|
name: IconName;
|
|
7
7
|
size?: IconSize;
|
|
8
8
|
variant?: TypographyVariant;
|
|
9
9
|
}
|
|
10
|
-
export
|
|
11
|
-
export declare const Icon: React.ForwardRefExoticComponent<BaseIconProps & BoxProps & React.RefAttributes<IconProps>>;
|
|
10
|
+
export declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<IconProps>>;
|