@keboola/design 11.0.0 → 11.2.0

package/dist/Badge-Ch26CXoP.js

@@ -0,0 +1,195 @@
+import { cn } from "./classNames-BzrkDnOD.js";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Badge/BadgeAddon.tsx
+const addonVariants = cva([
+	"tw:flex",
+	"tw:items-center",
+	"tw:shrink-0",
+	"tw:bg-inherit",
+	"tw:self-stretch",
+	"tw:px-1",
+	"tw:has-[button]:px-0",
+	"tw:[&_svg:not([class*=\"tw:size-\"])]:size-3"
+], {
+	defaultVariants: {
+		align: "inline-end",
+		variant: "inline"
+	},
+	variants: {
+		align: {
+			"inline-start": ["tw:order-first"],
+			"inline-end": ["tw:order-last"]
+		},
+		variant: {
+			inline: [],
+			floating: [
+				"tw:hidden",
+				"tw:group-hover/badge:flex",
+				"tw:absolute",
+				"tw:top-0",
+				"tw:bottom-0",
+				"tw:focus-within:flex"
+			]
+		}
+	},
+	compoundVariants: [{
+		variant: "floating",
+		align: "inline-end",
+		className: ["tw:right-0"]
+	}, {
+		variant: "floating",
+		align: "inline-start",
+		className: ["tw:left-0"]
+	}]
+});
+const BadgeAddon = ({ ref, align = "inline-end", variant = "inline", className, ...rest }) => /* @__PURE__ */ jsx("div", {
+	...rest,
+	ref,
+	"data-align": align,
+	"data-variant": variant,
+	className: cn(addonVariants({
+		align,
+		variant,
+		className
+	}))
+});
+//#endregion
+//#region src/components/Badge/BadgeButton.tsx
+const BadgeButton = ({ ref, className, type = "button", children, ...rest }) => /* @__PURE__ */ jsx("button", {
+	...rest,
+	ref,
+	type,
+	className: cn("tailwindcss-preflight", "tw:inline-flex", "tw:items-center", "tw:justify-center", "tw:cursor-pointer", "tw:bg-inherit", "tw:text-inherit", "tw:hover:brightness-95", "tw:px-1", "tw:[&_svg:not([class*=\"tw:size-\"])]:size-3", className),
+	children
+});
+//#endregion
+//#region src/components/Badge/BadgeLabel.tsx
+const BadgeLabel = ({ ref, className, asChild = false, ...rest }) => {
+	return /* @__PURE__ */ jsx(asChild ? Slot : "span", {
+		...rest,
+		ref,
+		"data-slot": "badge-label",
+		className: cn("tw:max-w-56", "tw:truncate", "tw:px-2", "tw:py-0.5", "tw:group-has-[[data-align=inline-start][data-variant=inline]:not(:empty)]/badge:pl-0", "tw:group-has-[[data-align=inline-end][data-variant=inline]:not(:empty)]/badge:pr-0", className)
+	});
+};
+const badgeRootVariants = cva([
+	"tailwindcss-preflight",
+	"tw:group/badge",
+	"tw:relative",
+	"tw:inline-flex",
+	"tw:justify-center",
+	"tw:items-center",
+	"tw:min-h-5",
+	"tw:h-fit",
+	"tw:shrink-0",
+	"tw:overflow-hidden",
+	"tw:whitespace-pre-wrap",
+	"tw:break-normal",
+	"tw:text-xs",
+	"tw:font-medium",
+	"tw:tracking-chrome",
+	"tw:text-center",
+	"tw:underline",
+	"tw:border-none",
+	"tw:[&>svg]:self-center",
+	"tw:[button&]:cursor-pointer",
+	"tw:focus-visible:outline-hidden",
+	"tw:focus-visible:ring-2",
+	"tw:focus-visible:ring-inset",
+	"tw:focus-visible:ring-ring"
+], {
+	defaultVariants: {
+		color: "gray",
+		variant: "default"
+	},
+	variants: {
+		variant: {
+			default: ["tw:rounded tw:uppercase", "tw:[[data-brand=keboola]_&]:normal-case tw:[[data-brand=keboola]_&]:tracking-normal"],
+			tag: ["tw:rounded tw:normal-case"],
+			pill: ["tw:min-w-5 tw:rounded-full tw:normal-case tw:tracking-normal"]
+		},
+		color: {
+			gray: "tw:bg-neutral-400 tw:text-white tw:decoration-neutral-400",
+			"gray-darker": "tw:bg-neutral-500 tw:text-white tw:decoration-neutral-500",
+			"gray-inverse": "tw:bg-neutral-100 tw:text-neutral-500 tw:decoration-neutral-100 tw:[[data-theme=dark]_&]:bg-neutral-700 tw:[[data-theme=dark]_&]:text-neutral-300 tw:[[data-theme=dark]_&]:decoration-neutral-700",
+			green: "tw:bg-green-500 tw:text-white tw:decoration-green-500",
+			"green-darker": "tw:bg-green-600 tw:text-white tw:decoration-green-600",
+			"green-inverse": "tw:bg-green-100 tw:text-green-900 tw:decoration-green-100 tw:[[data-theme=dark]_&]:bg-green-900 tw:[[data-theme=dark]_&]:text-green-200 tw:[[data-theme=dark]_&]:decoration-green-900",
+			blue: "tw:bg-blue-500 tw:text-white tw:decoration-blue-500",
+			"blue-inverse": "tw:bg-blue-100 tw:text-blue-800 tw:decoration-blue-100 tw:[[data-theme=dark]_&]:bg-blue-900 tw:[[data-theme=dark]_&]:text-blue-200 tw:[[data-theme=dark]_&]:decoration-blue-900",
+			red: "tw:bg-error-500 tw:text-white tw:decoration-error-500",
+			orange: "tw:bg-warning-500 tw:text-white tw:decoration-warning-500",
+			"orange-inverse": "tw:bg-warning-100 tw:text-warning-800 tw:decoration-warning-100 tw:[[data-theme=dark]_&]:bg-warning-900 tw:[[data-theme=dark]_&]:text-warning-200 tw:[[data-theme=dark]_&]:decoration-warning-900",
+			amber: "tw:bg-warning-300 tw:text-warning-800 tw:decoration-warning-300",
+			"amber-inverse": "tw:bg-warning-200 tw:text-warning-800 tw:decoration-warning-200 tw:[[data-theme=dark]_&]:bg-warning-800 tw:[[data-theme=dark]_&]:text-warning-200 tw:[[data-theme=dark]_&]:decoration-warning-800",
+			teal: "tw:bg-teal-500 tw:text-white tw:decoration-teal-500",
+			"teal-inverse": "tw:bg-teal-100 tw:text-teal-800 tw:decoration-teal-100 tw:[[data-theme=dark]_&]:bg-teal-900 tw:[[data-theme=dark]_&]:text-teal-200 tw:[[data-theme=dark]_&]:decoration-teal-900",
+			purple: "tw:bg-purple-500 tw:text-white tw:decoration-purple-500",
+			"purple-inverse": "tw:bg-purple-100 tw:text-purple-800 tw:decoration-purple-100 tw:[[data-theme=dark]_&]:bg-purple-900 tw:[[data-theme=dark]_&]:text-purple-200 tw:[[data-theme=dark]_&]:decoration-purple-900",
+			cyan: "tw:bg-cyan-500 tw:text-white tw:decoration-cyan-500",
+			"cyan-inverse": "tw:bg-cyan-100 tw:text-cyan-800 tw:decoration-cyan-100 tw:[[data-theme=dark]_&]:bg-cyan-900 tw:[[data-theme=dark]_&]:text-cyan-200 tw:[[data-theme=dark]_&]:decoration-cyan-900",
+			"sidebar-primary": "tw:bg-sidebar-primary tw:text-white tw:decoration-sidebar-primary",
+			white: "tw:bg-white/90 tw:text-neutral-600 tw:decoration-white/90"
+		}
+	}
+});
+//#endregion
+//#region src/components/Badge/BadgeRoot.tsx
+const BadgeRoot = ({ ref, variant, color, className, children, ...rest }) => /* @__PURE__ */ jsx("div", {
+	...rest,
+	ref,
+	"data-slot": "badge",
+	className: cn(badgeRootVariants({
+		variant,
+		color,
+		className
+	})),
+	children
+});
+//#endregion
+//#region src/components/Badge/Badge.tsx
+/**
+* Compact status / category label rendered as an inline pill.
+*
+* **When to use:** encoding status (active, deprecated, beta), counts, or decorative tags next to a title
+* or in a table cell. The `color` prop is a semantic contract — `green` means success, `red` means error
+* etc., and colours are intentionally stable across customer brand themes.
+* **When NOT to use:** for an inline action use `Button` / `ButtonInline`; for a persistent contextual
+* banner use `Alert`; for a counter-only chip prefer `Badge` with just a numeric label.
+* **Composition:** drop into `PageHeader.Detail` `badges` slot, `Table.Cell`, or alongside titles in cards.
+* Use `Badge.Button` for an interactive (clickable) badge variant.
+*/
+const BadgeInner = ({ ref, variant, color, prefix, prefixVariant = "inline", suffix, suffixVariant = "inline", className, labelClassName, ...labelProps }) => /* @__PURE__ */ jsxs(BadgeRoot, {
+	className,
+	variant,
+	color,
+	children: [
+		prefix && /* @__PURE__ */ jsx(BadgeAddon, {
+			align: "inline-start",
+			variant: prefixVariant,
+			children: prefix
+		}),
+		/* @__PURE__ */ jsx(BadgeLabel, {
+			...labelProps,
+			ref,
+			className: labelClassName
+		}),
+		suffix && /* @__PURE__ */ jsx(BadgeAddon, {
+			align: "inline-end",
+			variant: suffixVariant,
+			children: suffix
+		})
+	]
+});
+const Badge = Object.assign(BadgeInner, {
+	Root: BadgeRoot,
+	Button: BadgeButton,
+	Label: BadgeLabel,
+	Addon: BadgeAddon
+});
+//#endregion
+export { Badge };
+
+//# sourceMappingURL=Badge-Ch26CXoP.js.map

