@televet/kibble-ui 4.0.0-beta.9 → 4.0.0-beta.91

package/dist/types/theme/tokens/typography/typography.config.d.ts

@@ -1,4 +1,3 @@
-/** @internal */
 export declare const fontTokens: {
     heading: {
         value: string;
@@ -52,125 +51,80 @@ export declare const fontSizeTokens: {
     };
 };
 export declare const fontWeightTokens: {
-    xs: {
-        value: string;
-    };
-    sm: {
-        value: string;
-    };
-    md: {
+    normal: {
         value: string;
     };
-    lg: {
+    semibold: {
         value: string;
     };
-    xl: {
-        value: string;
-    };
-    "2xl": {
-        value: string;
-    };
-    "3xl": {
-        value: string;
-    };
-    "4xl": {
-        value: string;
-    };
-    "5xl": {
-        value: string;
-    };
-    "6xl": {
-        value: string;
-    };
-    "7xl": {
-        value: string;
-    };
-    "8xl": {
-        value: string;
-    };
-    "9xl": {
+    bold: {
         value: string;
     };
 };
 export declare const lineHeightTokens: {
-    xs: {
+    normal: {
         value: string;
     };
-    sm: {
+    none: {
         value: string;
     };
-    md: {
+    shorter: {
         value: string;
     };
-    lg: {
+    short: {
         value: string;
     };
-    xl: {
-        value: string;
-    };
-    "2xl": {
-        value: string;
-    };
-    "3xl": {
-        value: string;
-    };
-    "4xl": {
+    base: {
         value: string;
     };
-    "5xl": {
-        value: string;
-    };
-    "6xl": {
+    tall: {
         value: string;
     };
-    "7xl": {
-        value: string;
-    };
-    "8xl": {
+    taller: {
         value: string;
     };
-    "9xl": {
+    3: {
         value: string;
     };
-};
-export declare const letterSpacingTokens: {
-    xs: {
+    4: {
         value: string;
     };
-    sm: {
+    5: {
         value: string;
     };
-    md: {
+    6: {
         value: string;
     };
-    lg: {
+    7: {
         value: string;
     };
-    xl: {
+    8: {
         value: string;
     };
-    "2xl": {
+    9: {
         value: string;
     };
-    "3xl": {
+    10: {
         value: string;
     };
-    "4xl": {
+};
+export declare const letterSpacingTokens: {
+    normal: {
         value: string;
     };
-    "5xl": {
+    tighter: {
         value: string;
     };
-    "6xl": {
+    tight: {
         value: string;
     };
-    "7xl": {
+    wide: {
         value: string;
     };
-    "8xl": {
+    wider: {
         value: string;
     };
-    "9xl": {
+    widest: {
         value: string;
     };
 };

package/dist/types/theme/tokens/typography/typography.records.d.ts

@@ -1,4 +1,3 @@
-/** @internal */
 import { Font, FontSize, FontWeight, LetterSpacing, LineHeight } from './typography.types';
 export declare const fonts: Record<Font, string>;
 export declare const fontSizes: Record<FontSize, string>;

package/dist/types/theme/tokens/typography/typography.types.d.ts

@@ -1,6 +1,5 @@
-/** @internal */
-export type Font = "heading" | "body" | "mono";
-export type FontSize = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl";
-export type FontWeight = "normal" | "semibold" | "bold";
-export type LineHeight = "normal" | "none" | "shorter" | "short" | "base" | "tall" | "taller" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10";
-export type LetterSpacing = "tighter" | "tight" | "normal" | "wide" | "wider" | "widest";
+export type Font = 'heading' | 'body' | 'mono';
+export type FontSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | '8xl' | '9xl';
+export type FontWeight = 'normal' | 'semibold' | 'bold';
+export type LineHeight = 'normal' | 'none' | 'shorter' | 'short' | 'base' | 'tall' | 'taller' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10';
+export type LetterSpacing = 'tighter' | 'tight' | 'normal' | 'wide' | 'wider' | 'widest';

package/dist/types/theme/tokens/utils/transformToTokens.d.ts

@@ -1,4 +1,3 @@
-/** @internal */
 /**
  * Transforms an object of key-value pairs into a new object where each value
  * is wrapped in an object with a `value` property. Numbers are converted to strings.

package/dist/types/theme/tokens/zIndices/zIndices.config.d.ts

@@ -1,8 +1,10 @@
-/** @internal */
 export declare const zIndexTokens: {
     base: {
         value: string;
     };
+    overlay: {
+        value: string;
+    };
     popover: {
         value: string;
     };
@@ -12,10 +14,13 @@ export declare const zIndexTokens: {
     tooltip: {
         value: string;
     };
-    overlay: {
+    sticky: {
         value: string;
     };
-    tooltipExtra: {
+    auto: {
+        value: string;
+    };
+    banner: {
         value: string;
     };
     hide: {
@@ -27,19 +32,13 @@ export declare const zIndexTokens: {
     dropdown: {
         value: string;
     };
-    sticky: {
-        value: string;
-    };
-    banner: {
-        value: string;
-    };
     modal: {
         value: string;
     };
-    auto: {
+    skipLink: {
         value: string;
     };
-    skipLink: {
+    tooltipExtra: {
         value: string;
     };
 };

package/dist/types/theme/tokens/zIndices/zIndices.records.d.ts

@@ -1,3 +1,2 @@
-/** @internal */
 import { ZIndex } from './zIndices.types';
 export declare const zIndices: Record<ZIndex, string | number>;

package/dist/types/theme/tokens/zIndices/zIndices.types.d.ts

@@ -1,2 +1 @@
-/** @internal */
-export type ZIndex = "hide" | "auto" | "base" | "docked" | "dropdown" | "sticky" | "banner" | "overlay" | "modal" | "popover" | "skipLink" | "toast" | "tooltip" | "tooltipExtra";
+export type ZIndex = 'hide' | 'auto' | 'base' | 'docked' | 'dropdown' | 'sticky' | 'banner' | 'overlay' | 'modal' | 'popover' | 'skipLink' | 'toast' | 'tooltip' | 'tooltipExtra';

package/dist/types/vite-env.d.ts

@@ -1,2 +1 @@
-/** @internal */
 /// <reference types="vite/client" />

package/package.json

@@ -1,15 +1,43 @@
 {
   "name": "@televet/kibble-ui",
   "description": "Kibble Design System by Otto",
-  "version": "4.0.0-beta.9",
+  "version": "4.0.0-beta.91",
   "type": "module",
   "main": "dist/cjs/index.cjs",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",
+  "bin": {
+    "kibble-generate-theme": "./dist/esm/cli/generate-theme-types.js",
+    "kibble-postinstall": "./dist/esm/cli/postinstall.js"
+  },
   "files": [
-    "dist"
+    "dist",
+    "dist/esm/cli"
   ],
   "sideEffects": false,
+  "scripts": {
+    "build": "npm run generate:theme && npm run generate:icons && npm run generate:logos && npm run build:documentation && tsc -b && tsc -p tsconfig.cli.json && vite build && chmod +x ./dist/esm/cli/*.js",
+    "build:documentation": "storybook build -o docs --quiet",
+    "build-storybook": "npm run generate:icons && npm run generate:logos && storybook build",
+    "chromatic": "npx chromatic --project-token=$CHROMATIC_PROJECT_TOKEN",
+    "create:component": "npx plop component",
+    "deploy": "gh-pages -d dist",
+    "format": "npx prettier --write --parser typescript '**/*.{ts,tsx}'",
+    "generate:icons": "npx rimraf src/components/Icon/generated && npx @svgr/cli src/assets/icons --config-file svgr.config.mjs",
+    "generate:logos": "npx rimraf src/components/Logo/generated && npx @svgr/cli src/assets/logos --config-file svgr-logo.config.mjs",
+    "generate:theme": "npx @chakra-ui/cli typegen ./src/theme/theme.config.ts",
+    "lint": "eslint --fix ./src/",
+    "predeploy": "npm run build",
+    "prepare": "husky",
+    "publishBeta": "npm run build && npm publish --tag beta",
+    "start": "npm run generate:icons & npm run generate:logos & npm run theme:watch & storybook dev -p 6006",
+    "test-storybook": "npm run generate:icons && npm run generate:logos && vitest --project=storybook",
+    "theme:watch": "chakra typegen ./src/theme/theme.config.ts --watch"
+  },
+  "engines": {
+    "node": ">=20.0.0",
+    "npm": ">=9.0.0"
+  },
   "exports": {
     ".": {
       "import": {
@@ -31,6 +59,26 @@
         "default": "./dist/cjs/theme/index.cjs"
       }
     },
+    "./theme/*": {
+      "import": {
+        "types": "./dist/types/theme/*.d.ts",
+        "default": "./dist/esm/theme/*.js"
+      },
+      "require": {
+        "types": "./dist/types/theme/*.d.ts",
+        "default": "./dist/cjs/theme/*.cjs"
+      }
+    },
+    "./chakra": {
+      "import": {
+        "types": "./dist/types/chakra/index.d.ts",
+        "default": "./dist/esm/chakra/index.js"
+      },
+      "require": {
+        "types": "./dist/types/chakra/index.d.ts",
+        "default": "./dist/cjs/chakra/index.cjs"
+      }
+    },
     "./*": {
       "import": {
         "types": "./dist/types/components/*/index.d.ts",
@@ -83,25 +131,6 @@
     },
     "./package.json": "./package.json"
   },
-  "scripts": {
-    "build": "npm run generate:theme && npm run generate:icons && npm run build:documentation && tsc -b && vite build",
-    "build:documentation": "storybook build -o docs --quiet",
-    "build-storybook": "npm run generate:icons && storybook build",
-    "chromatic": "npx chromatic --project-token=$CHROMATIC_PROJECT_TOKEN",
-    "create:component": "npx plop component",
-    "deploy": "gh-pages -d build",
-    "format": "npx prettier --write --parser typescript '**/*.{ts,tsx}'",
-    "generate:icons": "npx rimraf src/components/Icon/generated && npx @svgr/cli src/assets/icons --config-file svgr.config.mjs",
-    "generate:theme": "npx @chakra-ui/cli typegen ./src/theme/theme.config.ts",
-    "lint": "eslint --fix ./src/",
-    "predeploy": "npm run build",
-    "prepare": "husky",
-    "publishBeta": "npm run build && npm publish --tag beta",
-    "start": "npm run generate:icons & npm run theme:watch & storybook dev -p 6006",
-    "test-storybook": "test-storybook",
-    "test:watch": "test-storybook --watch",
-    "theme:watch": "chakra typegen ./src/theme/theme.config.ts --watch"
-  },
   "lint-staged": {
     "*.{ts,tsx}": [
       "npm run format",
@@ -114,56 +143,56 @@
     ]
   },
   "devDependencies": {
-    "@chakra-ui/cli": "^3.14.2",
-    "@chromatic-com/storybook": "^3.2.6",
+    "@chakra-ui/cli": "^3.19.2",
+    "@chromatic-com/storybook": "^4.0.0",
+    "@emotion/react": "^11.14.0",
     "@eslint/js": "^9.21.0",
-    "@storybook/addon-a11y": "^8.6.11",
-    "@storybook/addon-actions": "^8.6.12",
-    "@storybook/addon-docs": "^8.6.11",
-    "@storybook/addon-essentials": "^8.6.11",
-    "@storybook/addon-interactions": "^8.6.12",
-    "@storybook/addon-onboarding": "^8.6.11",
-    "@storybook/addon-themes": "^8.6.11",
-    "@storybook/blocks": "^8.6.11",
-    "@storybook/react": "^8.6.11",
-    "@storybook/react-vite": "^8.6.11",
-    "@storybook/test": "^8.6.11",
+    "@storybook/addon-a11y": "^9.0.1",
+    "@storybook/addon-docs": "^9.0.1",
+    "@storybook/addon-onboarding": "^9.0.1",
+    "@storybook/addon-themes": "^9.0.1",
+    "@storybook/addon-vitest": "^9.0.1",
+    "@storybook/react-vite": "^9.0.1",
     "@storybook/test-runner": "^0.22.0",
-    "@televet/prettier-config": "^1.0.1",
     "@types/lodash-es": "^4.17.12",
     "@types/react": "^19.0.10",
     "@vitejs/plugin-react": "^4.3.4",
+    "@vitest/browser": "^3.1.4",
+    "@vitest/coverage-v8": "^3.1.4",
     "chromatic": "^11.27.0",
     "eslint": "^9.21.0",
     "eslint-plugin-react-hooks": "^5.1.0",
     "eslint-plugin-react-refresh": "^0.4.19",
-    "eslint-plugin-storybook": "^0.12.0",
+    "eslint-plugin-storybook": "^9.0.1",
     "gh-pages": "^6.3.0",
     "globals": "^15.15.0",
     "husky": "^9.1.7",
     "lint-staged": "^15.5.0",
+    "playwright": "^1.52.0",
     "plop": "^4.0.1",
     "prettier": "^3.5.3",
     "rollup-plugin-visualizer": "^5.14.0",
-    "storybook": "^8.6.11",
+    "storybook": "^9.0.1",
     "typescript": "~5.7.2",
     "typescript-eslint": "^8.24.1",
     "vite": "^6.2.0",
     "vite-plugin-dts": "^4.5.3",
-    "vite-tsconfig-paths": "^5.1.4"
+    "vite-plugin-svgr": "^4.3.0",
+    "vite-tsconfig-paths": "^5.1.4",
+    "vitest": "^3.1.4"
   },
   "peerDependencies": {
+    "@emotion/react": "^11.14.0",
     "date-fns": "^4.1.0",
     "lodash-es": "^4.17.21",
     "react": "^19.0.0"
   },
   "dependencies": {
-    "@chakra-ui/react": "^3.14.2",
+    "@chakra-ui/react": "^3.19.2",
     "@datepicker-react/hooks": "^2.8.4",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
-    "@emotion/react": "^11.14.0",
     "next-themes": "^0.4.6"
   }
 }

package/dist/chunks/alert.types-Bnf8isvq.js

@@ -1,2 +0,0 @@
-"use strict";const t=require("./vendor-D-x6W6ez.js"),h=require("react"),f=require("./heading.component-CExbjSBi.js"),g=require("./icon.component-Bmtf4XKw.js"),b=require("./text.component-CBa_saMP.js"),d=require("./button.component-Dufh_y5v.js"),s=require("./chakra-DmF8Cxqs.js"),A={error:"warningSign",warning:"warningSign",success:"checkmark",info:"infoCircle",default:"infoCircle"},E={default:"default",error:"danger",info:"info",success:"success",warning:"warning"},c=({buttonPosition:e,buttonText:i,status:o,...a})=>t.jsxRuntimeExports.jsx(s.Box,{className:"Alert__Button","data-testid":"kibble-alert-button",...e==="bottomLeft"&&{pt:2,pb:1},children:t.jsxRuntimeExports.jsx(d.Button,{size:"xs",variant:o==="default"?"primary":"secondary",w:"max-content",...a,children:i})}),_=({buttonProps:e,description:i,descriptionProps:o,hideCloseButton:a=!1,hideIcon:x=!1,iconProps:u,onClose:j,onContrast:n=!1,status:r="success",title:l,titleProps:p,...R})=>{const m=e?.buttonPosition==="topRight"?s.Flex:h.Fragment;return t.jsxRuntimeExports.jsxs(s.AlertRoot,{className:"Alert","data-testid":"kibble-alert",...R,variant:r,hideIcon:x,onContrast:n,children:[!x&&t.jsxRuntimeExports.jsx(s.AlertIndicator,{className:"Alert__Icon","data-testid":"kibble-alert-icon",children:t.jsxRuntimeExports.jsx(g.Icon,{variant:n?"onContrast":E[r],name:u?.name||A[r],size:"lg",...u})}),t.jsxRuntimeExports.jsxs(s.AlertContent,{className:"Alert__Content","data-testid":"kibble-alert-content",children:[l&&t.jsxRuntimeExports.jsxs(m,{justifyContent:"space-between",children:[t.jsxRuntimeExports.jsx(s.AlertTitle,{className:"Alert__Title","data-testid":"kibble-alert-title",children:t.jsxRuntimeExports.jsx(f.WrappedHeading,{size:"sm",variant:n?"onContrast":"default",...p,children:l})}),e?.buttonPosition==="topRight"&&t.jsxRuntimeExports.jsx(c,{status:r,onContrast:n,...e})]}),i&&t.jsxRuntimeExports.jsxs(m,{justifyContent:"space-between",children:[t.jsxRuntimeExports.jsx(s.AlertDescription,{className:"Alert__Description","data-testid":"kibble-alert-description",children:typeof i=="string"?t.jsxRuntimeExports.jsx(b.WrappedText,{size:"md",variant:n?"onContrast":"default",...o,children:i}):i}),e?.buttonPosition==="topRight"&&!l&&t.jsxRuntimeExports.jsx(c,{status:r,onContrast:n,...e})]}),e?.buttonPosition==="bottomLeft"&&t.jsxRuntimeExports.jsx(c,{status:r,onContrast:n,...e})]}),!a&&t.jsxRuntimeExports.jsx(d.Button,{iconName:"close",size:"xs",variant:"ghostNeutral",onContrast:n,onClick:j})]})},k=["topRight","bottomLeft"];exports.Alert=_;exports.alertButtonPositions=k;
-//# sourceMappingURL=alert.types-Bnf8isvq.js.map

package/dist/chunks/alert.types-Bnf8isvq.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"alert.types-Bnf8isvq.js","sources":["../../src/components/Alert/alert.records.ts","../../src/components/Alert/components/AlertButton/alertButton.component.tsx","../../src/components/Alert/alert.component.tsx","../../src/components/Alert/alert.types.ts"],"sourcesContent":["import { IconName } from \"components/Icon/icon.types\";\nimport { TypographyVariant } from \"shared/types\";\nimport { Status } from \"shared/types/status\";\n\nexport const AlertStatusIcon: Record<Status, IconName> = {\n  error: \"warningSign\",\n  warning: \"warningSign\",\n  success: \"checkmark\",\n  info: \"infoCircle\",\n  default: \"infoCircle\",\n};\n\nexport const AlertStatusToIconVariant: Record<Status, TypographyVariant> = {\n  default: \"default\",\n  error: \"danger\",\n  info: \"info\",\n  success: \"success\",\n  warning: \"warning\",\n};\n","import React from \"react\";\nimport { AlertButtonPosition } from \"components/Alert/alert.types\";\nimport { Button, ButtonProps } from \"components/Button/button.component\";\nimport { Status } from \"shared/types/status\";\nimport { Box } from \"@chakra-ui/react/box\";\n\nexport interface AlertButtonProps extends Omit<ButtonProps, \"children\"> {\n  buttonPosition?: AlertButtonPosition;\n  buttonText: string;\n}\n\ninterface InternalAlertButtonProps extends AlertButtonProps {\n  status: Status;\n}\n\nexport const AlertButton = ({\n  buttonPosition,\n  buttonText,\n  status,\n  ...rest\n}: InternalAlertButtonProps): React.JSX.Element => {\n  return (\n    <Box\n      className=\"Alert__Button\"\n      data-testid=\"kibble-alert-button\"\n      {...(buttonPosition === \"bottomLeft\" && { pt: 2, pb: 1 })}\n    >\n      <Button\n        size=\"xs\"\n        variant={status === \"default\" ? \"primary\" : \"secondary\"}\n        w=\"max-content\"\n        {...rest}\n      >\n        {buttonText}\n      </Button>\n    </Box>\n  );\n};\n","import React from \"react\";\nimport { Alert as CAlert } from \"@chakra-ui/react/alert\";\nimport { Heading, HeadingProps } from \"components/Heading/heading.component\";\nimport { Icon, IconProps } from \"components/Icon/icon.component\";\nimport { Text, TextProps } from \"components/Text/text.component\";\nimport { Status } from \"shared/types/status\";\nimport { Button } from \"components/Button/button.component\";\nimport { AlertStatusIcon, AlertStatusToIconVariant } from \"./alert.records\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport {\n  AlertButton,\n  AlertButtonProps,\n} from \"./components/AlertButton/alertButton.component\";\n\ninterface AlertBaseProps\n  extends Omit<\n    CAlert.RootProps,\n    \"title\" | \"status\" | \"children\" | \"variant\" | \"size\"\n  > {\n  buttonProps?: AlertButtonProps;\n  description?: string | React.ReactNode;\n  descriptionProps?: TextProps;\n  hideIcon?: boolean;\n  iconProps?: IconProps;\n  onContrast?: boolean;\n  status?: Status;\n  title?: string | React.ReactNode;\n  titleProps?: HeadingProps;\n}\n\ninterface DefaultAlertProps extends AlertBaseProps {\n  hideCloseButton?: true;\n  onClose?: never;\n}\n\ninterface ClosableAlertProps extends AlertBaseProps {\n  hideCloseButton: false;\n  onClose: React.MouseEventHandler<HTMLButtonElement>;\n}\n\nexport type AlertProps = DefaultAlertProps | ClosableAlertProps;\n\nexport const Alert = ({\n  buttonProps,\n  description,\n  descriptionProps,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  onContrast = false,\n  status = \"success\",\n  title,\n  titleProps,\n  ...rest\n}: AlertProps): React.JSX.Element => {\n  const isTopRightButton = buttonProps?.buttonPosition === \"topRight\";\n  const WithButtonWrapper = isTopRightButton ? Flex : React.Fragment;\n\n  return (\n    <CAlert.Root\n      className=\"Alert\"\n      data-testid=\"kibble-alert\"\n      {...rest}\n      variant={status}\n      hideIcon={hideIcon}\n      onContrast={onContrast}\n    >\n      {!hideIcon && (\n        <CAlert.Indicator\n          className=\"Alert__Icon\"\n          data-testid=\"kibble-alert-icon\"\n        >\n          <Icon\n            variant={\n              onContrast ? \"onContrast\" : AlertStatusToIconVariant[status]\n            }\n            name={iconProps?.name || AlertStatusIcon[status]}\n            size=\"lg\"\n            {...iconProps}\n          />\n        </CAlert.Indicator>\n      )}\n      <CAlert.Content\n        className=\"Alert__Content\"\n        data-testid=\"kibble-alert-content\"\n      >\n        {title && (\n          <WithButtonWrapper justifyContent=\"space-between\">\n            <CAlert.Title\n              className=\"Alert__Title\"\n              data-testid=\"kibble-alert-title\"\n            >\n              <Heading\n                size=\"sm\"\n                variant={onContrast ? \"onContrast\" : \"default\"}\n                {...titleProps}\n              >\n                {title}\n              </Heading>\n            </CAlert.Title>\n            {buttonProps?.buttonPosition === \"topRight\" && (\n              <AlertButton\n                status={status}\n                onContrast={onContrast}\n                {...buttonProps}\n              />\n            )}\n          </WithButtonWrapper>\n        )}\n        {description && (\n          <WithButtonWrapper justifyContent=\"space-between\">\n            <CAlert.Description\n              className=\"Alert__Description\"\n              data-testid=\"kibble-alert-description\"\n            >\n              {typeof description === \"string\" ? (\n                <Text\n                  size=\"md\"\n                  variant={onContrast ? \"onContrast\" : \"default\"}\n                  {...descriptionProps}\n                >\n                  {description}\n                </Text>\n              ) : (\n                description\n              )}\n            </CAlert.Description>\n            {buttonProps?.buttonPosition === \"topRight\" && !title && (\n              <AlertButton\n                status={status}\n                onContrast={onContrast}\n                {...buttonProps}\n              />\n            )}\n          </WithButtonWrapper>\n        )}\n        {buttonProps?.buttonPosition === \"bottomLeft\" && (\n          <AlertButton\n            status={status}\n            onContrast={onContrast}\n            {...buttonProps}\n          />\n        )}\n      </CAlert.Content>\n      {!hideCloseButton && (\n        <Button\n          iconName=\"close\"\n          size=\"xs\"\n          variant=\"ghostNeutral\"\n          onContrast={onContrast}\n          onClick={onClose}\n        />\n      )}\n    </CAlert.Root>\n  );\n};\n","export const alertButtonPositions = [\"topRight\", \"bottomLeft\"] as const;\nexport type AlertButtonPosition = (typeof alertButtonPositions)[number];\n"],"names":["AlertStatusIcon","AlertStatusToIconVariant","AlertButton","buttonPosition","buttonText","status","rest","jsx","Box","Button","Alert","buttonProps","description","descriptionProps","hideCloseButton","hideIcon","iconProps","onClose","onContrast","title","titleProps","WithButtonWrapper","Flex","React","jsxs","CAlert.Root","CAlert.Indicator","Icon","CAlert.Content","CAlert.Title","Heading","CAlert.Description","Text","alertButtonPositions"],"mappings":"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"}

package/dist/chunks/alert.types-kskv5PHB.js

@@ -1,170 +0,0 @@
-import { x as t } from "./vendor-BBfll6i3.js";
-import g from "react";
-import { W as h } from "./heading.component-B8niLTxz.js";
-import { I as j } from "./icon.component-B-BWWGO3.js";
-import { W as b } from "./text.component-XYjOAc2s.js";
-import { B as f } from "./button.component-BiW8RE1U.js";
-import { B as A, F as _, ao as B, ap as k, aq as R, ar as w, as as N } from "./chakra-BqBkjpvZ.js";
-const v = {
-  error: "warningSign",
-  warning: "warningSign",
-  success: "checkmark",
-  info: "infoCircle",
-  default: "infoCircle"
-}, T = {
-  default: "default",
-  error: "danger",
-  info: "info",
-  success: "success",
-  warning: "warning"
-}, l = ({
-  buttonPosition: e,
-  buttonText: i,
-  status: r,
-  ...n
-}) => /* @__PURE__ */ t.jsx(
-  A,
-  {
-    className: "Alert__Button",
-    "data-testid": "kibble-alert-button",
-    ...e === "bottomLeft" && { pt: 2, pb: 1 },
-    children: /* @__PURE__ */ t.jsx(
-      f,
-      {
-        size: "xs",
-        variant: r === "default" ? "primary" : "secondary",
-        w: "max-content",
-        ...n,
-        children: i
-      }
-    )
-  }
-), D = ({
-  buttonProps: e,
-  description: i,
-  descriptionProps: r,
-  hideCloseButton: n = !1,
-  hideIcon: c = !1,
-  iconProps: d,
-  onClose: x,
-  onContrast: a = !1,
-  status: s = "success",
-  title: o,
-  titleProps: p,
-  ...u
-}) => {
-  const m = e?.buttonPosition === "topRight" ? _ : g.Fragment;
-  return /* @__PURE__ */ t.jsxs(
-    B,
-    {
-      className: "Alert",
-      "data-testid": "kibble-alert",
-      ...u,
-      variant: s,
-      hideIcon: c,
-      onContrast: a,
-      children: [
-        !c && /* @__PURE__ */ t.jsx(
-          k,
-          {
-            className: "Alert__Icon",
-            "data-testid": "kibble-alert-icon",
-            children: /* @__PURE__ */ t.jsx(
-              j,
-              {
-                variant: a ? "onContrast" : T[s],
-                name: d?.name || v[s],
-                size: "lg",
-                ...d
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ t.jsxs(
-          R,
-          {
-            className: "Alert__Content",
-            "data-testid": "kibble-alert-content",
-            children: [
-              o && /* @__PURE__ */ t.jsxs(m, { justifyContent: "space-between", children: [
-                /* @__PURE__ */ t.jsx(
-                  w,
-                  {
-                    className: "Alert__Title",
-                    "data-testid": "kibble-alert-title",
-                    children: /* @__PURE__ */ t.jsx(
-                      h,
-                      {
-                        size: "sm",
-                        variant: a ? "onContrast" : "default",
-                        ...p,
-                        children: o
-                      }
-                    )
-                  }
-                ),
-                e?.buttonPosition === "topRight" && /* @__PURE__ */ t.jsx(
-                  l,
-                  {
-                    status: s,
-                    onContrast: a,
-                    ...e
-                  }
-                )
-              ] }),
-              i && /* @__PURE__ */ t.jsxs(m, { justifyContent: "space-between", children: [
-                /* @__PURE__ */ t.jsx(
-                  N,
-                  {
-                    className: "Alert__Description",
-                    "data-testid": "kibble-alert-description",
-                    children: typeof i == "string" ? /* @__PURE__ */ t.jsx(
-                      b,
-                      {
-                        size: "md",
-                        variant: a ? "onContrast" : "default",
-                        ...r,
-                        children: i
-                      }
-                    ) : i
-                  }
-                ),
-                e?.buttonPosition === "topRight" && !o && /* @__PURE__ */ t.jsx(
-                  l,
-                  {
-                    status: s,
-                    onContrast: a,
-                    ...e
-                  }
-                )
-              ] }),
-              e?.buttonPosition === "bottomLeft" && /* @__PURE__ */ t.jsx(
-                l,
-                {
-                  status: s,
-                  onContrast: a,
-                  ...e
-                }
-              )
-            ]
-          }
-        ),
-        !n && /* @__PURE__ */ t.jsx(
-          f,
-          {
-            iconName: "close",
-            size: "xs",
-            variant: "ghostNeutral",
-            onContrast: a,
-            onClick: x
-          }
-        )
-      ]
-    }
-  );
-}, q = ["topRight", "bottomLeft"];
-export {
-  D as A,
-  q as a
-};
-//# sourceMappingURL=alert.types-kskv5PHB.js.map

package/dist/chunks/alert.types-kskv5PHB.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"alert.types-kskv5PHB.js","sources":["../../src/components/Alert/alert.records.ts","../../src/components/Alert/components/AlertButton/alertButton.component.tsx","../../src/components/Alert/alert.component.tsx","../../src/components/Alert/alert.types.ts"],"sourcesContent":["import { IconName } from \"components/Icon/icon.types\";\nimport { TypographyVariant } from \"shared/types\";\nimport { Status } from \"shared/types/status\";\n\nexport const AlertStatusIcon: Record<Status, IconName> = {\n  error: \"warningSign\",\n  warning: \"warningSign\",\n  success: \"checkmark\",\n  info: \"infoCircle\",\n  default: \"infoCircle\",\n};\n\nexport const AlertStatusToIconVariant: Record<Status, TypographyVariant> = {\n  default: \"default\",\n  error: \"danger\",\n  info: \"info\",\n  success: \"success\",\n  warning: \"warning\",\n};\n","import React from \"react\";\nimport { AlertButtonPosition } from \"components/Alert/alert.types\";\nimport { Button, ButtonProps } from \"components/Button/button.component\";\nimport { Status } from \"shared/types/status\";\nimport { Box } from \"@chakra-ui/react/box\";\n\nexport interface AlertButtonProps extends Omit<ButtonProps, \"children\"> {\n  buttonPosition?: AlertButtonPosition;\n  buttonText: string;\n}\n\ninterface InternalAlertButtonProps extends AlertButtonProps {\n  status: Status;\n}\n\nexport const AlertButton = ({\n  buttonPosition,\n  buttonText,\n  status,\n  ...rest\n}: InternalAlertButtonProps): React.JSX.Element => {\n  return (\n    <Box\n      className=\"Alert__Button\"\n      data-testid=\"kibble-alert-button\"\n      {...(buttonPosition === \"bottomLeft\" && { pt: 2, pb: 1 })}\n    >\n      <Button\n        size=\"xs\"\n        variant={status === \"default\" ? \"primary\" : \"secondary\"}\n        w=\"max-content\"\n        {...rest}\n      >\n        {buttonText}\n      </Button>\n    </Box>\n  );\n};\n","import React from \"react\";\nimport { Alert as CAlert } from \"@chakra-ui/react/alert\";\nimport { Heading, HeadingProps } from \"components/Heading/heading.component\";\nimport { Icon, IconProps } from \"components/Icon/icon.component\";\nimport { Text, TextProps } from \"components/Text/text.component\";\nimport { Status } from \"shared/types/status\";\nimport { Button } from \"components/Button/button.component\";\nimport { AlertStatusIcon, AlertStatusToIconVariant } from \"./alert.records\";\nimport { Flex } from \"@chakra-ui/react/flex\";\nimport {\n  AlertButton,\n  AlertButtonProps,\n} from \"./components/AlertButton/alertButton.component\";\n\ninterface AlertBaseProps\n  extends Omit<\n    CAlert.RootProps,\n    \"title\" | \"status\" | \"children\" | \"variant\" | \"size\"\n  > {\n  buttonProps?: AlertButtonProps;\n  description?: string | React.ReactNode;\n  descriptionProps?: TextProps;\n  hideIcon?: boolean;\n  iconProps?: IconProps;\n  onContrast?: boolean;\n  status?: Status;\n  title?: string | React.ReactNode;\n  titleProps?: HeadingProps;\n}\n\ninterface DefaultAlertProps extends AlertBaseProps {\n  hideCloseButton?: true;\n  onClose?: never;\n}\n\ninterface ClosableAlertProps extends AlertBaseProps {\n  hideCloseButton: false;\n  onClose: React.MouseEventHandler<HTMLButtonElement>;\n}\n\nexport type AlertProps = DefaultAlertProps | ClosableAlertProps;\n\nexport const Alert = ({\n  buttonProps,\n  description,\n  descriptionProps,\n  hideCloseButton = false,\n  hideIcon = false,\n  iconProps,\n  onClose,\n  onContrast = false,\n  status = \"success\",\n  title,\n  titleProps,\n  ...rest\n}: AlertProps): React.JSX.Element => {\n  const isTopRightButton = buttonProps?.buttonPosition === \"topRight\";\n  const WithButtonWrapper = isTopRightButton ? Flex : React.Fragment;\n\n  return (\n    <CAlert.Root\n      className=\"Alert\"\n      data-testid=\"kibble-alert\"\n      {...rest}\n      variant={status}\n      hideIcon={hideIcon}\n      onContrast={onContrast}\n    >\n      {!hideIcon && (\n        <CAlert.Indicator\n          className=\"Alert__Icon\"\n          data-testid=\"kibble-alert-icon\"\n        >\n          <Icon\n            variant={\n              onContrast ? \"onContrast\" : AlertStatusToIconVariant[status]\n            }\n            name={iconProps?.name || AlertStatusIcon[status]}\n            size=\"lg\"\n            {...iconProps}\n          />\n        </CAlert.Indicator>\n      )}\n      <CAlert.Content\n        className=\"Alert__Content\"\n        data-testid=\"kibble-alert-content\"\n      >\n        {title && (\n          <WithButtonWrapper justifyContent=\"space-between\">\n            <CAlert.Title\n              className=\"Alert__Title\"\n              data-testid=\"kibble-alert-title\"\n            >\n              <Heading\n                size=\"sm\"\n                variant={onContrast ? \"onContrast\" : \"default\"}\n                {...titleProps}\n              >\n                {title}\n              </Heading>\n            </CAlert.Title>\n            {buttonProps?.buttonPosition === \"topRight\" && (\n              <AlertButton\n                status={status}\n                onContrast={onContrast}\n                {...buttonProps}\n              />\n            )}\n          </WithButtonWrapper>\n        )}\n        {description && (\n          <WithButtonWrapper justifyContent=\"space-between\">\n            <CAlert.Description\n              className=\"Alert__Description\"\n              data-testid=\"kibble-alert-description\"\n            >\n              {typeof description === \"string\" ? (\n                <Text\n                  size=\"md\"\n                  variant={onContrast ? \"onContrast\" : \"default\"}\n                  {...descriptionProps}\n                >\n                  {description}\n                </Text>\n              ) : (\n                description\n              )}\n            </CAlert.Description>\n            {buttonProps?.buttonPosition === \"topRight\" && !title && (\n              <AlertButton\n                status={status}\n                onContrast={onContrast}\n                {...buttonProps}\n              />\n            )}\n          </WithButtonWrapper>\n        )}\n        {buttonProps?.buttonPosition === \"bottomLeft\" && (\n          <AlertButton\n            status={status}\n            onContrast={onContrast}\n            {...buttonProps}\n          />\n        )}\n      </CAlert.Content>\n      {!hideCloseButton && (\n        <Button\n          iconName=\"close\"\n          size=\"xs\"\n          variant=\"ghostNeutral\"\n          onContrast={onContrast}\n          onClick={onClose}\n        />\n      )}\n    </CAlert.Root>\n  );\n};\n","export const alertButtonPositions = [\"topRight\", \"bottomLeft\"] as const;\nexport type AlertButtonPosition = (typeof alertButtonPositions)[number];\n"],"names":["AlertStatusIcon","AlertStatusToIconVariant","AlertButton","buttonPosition","buttonText","status","rest","jsx","Box","Button","Alert","buttonProps","description","descriptionProps","hideCloseButton","hideIcon","iconProps","onClose","onContrast","title","titleProps","WithButtonWrapper","Flex","React","jsxs","CAlert.Root","CAlert.Indicator","Icon","CAlert.Content","CAlert.Title","Heading","CAlert.Description","Text","alertButtonPositions"],"mappings":"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"}