package/dist/Badge-Ch26CXoP.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge-Ch26CXoP.js","names":[],"sources":["../src/components/Badge/BadgeAddon.tsx","../src/components/Badge/BadgeButton.tsx","../src/components/Badge/BadgeLabel.tsx","../src/components/Badge/styles.ts","../src/components/Badge/BadgeRoot.tsx","../src/components/Badge/Badge.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '../../utils';\n\nconst addonVariants = cva(\n  [\n    'tw:flex',\n    'tw:items-center',\n    'tw:shrink-0',\n    'tw:bg-inherit',\n    'tw:self-stretch',\n    'tw:px-1',\n    'tw:has-[button]:px-0',\n    'tw:[&_svg:not([class*=\"tw:size-\"])]:size-3',\n  ],\n  {\n    defaultVariants: {\n      align: 'inline-end',\n      variant: 'inline',\n    },\n    variants: {\n      align: {\n        'inline-start': ['tw:order-first'],\n        'inline-end': ['tw:order-last'],\n      },\n      variant: {\n        inline: [],\n        floating: [\n          'tw:hidden',\n          'tw:group-hover/badge:flex',\n\n          'tw:absolute',\n          'tw:top-0',\n          'tw:bottom-0',\n          'tw:focus-within:flex',\n        ],\n      },\n    },\n    compoundVariants: [\n      { variant: 'floating', align: 'inline-end', className: ['tw:right-0'] },\n      { variant: 'floating', align: 'inline-start', className: ['tw:left-0'] },\n    ],\n  },\n);\n\ntype Props = ComponentProps<'div'> & VariantProps<typeof addonVariants>;\n\nexport const BadgeAddon = ({\n  ref,\n  align = 'inline-end',\n  variant = 'inline',\n  className,\n  ...rest\n}: Props) => (\n  <div\n    {...rest}\n    ref={ref}\n    data-align={align}\n    data-variant={variant}\n    className={cn(addonVariants({ align, variant, className }))}\n  />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'button'>;\n\nexport const BadgeButton = ({ ref, className, type = 'button', children, ...rest }: Props) => (\n  <button\n    {...rest}\n    ref={ref}\n    type={type}\n    className={cn(\n      'tailwindcss-preflight',\n\n      'tw:inline-flex',\n      'tw:items-center',\n      'tw:justify-center',\n      'tw:cursor-pointer',\n\n      'tw:bg-inherit',\n      'tw:text-inherit',\n\n      'tw:hover:brightness-95',\n      'tw:px-1',\n      // Default sizing for Lucide-icon children (which ship at 24×24); keeps\n      // the visual baseline aligned with the previous FA-icon API and other\n      // icon-wrapper components (ItemIcon, SidebarMenuIcon).\n      'tw:[&_svg:not([class*=\"tw:size-\"])]:size-3',\n      className,\n    )}\n  >\n    {children}\n  </button>\n);\n","import type { ComponentProps } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'span'> & {\n  asChild?: boolean;\n};\n\nexport const BadgeLabel = ({ ref, className, asChild = false, ...rest }: Props) => {\n  const Comp = asChild ? Slot : 'span';\n  return (\n    <Comp\n      {...rest}\n      ref={ref}\n      data-slot=\"badge-label\"\n      className={cn(\n        'tw:max-w-56',\n        'tw:truncate',\n        'tw:px-2',\n        'tw:py-0.5',\n\n        // Drop side padding only when an *inline* addon is present —\n        // floating addons overlay the label without taking layout space,\n        // so the label still needs full padding behind them.\n        'tw:group-has-[[data-align=inline-start][data-variant=inline]:not(:empty)]/badge:pl-0',\n        'tw:group-has-[[data-align=inline-end][data-variant=inline]:not(:empty)]/badge:pr-0',\n        className,\n      )}\n    />\n  );\n};\n","import { cva } from 'class-variance-authority';\n\n/**\n * Badge's `color` variants: a fill class, a foreground class, and a matching\n * `decoration-*` so an underlined badge underlines in its own fill colour.\n *\n * - Tinted (`-inverse`) variants each carry a `[data-theme=dark]` override, so the\n *   chip inverts with the page instead of staying a light slab on a dark surface.\n * - Solid fills are fixed across schemes.\n * - Exported for `scripts/contrast-audit.ts` and the contrast story tests, which\n *   measure each pairing rather than restating this map.\n */\nexport const badgeColors = {\n  gray: 'tw:bg-neutral-400 tw:text-white tw:decoration-neutral-400',\n  'gray-darker': 'tw:bg-neutral-500 tw:text-white tw:decoration-neutral-500',\n  'gray-inverse':\n    'tw:bg-neutral-100 tw:text-neutral-500 tw:decoration-neutral-100 tw:[[data-theme=dark]_&]:bg-neutral-700 tw:[[data-theme=dark]_&]:text-neutral-300 tw:[[data-theme=dark]_&]:decoration-neutral-700',\n  green: 'tw:bg-green-500 tw:text-white tw:decoration-green-500',\n  'green-darker': 'tw:bg-green-600 tw:text-white tw:decoration-green-600',\n  'green-inverse':\n    'tw:bg-green-100 tw:text-green-900 tw:decoration-green-100 tw:[[data-theme=dark]_&]:bg-green-900 tw:[[data-theme=dark]_&]:text-green-200 tw:[[data-theme=dark]_&]:decoration-green-900',\n  blue: 'tw:bg-blue-500 tw:text-white tw:decoration-blue-500',\n  'blue-inverse':\n    'tw:bg-blue-100 tw:text-blue-800 tw:decoration-blue-100 tw:[[data-theme=dark]_&]:bg-blue-900 tw:[[data-theme=dark]_&]:text-blue-200 tw:[[data-theme=dark]_&]:decoration-blue-900',\n  red: 'tw:bg-error-500 tw:text-white tw:decoration-error-500',\n  orange: 'tw:bg-warning-500 tw:text-white tw:decoration-warning-500',\n  'orange-inverse':\n    'tw:bg-warning-100 tw:text-warning-800 tw:decoration-warning-100 tw:[[data-theme=dark]_&]:bg-warning-900 tw:[[data-theme=dark]_&]:text-warning-200 tw:[[data-theme=dark]_&]:decoration-warning-900',\n  amber: 'tw:bg-warning-300 tw:text-warning-800 tw:decoration-warning-300',\n  // One rung deeper than `orange-inverse` on both ends of the ramp, which is what\n  // keeps caution and warning telling apart — the two share the `warning` hue.\n  'amber-inverse':\n    'tw:bg-warning-200 tw:text-warning-800 tw:decoration-warning-200 tw:[[data-theme=dark]_&]:bg-warning-800 tw:[[data-theme=dark]_&]:text-warning-200 tw:[[data-theme=dark]_&]:decoration-warning-800',\n  teal: 'tw:bg-teal-500 tw:text-white tw:decoration-teal-500',\n  'teal-inverse':\n    'tw:bg-teal-100 tw:text-teal-800 tw:decoration-teal-100 tw:[[data-theme=dark]_&]:bg-teal-900 tw:[[data-theme=dark]_&]:text-teal-200 tw:[[data-theme=dark]_&]:decoration-teal-900',\n  purple: 'tw:bg-purple-500 tw:text-white tw:decoration-purple-500',\n  'purple-inverse':\n    'tw:bg-purple-100 tw:text-purple-800 tw:decoration-purple-100 tw:[[data-theme=dark]_&]:bg-purple-900 tw:[[data-theme=dark]_&]:text-purple-200 tw:[[data-theme=dark]_&]:decoration-purple-900',\n  cyan: 'tw:bg-cyan-500 tw:text-white tw:decoration-cyan-500',\n  'cyan-inverse':\n    'tw:bg-cyan-100 tw:text-cyan-800 tw:decoration-cyan-100 tw:[[data-theme=dark]_&]:bg-cyan-900 tw:[[data-theme=dark]_&]:text-cyan-200 tw:[[data-theme=dark]_&]:decoration-cyan-900',\n  'sidebar-primary': 'tw:bg-sidebar-primary tw:text-white tw:decoration-sidebar-primary',\n  white: 'tw:bg-white/90 tw:text-neutral-600 tw:decoration-white/90',\n} as const;\n\n/** A `Badge` `color` value. */\nexport type BadgeColor = keyof typeof badgeColors;\n\n/**\n * Whether a variant paints text on its own tint rather than on a solid fill.\n *\n * - Tinted variants are the ones held to WCAG-AA per `AGENTS.md`; solid `-500`\n *   fills are pinned across brands, so their contrast is recorded, not asserted.\n */\nexport const isTintedBadgeColor = (color: string): boolean => color.endsWith('-inverse');\n\nexport const badgeRootVariants = cva(\n  [\n    'tailwindcss-preflight',\n    'tw:group/badge',\n\n    // display\n    'tw:relative',\n    'tw:inline-flex',\n    'tw:justify-center',\n    'tw:items-center',\n    'tw:min-h-5',\n    'tw:h-fit',\n    'tw:shrink-0',\n    'tw:overflow-hidden',\n\n    // text — chrome weight/tracking are brand-overridable tokens\n    // (`--font-weight-medium` / `--letter-spacing-chrome`); casing lives on the\n    // `default` variant below via `tw:uppercase`.\n    'tw:whitespace-pre-wrap',\n    'tw:break-normal',\n    'tw:text-xs',\n    'tw:font-medium',\n    'tw:tracking-chrome',\n    'tw:text-center',\n    'tw:underline',\n\n    // content\n    'tw:border-none',\n    'tw:[&>svg]:self-center',\n    'tw:[button&]:cursor-pointer',\n\n    // focus\n    'tw:focus-visible:outline-hidden',\n    'tw:focus-visible:ring-2',\n    'tw:focus-visible:ring-inset',\n    'tw:focus-visible:ring-ring',\n  ],\n  {\n    defaultVariants: {\n      color: 'gray',\n      variant: 'default',\n    },\n    variants: {\n      variant: {\n        // Legacy chrome uppercases the default badge; the Keboola V2 brand\n        // (`data-brand=\"keboola\"`) renders it in standard case instead.\n        default: [\n          'tw:rounded tw:uppercase',\n          'tw:[[data-brand=keboola]_&]:normal-case tw:[[data-brand=keboola]_&]:tracking-normal',\n        ],\n        tag: ['tw:rounded tw:normal-case'],\n        pill: ['tw:min-w-5 tw:rounded-full tw:normal-case tw:tracking-normal'],\n      },\n      color: badgeColors,\n    },\n  },\n);\n","import type { ComponentProps } from 'react';\nimport { type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '../../utils';\n\nimport { badgeRootVariants } from './styles';\n\ntype Props = ComponentProps<'div'> & VariantProps<typeof badgeRootVariants>;\n\nexport const BadgeRoot = ({ ref, variant, color, className, children, ...rest }: Props) => (\n  <div\n    {...rest}\n    ref={ref}\n    data-slot=\"badge\"\n    className={cn(badgeRootVariants({ variant, color, className }))}\n  >\n    {children}\n  </div>\n);\n","import type { ComponentProps, ReactNode } from 'react';\n\nimport { BadgeAddon } from './BadgeAddon';\nimport { BadgeButton } from './BadgeButton';\nimport { BadgeLabel } from './BadgeLabel';\nimport { BadgeRoot } from './BadgeRoot';\n\ntype AddonVariant = ComponentProps<typeof BadgeAddon>['variant'];\ntype BadgeRootProps = ComponentProps<typeof BadgeRoot>;\ntype BadgeLabelProps = ComponentProps<typeof BadgeLabel>;\n\n/**\n * Props for `Badge`. `color` is a categorical contract (`green` = success, `red` = error, `orange` = warning,\n * `amber` = caution, `purple/cyan/teal/blue/gray` for decorative tags) — colours stay fixed across brand themes.\n * Pass `prefix` / `suffix` for icon-style addons.\n */\ntype Props = Pick<BadgeRootProps, 'variant' | 'color'> &\n  Omit<BadgeLabelProps, 'prefix'> & {\n    prefix?: ReactNode;\n    prefixVariant?: AddonVariant;\n    suffix?: ReactNode;\n    suffixVariant?: AddonVariant;\n    labelClassName?: string;\n  };\n\n/**\n * Compact status / category label rendered as an inline pill.\n *\n * **When to use:** encoding status (active, deprecated, beta), counts, or decorative tags next to a title\n * or in a table cell. The `color` prop is a semantic contract — `green` means success, `red` means error\n * etc., and colours are intentionally stable across customer brand themes.\n * **When NOT to use:** for an inline action use `Button` / `ButtonInline`; for a persistent contextual\n * banner use `Alert`; for a counter-only chip prefer `Badge` with just a numeric label.\n * **Composition:** drop into `PageHeader.Detail` `badges` slot, `Table.Cell`, or alongside titles in cards.\n * Use `Badge.Button` for an interactive (clickable) badge variant.\n */\nconst BadgeInner = ({\n  ref,\n  // root props\n  variant,\n  color,\n  // custom props\n  prefix,\n  prefixVariant = 'inline',\n  suffix,\n  suffixVariant = 'inline',\n  className,\n  labelClassName,\n  ...labelProps\n}: Props) => (\n  <BadgeRoot className={className} variant={variant} color={color}>\n    {prefix && (\n      <BadgeAddon align=\"inline-start\" variant={prefixVariant}>\n        {prefix}\n      </BadgeAddon>\n    )}\n    <BadgeLabel {...labelProps} ref={ref} className={labelClassName} />\n    {suffix && (\n      <BadgeAddon align=\"inline-end\" variant={suffixVariant}>\n        {suffix}\n      </BadgeAddon>\n    )}\n  </BadgeRoot>\n);\n\nexport const Badge = Object.assign(BadgeInner, {\n  Root: BadgeRoot,\n  Button: BadgeButton,\n  Label: BadgeLabel,\n  Addon: BadgeAddon,\n});\n"],"mappings":"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"}