@j2-health/design-system 0.4.0 → 0.5.0

package/dist/src/components/manageColumns/ManageColumnsPanel.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+export type ManageColumnsColumn = {
+    id: string;
+    label: string;
+    visible: boolean;
+    /** Always visible, not draggable. Put pinned columns first in `columns`. */
+    pinned?: boolean;
+};
+export type ManageColumnsPanelProps = {
+    /** Columns in display order. Put any `pinned` columns first. */
+    columns: ManageColumnsColumn[];
+    onToggle?: (id: string) => void;
+    /** Batched select-all/clear-all handler — prefer this over the `onToggle` loop fallback, which can drop updates under a closure-captured state snapshot. */
+    onToggleAll?: (ids: string[], visible: boolean) => void;
+    onReorder?: (orderedIds: string[]) => void;
+    description?: ReactNode;
+};
+export declare function ManageColumnsPanel({ columns, onToggle, onToggleAll, onReorder, description, }: ManageColumnsPanelProps): import("react").JSX.Element;

package/dist/src/components/manageColumns/ManageColumnsPanel.js

@@ -0,0 +1,79 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useSensors, useSensor, PointerSensor, KeyboardSensor, DndContext, closestCenter } from "@dnd-kit/core";
+import { sortableKeyboardCoordinates, SortableContext, verticalListSortingStrategy, arrayMove } from "@dnd-kit/sortable";
+import { ManageColumnsItem } from "./ManageColumnsItem.js";
+import { SelectAll } from "./SelectAll.js";
+const noop = () => {
+};
+function ManageColumnsPanel({
+  columns,
+  onToggle,
+  onToggleAll,
+  onReorder,
+  description
+}) {
+  const toggleable = useMemo(() => columns.filter((c) => !c.pinned), [columns]);
+  const visibleCount = toggleable.filter((c) => c.visible).length;
+  const sensors = useSensors(
+    useSensor(PointerSensor, { activationConstraint: { distance: 4 } }),
+    useSensor(KeyboardSensor, {
+      coordinateGetter: sortableKeyboardCoordinates
+    })
+  );
+  const pinnedIds = useMemo(
+    () => columns.filter((c) => c.pinned).map((c) => c.id),
+    [columns]
+  );
+  const itemIds = useMemo(() => toggleable.map((c) => c.id), [toggleable]);
+  const handleDragEnd = (event) => {
+    const { active, over } = event;
+    if (!over || active.id === over.id) return;
+    const from = itemIds.indexOf(active.id);
+    const to = itemIds.indexOf(over.id);
+    if (from === -1 || to === -1) return;
+    onReorder == null ? void 0 : onReorder([...pinnedIds, ...arrayMove(itemIds, from, to)]);
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    toggleable.length > 0 && /* @__PURE__ */ jsxs("div", { className: "sticky -top-4 z-10 -mt-4 -mx-4 pt-3 px-4 pb-2 mb-3 bg-white border-b border-j2-border-secondary flex items-baseline justify-between", children: [
+      /* @__PURE__ */ jsxs("span", { className: "font-semibold text-sm text-j2-text", children: [
+        visibleCount,
+        "/",
+        toggleable.length,
+        " Columns Shown"
+      ] }),
+      /* @__PURE__ */ jsx(
+        SelectAll,
+        {
+          columns,
+          onToggle,
+          onToggleAll
+        }
+      )
+    ] }),
+    description && /* @__PURE__ */ jsx("p", { className: "text-sm text-j2-text mb-4", children: description }),
+    /* @__PURE__ */ jsx(
+      DndContext,
+      {
+        sensors,
+        collisionDetection: closestCenter,
+        onDragEnd: handleDragEnd,
+        children: /* @__PURE__ */ jsx(SortableContext, { items: itemIds, strategy: verticalListSortingStrategy, children: /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: columns.map((column) => /* @__PURE__ */ jsx(
+          ManageColumnsItem,
+          {
+            id: column.id,
+            label: column.label,
+            visible: column.pinned ? true : column.visible,
+            pinned: Boolean(column.pinned),
+            onToggle: onToggle ?? noop
+          },
+          column.id
+        )) }) })
+      }
+    )
+  ] });
+}
+export {
+  ManageColumnsPanel
+};
+//# sourceMappingURL=ManageColumnsPanel.js.map

package/dist/src/components/manageColumns/ManageColumnsPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ManageColumnsPanel.js","sources":["../../../../src/components/manageColumns/ManageColumnsPanel.tsx"],"sourcesContent":["import { useMemo, type ReactNode } from 'react'\nimport {\n  DndContext,\n  KeyboardSensor,\n  PointerSensor,\n  closestCenter,\n  useSensor,\n  useSensors,\n  type DragEndEvent,\n} from '@dnd-kit/core'\nimport {\n  SortableContext,\n  arrayMove,\n  sortableKeyboardCoordinates,\n  verticalListSortingStrategy,\n} from '@dnd-kit/sortable'\n\nimport { ManageColumnsItem } from './ManageColumnsItem'\nimport { SelectAll } from './SelectAll'\n\nconst noop = () => {}\n\nexport type ManageColumnsColumn = {\n  id: string\n  label: string\n  visible: boolean\n  /** Always visible, not draggable. Put pinned columns first in `columns`. */\n  pinned?: boolean\n}\n\nexport type ManageColumnsPanelProps = {\n  /** Columns in display order. Put any `pinned` columns first. */\n  columns: ManageColumnsColumn[]\n  onToggle?: (id: string) => void\n  /** Batched select-all/clear-all handler — prefer this over the `onToggle` loop fallback, which can drop updates under a closure-captured state snapshot. */\n  onToggleAll?: (ids: string[], visible: boolean) => void\n  onReorder?: (orderedIds: string[]) => void\n  description?: ReactNode\n}\n\nexport function ManageColumnsPanel({\n  columns,\n  onToggle,\n  onToggleAll,\n  onReorder,\n  description,\n}: ManageColumnsPanelProps) {\n  const toggleable = useMemo(() => columns.filter((c) => !c.pinned), [columns])\n  const visibleCount = toggleable.filter((c) => c.visible).length\n\n  const sensors = useSensors(\n    useSensor(PointerSensor, { activationConstraint: { distance: 4 } }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    })\n  )\n\n  const pinnedIds = useMemo(\n    () => columns.filter((c) => c.pinned).map((c) => c.id),\n    [columns]\n  )\n  const itemIds = useMemo(() => toggleable.map((c) => c.id), [toggleable])\n\n  const handleDragEnd = (event: DragEndEvent) => {\n    const { active, over } = event\n    if (!over || active.id === over.id) return\n    const from = itemIds.indexOf(active.id as string)\n    const to = itemIds.indexOf(over.id as string)\n    if (from === -1 || to === -1) return\n    onReorder?.([...pinnedIds, ...arrayMove(itemIds, from, to)])\n  }\n\n  return (\n    <>\n      {toggleable.length > 0 && (\n        <div className=\"sticky -top-4 z-10 -mt-4 -mx-4 pt-3 px-4 pb-2 mb-3 bg-white border-b border-j2-border-secondary flex items-baseline justify-between\">\n          <span className=\"font-semibold text-sm text-j2-text\">\n            {visibleCount}/{toggleable.length} Columns Shown\n          </span>\n          <SelectAll\n            columns={columns}\n            onToggle={onToggle}\n            onToggleAll={onToggleAll}\n          />\n        </div>\n      )}\n      {description && (\n        <p className=\"text-sm text-j2-text mb-4\">{description}</p>\n      )}\n      <DndContext\n        sensors={sensors}\n        collisionDetection={closestCenter}\n        onDragEnd={handleDragEnd}\n      >\n        <SortableContext items={itemIds} strategy={verticalListSortingStrategy}>\n          <div className=\"flex flex-col\">\n            {columns.map((column) => (\n              <ManageColumnsItem\n                key={column.id}\n                id={column.id}\n                label={column.label}\n                visible={column.pinned ? true : column.visible}\n                pinned={Boolean(column.pinned)}\n                onToggle={onToggle ?? noop}\n              />\n            ))}\n          </div>\n        </SortableContext>\n      </DndContext>\n    </>\n  )\n}\n"],"names":[],"mappings":";;;;;;AAoBA,MAAM,OAAO,MAAM;AAAC;AAoBb,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA4B;AAC1B,QAAM,aAAa,QAAQ,MAAM,QAAQ,OAAO,CAAC,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;AAC5E,QAAM,eAAe,WAAW,OAAO,CAAC,MAAM,EAAE,OAAO,EAAE;AAEzD,QAAM,UAAU;AAAA,IACd,UAAU,eAAe,EAAE,sBAAsB,EAAE,UAAU,EAAA,GAAK;AAAA,IAClE,UAAU,gBAAgB;AAAA,MACxB,kBAAkB;AAAA,IAAA,CACnB;AAAA,EAAA;AAGH,QAAM,YAAY;AAAA,IAChB,MAAM,QAAQ,OAAO,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE;AAAA,IACrD,CAAC,OAAO;AAAA,EAAA;AAEV,QAAM,UAAU,QAAQ,MAAM,WAAW,IAAI,CAAC,MAAM,EAAE,EAAE,GAAG,CAAC,UAAU,CAAC;AAEvE,QAAM,gBAAgB,CAAC,UAAwB;AAC7C,UAAM,EAAE,QAAQ,KAAA,IAAS;AACzB,QAAI,CAAC,QAAQ,OAAO,OAAO,KAAK,GAAI;AACpC,UAAM,OAAO,QAAQ,QAAQ,OAAO,EAAY;AAChD,UAAM,KAAK,QAAQ,QAAQ,KAAK,EAAY;AAC5C,QAAI,SAAS,MAAM,OAAO,GAAI;AAC9B,2CAAY,CAAC,GAAG,WAAW,GAAG,UAAU,SAAS,MAAM,EAAE,CAAC;AAAA,EAC5D;AAEA,SACE,qBAAA,UAAA,EACG,UAAA;AAAA,IAAA,WAAW,SAAS,KACnB,qBAAC,OAAA,EAAI,WAAU,uIACb,UAAA;AAAA,MAAA,qBAAC,QAAA,EAAK,WAAU,sCACb,UAAA;AAAA,QAAA;AAAA,QAAa;AAAA,QAAE,WAAW;AAAA,QAAO;AAAA,MAAA,GACpC;AAAA,MACA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MAAA;AAAA,IACF,GACF;AAAA,IAED,eACC,oBAAC,KAAA,EAAE,WAAU,6BAA6B,UAAA,aAAY;AAAA,IAExD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,oBAAoB;AAAA,QACpB,WAAW;AAAA,QAEX,UAAA,oBAAC,iBAAA,EAAgB,OAAO,SAAS,UAAU,6BACzC,UAAA,oBAAC,OAAA,EAAI,WAAU,iBACZ,UAAA,QAAQ,IAAI,CAAC,WACZ;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,IAAI,OAAO;AAAA,YACX,OAAO,OAAO;AAAA,YACd,SAAS,OAAO,SAAS,OAAO,OAAO;AAAA,YACvC,QAAQ,QAAQ,OAAO,MAAM;AAAA,YAC7B,UAAU,YAAY;AAAA,UAAA;AAAA,UALjB,OAAO;AAAA,QAAA,CAOf,GACH,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;"}

package/dist/src/components/manageColumns/SelectAll.cjs

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const Button = require("../button/Button.cjs");
+function SelectAll({ columns, onToggle, onToggleAll }) {
+  const toggleable = React.useMemo(() => columns.filter((c) => !c.pinned), [columns]);
+  const allVisible = toggleable.length > 0 && toggleable.every((c) => c.visible);
+  const label = allVisible ? "Clear all" : "Select all";
+  if (toggleable.length === 0) return null;
+  const handleSelectAllToggle = () => {
+    const affected = toggleable.filter((c) => c.visible === allVisible);
+    if (onToggleAll) {
+      onToggleAll(
+        affected.map((c) => c.id),
+        !allVisible
+      );
+      return;
+    }
+    for (const column of affected) {
+      onToggle == null ? void 0 : onToggle(column.id);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { type: "text", size: "small", onClick: handleSelectAllToggle, children: label });
+}
+exports.SelectAll = SelectAll;
+//# sourceMappingURL=SelectAll.cjs.map

package/dist/src/components/manageColumns/SelectAll.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectAll.cjs","sources":["../../../../src/components/manageColumns/SelectAll.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { Button } from '../button'\nimport type { ManageColumnsColumn } from './ManageColumnsPanel'\n\nexport type SelectAllProps = {\n  /** Same `columns` passed to the paired `ManageColumnsPanel`. */\n  columns: ManageColumnsColumn[]\n  onToggle?: (id: string) => void\n  /** Batched select-all/clear-all handler — prefer this over the `onToggle` loop fallback, which can drop updates under a closure-captured state snapshot. */\n  onToggleAll?: (ids: string[], visible: boolean) => void\n}\n\n/**\n * Select-all/clear-all control, composed by `ManageColumnsPanel` itself\n * above its description. Kept as its own component (not inlined) so its\n * label/toggle logic is testable independent of the panel's drag-reorder\n * machinery.\n */\nexport function SelectAll({ columns, onToggle, onToggleAll }: SelectAllProps) {\n  const toggleable = useMemo(() => columns.filter((c) => !c.pinned), [columns])\n  const allVisible = toggleable.length > 0 && toggleable.every((c) => c.visible)\n  const label = allVisible ? 'Clear all' : 'Select all'\n\n  if (toggleable.length === 0) return null\n\n  const handleSelectAllToggle = () => {\n    const affected = toggleable.filter((c) => c.visible === allVisible)\n    if (onToggleAll) {\n      onToggleAll(\n        affected.map((c) => c.id),\n        !allVisible\n      )\n      return\n    }\n    for (const column of affected) {\n      onToggle?.(column.id)\n    }\n  }\n\n  return (\n    <Button type=\"text\" size=\"small\" onClick={handleSelectAllToggle}>\n      {label}\n    </Button>\n  )\n}\n"],"names":["useMemo","jsx","Button"],"mappings":";;;;;AAmBO,SAAS,UAAU,EAAE,SAAS,UAAU,eAA+B;AAC5E,QAAM,aAAaA,MAAAA,QAAQ,MAAM,QAAQ,OAAO,CAAC,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;AAC5E,QAAM,aAAa,WAAW,SAAS,KAAK,WAAW,MAAM,CAAC,MAAM,EAAE,OAAO;AAC7E,QAAM,QAAQ,aAAa,cAAc;AAEzC,MAAI,WAAW,WAAW,EAAG,QAAO;AAEpC,QAAM,wBAAwB,MAAM;AAClC,UAAM,WAAW,WAAW,OAAO,CAAC,MAAM,EAAE,YAAY,UAAU;AAClE,QAAI,aAAa;AACf;AAAA,QACE,SAAS,IAAI,CAAC,MAAM,EAAE,EAAE;AAAA,QACxB,CAAC;AAAA,MAAA;AAEH;AAAA,IACF;AACA,eAAW,UAAU,UAAU;AAC7B,2CAAW,OAAO;AAAA,IACpB;AAAA,EACF;AAEA,SACEC,+BAACC,OAAAA,UAAO,MAAK,QAAO,MAAK,SAAQ,SAAS,uBACvC,UAAA,MAAA,CACH;AAEJ;;"}

package/dist/src/components/manageColumns/SelectAll.d.ts

@@ -0,0 +1,15 @@
+import { ManageColumnsColumn } from './ManageColumnsPanel.js';
+export type SelectAllProps = {
+    /** Same `columns` passed to the paired `ManageColumnsPanel`. */
+    columns: ManageColumnsColumn[];
+    onToggle?: (id: string) => void;
+    /** Batched select-all/clear-all handler — prefer this over the `onToggle` loop fallback, which can drop updates under a closure-captured state snapshot. */
+    onToggleAll?: (ids: string[], visible: boolean) => void;
+};
+/**
+ * Select-all/clear-all control, composed by `ManageColumnsPanel` itself
+ * above its description. Kept as its own component (not inlined) so its
+ * label/toggle logic is testable independent of the panel's drag-reorder
+ * machinery.
+ */
+export declare function SelectAll({ columns, onToggle, onToggleAll }: SelectAllProps): import("react").JSX.Element | null;

package/dist/src/components/manageColumns/SelectAll.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Button } from "../button/Button.js";
+function SelectAll({ columns, onToggle, onToggleAll }) {
+  const toggleable = useMemo(() => columns.filter((c) => !c.pinned), [columns]);
+  const allVisible = toggleable.length > 0 && toggleable.every((c) => c.visible);
+  const label = allVisible ? "Clear all" : "Select all";
+  if (toggleable.length === 0) return null;
+  const handleSelectAllToggle = () => {
+    const affected = toggleable.filter((c) => c.visible === allVisible);
+    if (onToggleAll) {
+      onToggleAll(
+        affected.map((c) => c.id),
+        !allVisible
+      );
+      return;
+    }
+    for (const column of affected) {
+      onToggle == null ? void 0 : onToggle(column.id);
+    }
+  };
+  return /* @__PURE__ */ jsx(Button, { type: "text", size: "small", onClick: handleSelectAllToggle, children: label });
+}
+export {
+  SelectAll
+};
+//# sourceMappingURL=SelectAll.js.map

package/dist/src/components/manageColumns/SelectAll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectAll.js","sources":["../../../../src/components/manageColumns/SelectAll.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { Button } from '../button'\nimport type { ManageColumnsColumn } from './ManageColumnsPanel'\n\nexport type SelectAllProps = {\n  /** Same `columns` passed to the paired `ManageColumnsPanel`. */\n  columns: ManageColumnsColumn[]\n  onToggle?: (id: string) => void\n  /** Batched select-all/clear-all handler — prefer this over the `onToggle` loop fallback, which can drop updates under a closure-captured state snapshot. */\n  onToggleAll?: (ids: string[], visible: boolean) => void\n}\n\n/**\n * Select-all/clear-all control, composed by `ManageColumnsPanel` itself\n * above its description. Kept as its own component (not inlined) so its\n * label/toggle logic is testable independent of the panel's drag-reorder\n * machinery.\n */\nexport function SelectAll({ columns, onToggle, onToggleAll }: SelectAllProps) {\n  const toggleable = useMemo(() => columns.filter((c) => !c.pinned), [columns])\n  const allVisible = toggleable.length > 0 && toggleable.every((c) => c.visible)\n  const label = allVisible ? 'Clear all' : 'Select all'\n\n  if (toggleable.length === 0) return null\n\n  const handleSelectAllToggle = () => {\n    const affected = toggleable.filter((c) => c.visible === allVisible)\n    if (onToggleAll) {\n      onToggleAll(\n        affected.map((c) => c.id),\n        !allVisible\n      )\n      return\n    }\n    for (const column of affected) {\n      onToggle?.(column.id)\n    }\n  }\n\n  return (\n    <Button type=\"text\" size=\"small\" onClick={handleSelectAllToggle}>\n      {label}\n    </Button>\n  )\n}\n"],"names":[],"mappings":";;;AAmBO,SAAS,UAAU,EAAE,SAAS,UAAU,eAA+B;AAC5E,QAAM,aAAa,QAAQ,MAAM,QAAQ,OAAO,CAAC,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;AAC5E,QAAM,aAAa,WAAW,SAAS,KAAK,WAAW,MAAM,CAAC,MAAM,EAAE,OAAO;AAC7E,QAAM,QAAQ,aAAa,cAAc;AAEzC,MAAI,WAAW,WAAW,EAAG,QAAO;AAEpC,QAAM,wBAAwB,MAAM;AAClC,UAAM,WAAW,WAAW,OAAO,CAAC,MAAM,EAAE,YAAY,UAAU;AAClE,QAAI,aAAa;AACf;AAAA,QACE,SAAS,IAAI,CAAC,MAAM,EAAE,EAAE;AAAA,QACxB,CAAC;AAAA,MAAA;AAEH;AAAA,IACF;AACA,eAAW,UAAU,UAAU;AAC7B,2CAAW,OAAO;AAAA,IACpB;AAAA,EACF;AAEA,SACE,oBAAC,UAAO,MAAK,QAAO,MAAK,SAAQ,SAAS,uBACvC,UAAA,MAAA,CACH;AAEJ;"}

package/dist/src/components/manageColumns/index.d.ts

@@ -0,0 +1,4 @@
+export { ManageColumnsPanel } from './ManageColumnsPanel.js';
+export type { ManageColumnsColumn, ManageColumnsPanelProps, } from './ManageColumnsPanel.js';
+export { SelectAll } from './SelectAll.js';
+export type { SelectAllProps } from './SelectAll.js';

package/dist/src/components/vennDiagram/VennDiagram.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("@highcharts/react");
 require("@highcharts/react/series/Venn.js");
-require("@highcharts/react/options/Accessibility.js");
+require("@highcharts/react/modules/Accessibility.js");
 const antd = require("antd");
 const VennDiagram = ({ data, title, tooltip, onClick }) => {
   const { token } = antd.theme.useToken();

package/dist/src/components/vennDiagram/VennDiagram.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"VennDiagram.cjs","sources":["../../../../src/components/vennDiagram/VennDiagram.tsx"],"sourcesContent":["import type * as Highcharts from 'highcharts'\nimport { Chart as HighchartsReact } from '@highcharts/react'\nimport '@highcharts/react/series/Venn.js'\nimport '@highcharts/react/options/Accessibility.js'\nimport { theme } from 'antd'\n\ntype Props = {\n  data: Highcharts.PointOptionsObject[]\n  title?: string\n  tooltip?: Highcharts.TooltipOptions\n  onClick?: Highcharts.SeriesClickCallbackFunction\n}\n\nexport const VennDiagram = ({ data, title, tooltip, onClick }: Props) => {\n  const { token } = theme.useToken()\n\n  const baseFont: Highcharts.CSSObject = {\n    fontSize: `${token.fontSize}px`,\n    fontFamily: token.fontFamily,\n    color: token.colorText,\n    textOutline: 'none',\n    opacity: 1,\n  }\n\n  const options: Highcharts.Options = {\n    title: {\n      text: title,\n    },\n    ...(tooltip ? { tooltip } : {}),\n    chart: {\n      spacing: [36, 36, 36, 36],\n    },\n    series: [\n      {\n        type: 'venn',\n        data,\n        events: {\n          click: onClick,\n        },\n        cursor: onClick ? 'pointer' : undefined,\n        dataLabels: {\n          style: baseFont,\n        },\n        states: {\n          inactive: {\n            opacity: 0.3,\n          },\n        },\n      },\n    ],\n  }\n\n  return (\n    <HighchartsReact\n      options={options}\n      containerProps={{ className: 'highcharts-light' }}\n    />\n  )\n}\n"],"names":["theme","jsx","HighchartsReact"],"mappings":";;;;;;;AAaO,MAAM,cAAc,CAAC,EAAE,MAAM,OAAO,SAAS,cAAqB;AACvE,QAAM,EAAE,MAAA,IAAUA,KAAAA,MAAM,SAAA;AAExB,QAAM,WAAiC;AAAA,IACrC,UAAU,GAAG,MAAM,QAAQ;AAAA,IAC3B,YAAY,MAAM;AAAA,IAClB,OAAO,MAAM;AAAA,IACb,aAAa;AAAA,IACb,SAAS;AAAA,EAAA;AAGX,QAAM,UAA8B;AAAA,IAClC,OAAO;AAAA,MACL,MAAM;AAAA,IAAA;AAAA,IAER,GAAI,UAAU,EAAE,QAAA,IAAY,CAAA;AAAA,IAC5B,OAAO;AAAA,MACL,SAAS,CAAC,IAAI,IAAI,IAAI,EAAE;AAAA,IAAA;AAAA,IAE1B,QAAQ;AAAA,MACN;AAAA,QACE,MAAM;AAAA,QACN;AAAA,QACA,QAAQ;AAAA,UACN,OAAO;AAAA,QAAA;AAAA,QAET,QAAQ,UAAU,YAAY;AAAA,QAC9B,YAAY;AAAA,UACV,OAAO;AAAA,QAAA;AAAA,QAET,QAAQ;AAAA,UACN,UAAU;AAAA,YACR,SAAS;AAAA,UAAA;AAAA,QACX;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAGF,SACEC,2BAAAA;AAAAA,IAACC,MAAAA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,gBAAgB,EAAE,WAAW,mBAAA;AAAA,IAAmB;AAAA,EAAA;AAGtD;;"}
+{"version":3,"file":"VennDiagram.cjs","sources":["../../../../src/components/vennDiagram/VennDiagram.tsx"],"sourcesContent":["import type * as Highcharts from 'highcharts'\nimport { Chart as HighchartsReact } from '@highcharts/react'\nimport '@highcharts/react/series/Venn.js'\n// `modules/`, not `options/` — see the note in BarChart.tsx. `series/` was not\n// moved and already resolves to the instance the chart uses.\nimport '@highcharts/react/modules/Accessibility.js'\nimport { theme } from 'antd'\n\ntype Props = {\n  data: Highcharts.PointOptionsObject[]\n  title?: string\n  tooltip?: Highcharts.TooltipOptions\n  onClick?: Highcharts.SeriesClickCallbackFunction\n}\n\nexport const VennDiagram = ({ data, title, tooltip, onClick }: Props) => {\n  const { token } = theme.useToken()\n\n  const baseFont: Highcharts.CSSObject = {\n    fontSize: `${token.fontSize}px`,\n    fontFamily: token.fontFamily,\n    color: token.colorText,\n    textOutline: 'none',\n    opacity: 1,\n  }\n\n  const options: Highcharts.Options = {\n    title: {\n      text: title,\n    },\n    ...(tooltip ? { tooltip } : {}),\n    chart: {\n      spacing: [36, 36, 36, 36],\n    },\n    series: [\n      {\n        type: 'venn',\n        data,\n        events: {\n          click: onClick,\n        },\n        cursor: onClick ? 'pointer' : undefined,\n        dataLabels: {\n          style: baseFont,\n        },\n        states: {\n          inactive: {\n            opacity: 0.3,\n          },\n        },\n      },\n    ],\n  }\n\n  return (\n    <HighchartsReact\n      options={options}\n      containerProps={{ className: 'highcharts-light' }}\n    />\n  )\n}\n"],"names":["theme","jsx","HighchartsReact"],"mappings":";;;;;;;AAeO,MAAM,cAAc,CAAC,EAAE,MAAM,OAAO,SAAS,cAAqB;AACvE,QAAM,EAAE,MAAA,IAAUA,KAAAA,MAAM,SAAA;AAExB,QAAM,WAAiC;AAAA,IACrC,UAAU,GAAG,MAAM,QAAQ;AAAA,IAC3B,YAAY,MAAM;AAAA,IAClB,OAAO,MAAM;AAAA,IACb,aAAa;AAAA,IACb,SAAS;AAAA,EAAA;AAGX,QAAM,UAA8B;AAAA,IAClC,OAAO;AAAA,MACL,MAAM;AAAA,IAAA;AAAA,IAER,GAAI,UAAU,EAAE,QAAA,IAAY,CAAA;AAAA,IAC5B,OAAO;AAAA,MACL,SAAS,CAAC,IAAI,IAAI,IAAI,EAAE;AAAA,IAAA;AAAA,IAE1B,QAAQ;AAAA,MACN;AAAA,QACE,MAAM;AAAA,QACN;AAAA,QACA,QAAQ;AAAA,UACN,OAAO;AAAA,QAAA;AAAA,QAET,QAAQ,UAAU,YAAY;AAAA,QAC9B,YAAY;AAAA,UACV,OAAO;AAAA,QAAA;AAAA,QAET,QAAQ;AAAA,UACN,UAAU;AAAA,YACR,SAAS;AAAA,UAAA;AAAA,QACX;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAGF,SACEC,2BAAAA;AAAAA,IAACC,MAAAA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,gBAAgB,EAAE,WAAW,mBAAA;AAAA,IAAmB;AAAA,EAAA;AAGtD;;"}

package/dist/src/components/vennDiagram/VennDiagram.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { Chart } from "@highcharts/react";
 import "@highcharts/react/series/Venn.js";
-import "@highcharts/react/options/Accessibility.js";
+import "@highcharts/react/modules/Accessibility.js";
 import { theme } from "antd";
 const VennDiagram = ({ data, title, tooltip, onClick }) => {
   const { token } = theme.useToken();

package/dist/src/components/vennDiagram/VennDiagram.js.map

@@ -1 +1 @@
-{"version":3,"file":"VennDiagram.js","sources":["../../../../src/components/vennDiagram/VennDiagram.tsx"],"sourcesContent":["import type * as Highcharts from 'highcharts'\nimport { Chart as HighchartsReact } from '@highcharts/react'\nimport '@highcharts/react/series/Venn.js'\nimport '@highcharts/react/options/Accessibility.js'\nimport { theme } from 'antd'\n\ntype Props = {\n  data: Highcharts.PointOptionsObject[]\n  title?: string\n  tooltip?: Highcharts.TooltipOptions\n  onClick?: Highcharts.SeriesClickCallbackFunction\n}\n\nexport const VennDiagram = ({ data, title, tooltip, onClick }: Props) => {\n  const { token } = theme.useToken()\n\n  const baseFont: Highcharts.CSSObject = {\n    fontSize: `${token.fontSize}px`,\n    fontFamily: token.fontFamily,\n    color: token.colorText,\n    textOutline: 'none',\n    opacity: 1,\n  }\n\n  const options: Highcharts.Options = {\n    title: {\n      text: title,\n    },\n    ...(tooltip ? { tooltip } : {}),\n    chart: {\n      spacing: [36, 36, 36, 36],\n    },\n    series: [\n      {\n        type: 'venn',\n        data,\n        events: {\n          click: onClick,\n        },\n        cursor: onClick ? 'pointer' : undefined,\n        dataLabels: {\n          style: baseFont,\n        },\n        states: {\n          inactive: {\n            opacity: 0.3,\n          },\n        },\n      },\n    ],\n  }\n\n  return (\n    <HighchartsReact\n      options={options}\n      containerProps={{ className: 'highcharts-light' }}\n    />\n  )\n}\n"],"names":["HighchartsReact"],"mappings":";;;;;AAaO,MAAM,cAAc,CAAC,EAAE,MAAM,OAAO,SAAS,cAAqB;AACvE,QAAM,EAAE,MAAA,IAAU,MAAM,SAAA;AAExB,QAAM,WAAiC;AAAA,IACrC,UAAU,GAAG,MAAM,QAAQ;AAAA,IAC3B,YAAY,MAAM;AAAA,IAClB,OAAO,MAAM;AAAA,IACb,aAAa;AAAA,IACb,SAAS;AAAA,EAAA;AAGX,QAAM,UAA8B;AAAA,IAClC,OAAO;AAAA,MACL,MAAM;AAAA,IAAA;AAAA,IAER,GAAI,UAAU,EAAE,QAAA,IAAY,CAAA;AAAA,IAC5B,OAAO;AAAA,MACL,SAAS,CAAC,IAAI,IAAI,IAAI,EAAE;AAAA,IAAA;AAAA,IAE1B,QAAQ;AAAA,MACN;AAAA,QACE,MAAM;AAAA,QACN;AAAA,QACA,QAAQ;AAAA,UACN,OAAO;AAAA,QAAA;AAAA,QAET,QAAQ,UAAU,YAAY;AAAA,QAC9B,YAAY;AAAA,UACV,OAAO;AAAA,QAAA;AAAA,QAET,QAAQ;AAAA,UACN,UAAU;AAAA,YACR,SAAS;AAAA,UAAA;AAAA,QACX;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAGF,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,gBAAgB,EAAE,WAAW,mBAAA;AAAA,IAAmB;AAAA,EAAA;AAGtD;"}
+{"version":3,"file":"VennDiagram.js","sources":["../../../../src/components/vennDiagram/VennDiagram.tsx"],"sourcesContent":["import type * as Highcharts from 'highcharts'\nimport { Chart as HighchartsReact } from '@highcharts/react'\nimport '@highcharts/react/series/Venn.js'\n// `modules/`, not `options/` — see the note in BarChart.tsx. `series/` was not\n// moved and already resolves to the instance the chart uses.\nimport '@highcharts/react/modules/Accessibility.js'\nimport { theme } from 'antd'\n\ntype Props = {\n  data: Highcharts.PointOptionsObject[]\n  title?: string\n  tooltip?: Highcharts.TooltipOptions\n  onClick?: Highcharts.SeriesClickCallbackFunction\n}\n\nexport const VennDiagram = ({ data, title, tooltip, onClick }: Props) => {\n  const { token } = theme.useToken()\n\n  const baseFont: Highcharts.CSSObject = {\n    fontSize: `${token.fontSize}px`,\n    fontFamily: token.fontFamily,\n    color: token.colorText,\n    textOutline: 'none',\n    opacity: 1,\n  }\n\n  const options: Highcharts.Options = {\n    title: {\n      text: title,\n    },\n    ...(tooltip ? { tooltip } : {}),\n    chart: {\n      spacing: [36, 36, 36, 36],\n    },\n    series: [\n      {\n        type: 'venn',\n        data,\n        events: {\n          click: onClick,\n        },\n        cursor: onClick ? 'pointer' : undefined,\n        dataLabels: {\n          style: baseFont,\n        },\n        states: {\n          inactive: {\n            opacity: 0.3,\n          },\n        },\n      },\n    ],\n  }\n\n  return (\n    <HighchartsReact\n      options={options}\n      containerProps={{ className: 'highcharts-light' }}\n    />\n  )\n}\n"],"names":["HighchartsReact"],"mappings":";;;;;AAeO,MAAM,cAAc,CAAC,EAAE,MAAM,OAAO,SAAS,cAAqB;AACvE,QAAM,EAAE,MAAA,IAAU,MAAM,SAAA;AAExB,QAAM,WAAiC;AAAA,IACrC,UAAU,GAAG,MAAM,QAAQ;AAAA,IAC3B,YAAY,MAAM;AAAA,IAClB,OAAO,MAAM;AAAA,IACb,aAAa;AAAA,IACb,SAAS;AAAA,EAAA;AAGX,QAAM,UAA8B;AAAA,IAClC,OAAO;AAAA,MACL,MAAM;AAAA,IAAA;AAAA,IAER,GAAI,UAAU,EAAE,QAAA,IAAY,CAAA;AAAA,IAC5B,OAAO;AAAA,MACL,SAAS,CAAC,IAAI,IAAI,IAAI,EAAE;AAAA,IAAA;AAAA,IAE1B,QAAQ;AAAA,MACN;AAAA,QACE,MAAM;AAAA,QACN;AAAA,QACA,QAAQ;AAAA,UACN,OAAO;AAAA,QAAA;AAAA,QAET,QAAQ,UAAU,YAAY;AAAA,QAC9B,YAAY;AAAA,UACV,OAAO;AAAA,QAAA;AAAA,QAET,QAAQ;AAAA,UACN,UAAU;AAAA,YACR,SAAS;AAAA,UAAA;AAAA,QACX;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAGF,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,gBAAgB,EAAE,WAAW,mBAAA;AAAA,IAAmB;AAAA,EAAA;AAGtD;"}

package/dist/src/index.d.ts

@@ -8,6 +8,6 @@ declare module '*.svg?react' {
   // vite-plugin-svgr's ?react suffix returns the component as the default
   // export. This was previously typed as `string`, which forced callers to
   // suppress a type error at every use site.
-  // eslint-disable-next-line import/no-default-export
+  // eslint-disable-next-line no-restricted-exports
   export default ReactComponent
 }

package/dist/tailwind.cjs

@@ -149,6 +149,10 @@ const tailwindPreset = {
         "j2-xs": [
           "var(--j2-font-size-xs)",
           { lineHeight: "var(--j2-line-height-xs)" }
+        ],
+        "j2-lg": [
+          "var(--j2-font-size-lg)",
+          { lineHeight: "var(--j2-line-height-lg)" }
         ]
       },
       spacing: {

package/dist/tailwind.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"tailwind.cjs","sources":["../tailwind.config.ts"],"sourcesContent":["import type { Config } from 'tailwindcss'\n\n// Export as a preset for consuming apps\nexport const tailwindPreset = {\n  theme: {\n    colors: {\n      // Inlined rather than read from `tailwindcss/colors`: the root export\n      // re-exports this preset, so a runtime import here lands in\n      // dist/index.js and makes tailwindcss — which consumers install as a\n      // devDependency — a runtime dependency of every component import.\n      transparent: 'transparent',\n      current: 'currentColor',\n      white: '#fff',\n      black: '#000',\n      j2: {\n        // Generic color definitions\n        'blue-1': 'var(--j2-blue-1)',\n        'blue-2': 'var(--j2-blue-2)',\n        'blue-3': 'var(--j2-blue-3)',\n        'blue-4': 'var(--j2-blue-4)',\n        'blue-5': 'var(--j2-blue-5)',\n        'blue-6': 'var(--j2-blue-6)',\n        'blue-7': 'var(--j2-blue-7)',\n        'blue-8': 'var(--j2-blue-8)',\n        'blue-9': 'var(--j2-blue-9)',\n        'blue-10': 'var(--j2-blue-10)',\n        'blue-11': 'var(--j2-blue-11)',\n        'blue-12': 'var(--j2-blue-12)',\n        'gray-1': 'var(--j2-gray-1)',\n        'gray-2': 'var(--j2-gray-2)',\n        'gray-3': 'var(--j2-gray-3)',\n        'gray-4': 'var(--j2-gray-4)',\n        'gray-5': 'var(--j2-gray-5)',\n        'gray-6': 'var(--j2-gray-6)',\n        'gray-7': 'var(--j2-gray-7)',\n        'gray-8': 'var(--j2-gray-8)',\n        'gray-9': 'var(--j2-gray-9)',\n        'gray-10': 'var(--j2-gray-10)',\n        'gray-11': 'var(--j2-gray-11)',\n        'gray-12': 'var(--j2-gray-12)',\n        'green-1': 'var(--j2-green-1)',\n        'green-2': 'var(--j2-green-2)',\n        'green-3': 'var(--j2-green-3)',\n        'green-4': 'var(--j2-green-4)',\n        'green-5': 'var(--j2-green-5)',\n        'green-6': 'var(--j2-green-6)',\n        'green-7': 'var(--j2-green-7)',\n        'green-8': 'var(--j2-green-8)',\n        'green-9': 'var(--j2-green-9)',\n        'green-10': 'var(--j2-green-10)',\n        'green-11': 'var(--j2-green-11)',\n        'green-12': 'var(--j2-green-12)',\n        'gold-1': 'var(--j2-gold-1)',\n        'gold-2': 'var(--j2-gold-2)',\n        'gold-3': 'var(--j2-gold-3)',\n        'gold-4': 'var(--j2-gold-4)',\n        'gold-5': 'var(--j2-gold-5)',\n        'gold-6': 'var(--j2-gold-6)',\n        'gold-7': 'var(--j2-gold-7)',\n        'gold-8': 'var(--j2-gold-8)',\n        'gold-9': 'var(--j2-gold-9)',\n        'gold-10': 'var(--j2-gold-10)',\n        'gold-11': 'var(--j2-gold-11)',\n        'gold-12': 'var(--j2-gold-12)',\n        'red-1': 'var(--j2-red-1)',\n        'red-2': 'var(--j2-red-2)',\n        'red-3': 'var(--j2-red-3)',\n        'red-4': 'var(--j2-red-4)',\n        'red-5': 'var(--j2-red-5)',\n        'red-6': 'var(--j2-red-6)',\n        'red-7': 'var(--j2-red-7)',\n        'red-8': 'var(--j2-red-8)',\n        'red-9': 'var(--j2-red-9)',\n        'red-10': 'var(--j2-red-10)',\n        'red-11': 'var(--j2-red-11)',\n        'red-12': 'var(--j2-red-12)',\n\n        // Primary color tokens\n        primary: 'var(--j2-color-primary)',\n        'primary-hover': 'var(--j2-color-primary-hover)',\n        'primary-active': 'var(--j2-color-primary-active)',\n        'primary-bg': 'var(--j2-color-primary-bg)',\n        'primary-bg-hover': 'var(--j2-color-primary-bg-hover)',\n        'primary-border': 'var(--j2-color-primary-border)',\n        'primary-border-hover': 'var(--j2-color-primary-border-hover)',\n        'primary-text': 'var(--j2-color-primary-text)',\n        'primary-text-hover': 'var(--j2-color-primary-text-hover)',\n        'primary-text-active': 'var(--j2-color-primary-text-active)',\n\n        // Text color tokens\n        text: 'var(--j2-color-text)',\n        'text-secondary': 'var(--j2-color-text-secondary)',\n        'text-tertiary': 'var(--j2-color-text-tertiary)',\n        'text-quaternary': 'var(--j2-color-text-quaternary)',\n        'text-heading': 'var(--j2-color-text-heading)',\n        'text-label': 'var(--j2-color-text-label)',\n        'text-description': 'var(--j2-color-text-description)',\n        'text-disabled': 'var(--j2-color-text-disabled)',\n        'text-placeholder': 'var(--j2-color-text-placeholder)',\n\n        // Border color tokens\n        border: 'var(--j2-color-border)',\n        'border-secondary': 'var(--j2-color-border-secondary)',\n\n        // Background color tokens\n        'bg-layout': 'var(--j2-color-bg-layout)',\n        'bg-elevated': 'var(--j2-color-bg-elevated)',\n        'bg-mask': 'var(--j2-color-bg-mask)',\n        'bg-spotlight': 'var(--j2-color-bg-spotlight)',\n\n        // Status colors\n        success: 'var(--j2-color-success)',\n        'success-bg': 'var(--j2-color-success-bg)',\n        'success-bg-hover': 'var(--j2-color-success-bg-hover)',\n        'success-border': 'var(--j2-color-success-border)',\n        warning: 'var(--j2-color-warning)',\n        'warning-bg': 'var(--j2-color-warning-bg)',\n        'warning-bg-hover': 'var(--j2-color-warning-bg-hover)',\n        'warning-border': 'var(--j2-color-warning-border)',\n        error: 'var(--j2-color-error)',\n        'error-bg': 'var(--j2-color-error-bg)',\n        'error-bg-hover': 'var(--j2-color-error-bg-hover)',\n        'error-border': 'var(--j2-color-error-border)',\n        info: 'var(--j2-color-info)',\n        'info-bg': 'var(--j2-color-info-bg)',\n        'info-bg-hover': 'var(--j2-color-info-bg-hover)',\n        'info-border': 'var(--j2-color-info-border)',\n\n        // Icon colors\n        icon: 'var(--j2-color-icon)',\n        'icon-hover': 'var(--j2-color-icon-hover)',\n      },\n    },\n    extend: {\n      borderColor: {\n        DEFAULT: 'var(--j2-color-border)',\n      },\n      fontWeight: {\n        normal: '400',\n        medium: '500',\n        semibold: '600',\n        bold: '600',\n      },\n      borderWidth: {\n        j2: 'var(--j2-line-width)',\n        'j2-bold': 'var(--j2-line-width-bold)',\n        'j2-focus': 'var(--j2-line-width-focus)',\n      },\n      borderRadius: {\n        j2: 'var(--j2-border-radius)',\n        'j2-lg': 'var(--j2-border-radius-lg)',\n        'j2-sm': 'var(--j2-border-radius-sm)',\n        'j2-xs': 'var(--j2-border-radius-xs)',\n      },\n      fontSize: {\n        'j2-xs': [\n          'var(--j2-font-size-xs)',\n          { lineHeight: 'var(--j2-line-height-xs)' },\n        ] as [string, { lineHeight: string }],\n      },\n      spacing: {\n        j2: 'var(--j2-size)',\n        'j2-xs': 'var(--j2-size-xs)',\n        'j2-sm': 'var(--j2-size-sm)',\n        'j2-md': 'var(--j2-size-md)',\n        'j2-lg': 'var(--j2-size-lg)',\n        'j2-xl': 'var(--j2-size-xl)',\n        'j2-xxl': 'var(--j2-size-xxl)',\n      },\n    },\n  },\n}\n\n// Default export for this project's own Tailwind config\nexport default {\n  ...tailwindPreset,\n  content: ['./src/**/*.{ts,tsx,mdx}'],\n  plugins: [],\n} satisfies Config\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"tailwind.cjs","sources":["../tailwind.config.ts"],"sourcesContent":["import type { Config } from 'tailwindcss'\n\n// Export as a preset for consuming apps\nexport const tailwindPreset = {\n  theme: {\n    colors: {\n      // Inlined rather than read from `tailwindcss/colors`: the root export\n      // re-exports this preset, so a runtime import here lands in\n      // dist/index.js and makes tailwindcss — which consumers install as a\n      // devDependency — a runtime dependency of every component import.\n      transparent: 'transparent',\n      current: 'currentColor',\n      white: '#fff',\n      black: '#000',\n      j2: {\n        // Generic color definitions\n        'blue-1': 'var(--j2-blue-1)',\n        'blue-2': 'var(--j2-blue-2)',\n        'blue-3': 'var(--j2-blue-3)',\n        'blue-4': 'var(--j2-blue-4)',\n        'blue-5': 'var(--j2-blue-5)',\n        'blue-6': 'var(--j2-blue-6)',\n        'blue-7': 'var(--j2-blue-7)',\n        'blue-8': 'var(--j2-blue-8)',\n        'blue-9': 'var(--j2-blue-9)',\n        'blue-10': 'var(--j2-blue-10)',\n        'blue-11': 'var(--j2-blue-11)',\n        'blue-12': 'var(--j2-blue-12)',\n        'gray-1': 'var(--j2-gray-1)',\n        'gray-2': 'var(--j2-gray-2)',\n        'gray-3': 'var(--j2-gray-3)',\n        'gray-4': 'var(--j2-gray-4)',\n        'gray-5': 'var(--j2-gray-5)',\n        'gray-6': 'var(--j2-gray-6)',\n        'gray-7': 'var(--j2-gray-7)',\n        'gray-8': 'var(--j2-gray-8)',\n        'gray-9': 'var(--j2-gray-9)',\n        'gray-10': 'var(--j2-gray-10)',\n        'gray-11': 'var(--j2-gray-11)',\n        'gray-12': 'var(--j2-gray-12)',\n        'green-1': 'var(--j2-green-1)',\n        'green-2': 'var(--j2-green-2)',\n        'green-3': 'var(--j2-green-3)',\n        'green-4': 'var(--j2-green-4)',\n        'green-5': 'var(--j2-green-5)',\n        'green-6': 'var(--j2-green-6)',\n        'green-7': 'var(--j2-green-7)',\n        'green-8': 'var(--j2-green-8)',\n        'green-9': 'var(--j2-green-9)',\n        'green-10': 'var(--j2-green-10)',\n        'green-11': 'var(--j2-green-11)',\n        'green-12': 'var(--j2-green-12)',\n        'gold-1': 'var(--j2-gold-1)',\n        'gold-2': 'var(--j2-gold-2)',\n        'gold-3': 'var(--j2-gold-3)',\n        'gold-4': 'var(--j2-gold-4)',\n        'gold-5': 'var(--j2-gold-5)',\n        'gold-6': 'var(--j2-gold-6)',\n        'gold-7': 'var(--j2-gold-7)',\n        'gold-8': 'var(--j2-gold-8)',\n        'gold-9': 'var(--j2-gold-9)',\n        'gold-10': 'var(--j2-gold-10)',\n        'gold-11': 'var(--j2-gold-11)',\n        'gold-12': 'var(--j2-gold-12)',\n        'red-1': 'var(--j2-red-1)',\n        'red-2': 'var(--j2-red-2)',\n        'red-3': 'var(--j2-red-3)',\n        'red-4': 'var(--j2-red-4)',\n        'red-5': 'var(--j2-red-5)',\n        'red-6': 'var(--j2-red-6)',\n        'red-7': 'var(--j2-red-7)',\n        'red-8': 'var(--j2-red-8)',\n        'red-9': 'var(--j2-red-9)',\n        'red-10': 'var(--j2-red-10)',\n        'red-11': 'var(--j2-red-11)',\n        'red-12': 'var(--j2-red-12)',\n\n        // Primary color tokens\n        primary: 'var(--j2-color-primary)',\n        'primary-hover': 'var(--j2-color-primary-hover)',\n        'primary-active': 'var(--j2-color-primary-active)',\n        'primary-bg': 'var(--j2-color-primary-bg)',\n        'primary-bg-hover': 'var(--j2-color-primary-bg-hover)',\n        'primary-border': 'var(--j2-color-primary-border)',\n        'primary-border-hover': 'var(--j2-color-primary-border-hover)',\n        'primary-text': 'var(--j2-color-primary-text)',\n        'primary-text-hover': 'var(--j2-color-primary-text-hover)',\n        'primary-text-active': 'var(--j2-color-primary-text-active)',\n\n        // Text color tokens\n        text: 'var(--j2-color-text)',\n        'text-secondary': 'var(--j2-color-text-secondary)',\n        'text-tertiary': 'var(--j2-color-text-tertiary)',\n        'text-quaternary': 'var(--j2-color-text-quaternary)',\n        'text-heading': 'var(--j2-color-text-heading)',\n        'text-label': 'var(--j2-color-text-label)',\n        'text-description': 'var(--j2-color-text-description)',\n        'text-disabled': 'var(--j2-color-text-disabled)',\n        'text-placeholder': 'var(--j2-color-text-placeholder)',\n\n        // Border color tokens\n        border: 'var(--j2-color-border)',\n        'border-secondary': 'var(--j2-color-border-secondary)',\n\n        // Background color tokens\n        'bg-layout': 'var(--j2-color-bg-layout)',\n        'bg-elevated': 'var(--j2-color-bg-elevated)',\n        'bg-mask': 'var(--j2-color-bg-mask)',\n        'bg-spotlight': 'var(--j2-color-bg-spotlight)',\n\n        // Status colors\n        success: 'var(--j2-color-success)',\n        'success-bg': 'var(--j2-color-success-bg)',\n        'success-bg-hover': 'var(--j2-color-success-bg-hover)',\n        'success-border': 'var(--j2-color-success-border)',\n        warning: 'var(--j2-color-warning)',\n        'warning-bg': 'var(--j2-color-warning-bg)',\n        'warning-bg-hover': 'var(--j2-color-warning-bg-hover)',\n        'warning-border': 'var(--j2-color-warning-border)',\n        error: 'var(--j2-color-error)',\n        'error-bg': 'var(--j2-color-error-bg)',\n        'error-bg-hover': 'var(--j2-color-error-bg-hover)',\n        'error-border': 'var(--j2-color-error-border)',\n        info: 'var(--j2-color-info)',\n        'info-bg': 'var(--j2-color-info-bg)',\n        'info-bg-hover': 'var(--j2-color-info-bg-hover)',\n        'info-border': 'var(--j2-color-info-border)',\n\n        // Icon colors\n        icon: 'var(--j2-color-icon)',\n        'icon-hover': 'var(--j2-color-icon-hover)',\n      },\n    },\n    extend: {\n      borderColor: {\n        DEFAULT: 'var(--j2-color-border)',\n      },\n      fontWeight: {\n        normal: '400',\n        medium: '500',\n        semibold: '600',\n        bold: '600',\n      },\n      borderWidth: {\n        j2: 'var(--j2-line-width)',\n        'j2-bold': 'var(--j2-line-width-bold)',\n        'j2-focus': 'var(--j2-line-width-focus)',\n      },\n      borderRadius: {\n        j2: 'var(--j2-border-radius)',\n        'j2-lg': 'var(--j2-border-radius-lg)',\n        'j2-sm': 'var(--j2-border-radius-sm)',\n        'j2-xs': 'var(--j2-border-radius-xs)',\n      },\n      fontSize: {\n        'j2-xs': [\n          'var(--j2-font-size-xs)',\n          { lineHeight: 'var(--j2-line-height-xs)' },\n        ] as [string, { lineHeight: string }],\n        'j2-lg': [\n          'var(--j2-font-size-lg)',\n          { lineHeight: 'var(--j2-line-height-lg)' },\n        ] as [string, { lineHeight: string }],\n      },\n      spacing: {\n        j2: 'var(--j2-size)',\n        'j2-xs': 'var(--j2-size-xs)',\n        'j2-sm': 'var(--j2-size-sm)',\n        'j2-md': 'var(--j2-size-md)',\n        'j2-lg': 'var(--j2-size-lg)',\n        'j2-xl': 'var(--j2-size-xl)',\n        'j2-xxl': 'var(--j2-size-xxl)',\n      },\n    },\n  },\n}\n\n// Default export for this project's own Tailwind config\nexport default {\n  ...tailwindPreset,\n  content: ['./src/**/*.{ts,tsx,mdx}'],\n  plugins: [],\n} satisfies Config\n"],"names":[],"mappings":"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"}

package/dist/tailwind.config.d.ts

@@ -136,6 +136,9 @@ export declare const tailwindPreset: {
                 'j2-xs': [string, {
                     lineHeight: string;
                 }];
+                'j2-lg': [string, {
+                    lineHeight: string;
+                }];
             };
             spacing: {
                 j2: string;
@@ -289,6 +292,9 @@ declare const _default: {
                 'j2-xs': [string, {
                     lineHeight: string;
                 }];
+                'j2-lg': [string, {
+                    lineHeight: string;
+                }];
             };
             spacing: {
                 j2: string;

package/dist/tailwind.js

@@ -147,6 +147,10 @@ const tailwindPreset = {
         "j2-xs": [
           "var(--j2-font-size-xs)",
           { lineHeight: "var(--j2-line-height-xs)" }
+        ],
+        "j2-lg": [
+          "var(--j2-font-size-lg)",
+          { lineHeight: "var(--j2-line-height-lg)" }
         ]
       },
       spacing: {

package/dist/tailwind.js.map

@@ -1 +1 @@
-{"version":3,"file":"tailwind.js","sources":["../tailwind.config.ts"],"sourcesContent":["import type { Config } from 'tailwindcss'\n\n// Export as a preset for consuming apps\nexport const tailwindPreset = {\n  theme: {\n    colors: {\n      // Inlined rather than read from `tailwindcss/colors`: the root export\n      // re-exports this preset, so a runtime import here lands in\n      // dist/index.js and makes tailwindcss — which consumers install as a\n      // devDependency — a runtime dependency of every component import.\n      transparent: 'transparent',\n      current: 'currentColor',\n      white: '#fff',\n      black: '#000',\n      j2: {\n        // Generic color definitions\n        'blue-1': 'var(--j2-blue-1)',\n        'blue-2': 'var(--j2-blue-2)',\n        'blue-3': 'var(--j2-blue-3)',\n        'blue-4': 'var(--j2-blue-4)',\n        'blue-5': 'var(--j2-blue-5)',\n        'blue-6': 'var(--j2-blue-6)',\n        'blue-7': 'var(--j2-blue-7)',\n        'blue-8': 'var(--j2-blue-8)',\n        'blue-9': 'var(--j2-blue-9)',\n        'blue-10': 'var(--j2-blue-10)',\n        'blue-11': 'var(--j2-blue-11)',\n        'blue-12': 'var(--j2-blue-12)',\n        'gray-1': 'var(--j2-gray-1)',\n        'gray-2': 'var(--j2-gray-2)',\n        'gray-3': 'var(--j2-gray-3)',\n        'gray-4': 'var(--j2-gray-4)',\n        'gray-5': 'var(--j2-gray-5)',\n        'gray-6': 'var(--j2-gray-6)',\n        'gray-7': 'var(--j2-gray-7)',\n        'gray-8': 'var(--j2-gray-8)',\n        'gray-9': 'var(--j2-gray-9)',\n        'gray-10': 'var(--j2-gray-10)',\n        'gray-11': 'var(--j2-gray-11)',\n        'gray-12': 'var(--j2-gray-12)',\n        'green-1': 'var(--j2-green-1)',\n        'green-2': 'var(--j2-green-2)',\n        'green-3': 'var(--j2-green-3)',\n        'green-4': 'var(--j2-green-4)',\n        'green-5': 'var(--j2-green-5)',\n        'green-6': 'var(--j2-green-6)',\n        'green-7': 'var(--j2-green-7)',\n        'green-8': 'var(--j2-green-8)',\n        'green-9': 'var(--j2-green-9)',\n        'green-10': 'var(--j2-green-10)',\n        'green-11': 'var(--j2-green-11)',\n        'green-12': 'var(--j2-green-12)',\n        'gold-1': 'var(--j2-gold-1)',\n        'gold-2': 'var(--j2-gold-2)',\n        'gold-3': 'var(--j2-gold-3)',\n        'gold-4': 'var(--j2-gold-4)',\n        'gold-5': 'var(--j2-gold-5)',\n        'gold-6': 'var(--j2-gold-6)',\n        'gold-7': 'var(--j2-gold-7)',\n        'gold-8': 'var(--j2-gold-8)',\n        'gold-9': 'var(--j2-gold-9)',\n        'gold-10': 'var(--j2-gold-10)',\n        'gold-11': 'var(--j2-gold-11)',\n        'gold-12': 'var(--j2-gold-12)',\n        'red-1': 'var(--j2-red-1)',\n        'red-2': 'var(--j2-red-2)',\n        'red-3': 'var(--j2-red-3)',\n        'red-4': 'var(--j2-red-4)',\n        'red-5': 'var(--j2-red-5)',\n        'red-6': 'var(--j2-red-6)',\n        'red-7': 'var(--j2-red-7)',\n        'red-8': 'var(--j2-red-8)',\n        'red-9': 'var(--j2-red-9)',\n        'red-10': 'var(--j2-red-10)',\n        'red-11': 'var(--j2-red-11)',\n        'red-12': 'var(--j2-red-12)',\n\n        // Primary color tokens\n        primary: 'var(--j2-color-primary)',\n        'primary-hover': 'var(--j2-color-primary-hover)',\n        'primary-active': 'var(--j2-color-primary-active)',\n        'primary-bg': 'var(--j2-color-primary-bg)',\n        'primary-bg-hover': 'var(--j2-color-primary-bg-hover)',\n        'primary-border': 'var(--j2-color-primary-border)',\n        'primary-border-hover': 'var(--j2-color-primary-border-hover)',\n        'primary-text': 'var(--j2-color-primary-text)',\n        'primary-text-hover': 'var(--j2-color-primary-text-hover)',\n        'primary-text-active': 'var(--j2-color-primary-text-active)',\n\n        // Text color tokens\n        text: 'var(--j2-color-text)',\n        'text-secondary': 'var(--j2-color-text-secondary)',\n        'text-tertiary': 'var(--j2-color-text-tertiary)',\n        'text-quaternary': 'var(--j2-color-text-quaternary)',\n        'text-heading': 'var(--j2-color-text-heading)',\n        'text-label': 'var(--j2-color-text-label)',\n        'text-description': 'var(--j2-color-text-description)',\n        'text-disabled': 'var(--j2-color-text-disabled)',\n        'text-placeholder': 'var(--j2-color-text-placeholder)',\n\n        // Border color tokens\n        border: 'var(--j2-color-border)',\n        'border-secondary': 'var(--j2-color-border-secondary)',\n\n        // Background color tokens\n        'bg-layout': 'var(--j2-color-bg-layout)',\n        'bg-elevated': 'var(--j2-color-bg-elevated)',\n        'bg-mask': 'var(--j2-color-bg-mask)',\n        'bg-spotlight': 'var(--j2-color-bg-spotlight)',\n\n        // Status colors\n        success: 'var(--j2-color-success)',\n        'success-bg': 'var(--j2-color-success-bg)',\n        'success-bg-hover': 'var(--j2-color-success-bg-hover)',\n        'success-border': 'var(--j2-color-success-border)',\n        warning: 'var(--j2-color-warning)',\n        'warning-bg': 'var(--j2-color-warning-bg)',\n        'warning-bg-hover': 'var(--j2-color-warning-bg-hover)',\n        'warning-border': 'var(--j2-color-warning-border)',\n        error: 'var(--j2-color-error)',\n        'error-bg': 'var(--j2-color-error-bg)',\n        'error-bg-hover': 'var(--j2-color-error-bg-hover)',\n        'error-border': 'var(--j2-color-error-border)',\n        info: 'var(--j2-color-info)',\n        'info-bg': 'var(--j2-color-info-bg)',\n        'info-bg-hover': 'var(--j2-color-info-bg-hover)',\n        'info-border': 'var(--j2-color-info-border)',\n\n        // Icon colors\n        icon: 'var(--j2-color-icon)',\n        'icon-hover': 'var(--j2-color-icon-hover)',\n      },\n    },\n    extend: {\n      borderColor: {\n        DEFAULT: 'var(--j2-color-border)',\n      },\n      fontWeight: {\n        normal: '400',\n        medium: '500',\n        semibold: '600',\n        bold: '600',\n      },\n      borderWidth: {\n        j2: 'var(--j2-line-width)',\n        'j2-bold': 'var(--j2-line-width-bold)',\n        'j2-focus': 'var(--j2-line-width-focus)',\n      },\n      borderRadius: {\n        j2: 'var(--j2-border-radius)',\n        'j2-lg': 'var(--j2-border-radius-lg)',\n        'j2-sm': 'var(--j2-border-radius-sm)',\n        'j2-xs': 'var(--j2-border-radius-xs)',\n      },\n      fontSize: {\n        'j2-xs': [\n          'var(--j2-font-size-xs)',\n          { lineHeight: 'var(--j2-line-height-xs)' },\n        ] as [string, { lineHeight: string }],\n      },\n      spacing: {\n        j2: 'var(--j2-size)',\n        'j2-xs': 'var(--j2-size-xs)',\n        'j2-sm': 'var(--j2-size-sm)',\n        'j2-md': 'var(--j2-size-md)',\n        'j2-lg': 'var(--j2-size-lg)',\n        'j2-xl': 'var(--j2-size-xl)',\n        'j2-xxl': 'var(--j2-size-xxl)',\n      },\n    },\n  },\n}\n\n// Default export for this project's own Tailwind config\nexport default {\n  ...tailwindPreset,\n  content: ['./src/**/*.{ts,tsx,mdx}'],\n  plugins: [],\n} satisfies Config\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"tailwind.js","sources":["../tailwind.config.ts"],"sourcesContent":["import type { Config } from 'tailwindcss'\n\n// Export as a preset for consuming apps\nexport const tailwindPreset = {\n  theme: {\n    colors: {\n      // Inlined rather than read from `tailwindcss/colors`: the root export\n      // re-exports this preset, so a runtime import here lands in\n      // dist/index.js and makes tailwindcss — which consumers install as a\n      // devDependency — a runtime dependency of every component import.\n      transparent: 'transparent',\n      current: 'currentColor',\n      white: '#fff',\n      black: '#000',\n      j2: {\n        // Generic color definitions\n        'blue-1': 'var(--j2-blue-1)',\n        'blue-2': 'var(--j2-blue-2)',\n        'blue-3': 'var(--j2-blue-3)',\n        'blue-4': 'var(--j2-blue-4)',\n        'blue-5': 'var(--j2-blue-5)',\n        'blue-6': 'var(--j2-blue-6)',\n        'blue-7': 'var(--j2-blue-7)',\n        'blue-8': 'var(--j2-blue-8)',\n        'blue-9': 'var(--j2-blue-9)',\n        'blue-10': 'var(--j2-blue-10)',\n        'blue-11': 'var(--j2-blue-11)',\n        'blue-12': 'var(--j2-blue-12)',\n        'gray-1': 'var(--j2-gray-1)',\n        'gray-2': 'var(--j2-gray-2)',\n        'gray-3': 'var(--j2-gray-3)',\n        'gray-4': 'var(--j2-gray-4)',\n        'gray-5': 'var(--j2-gray-5)',\n        'gray-6': 'var(--j2-gray-6)',\n        'gray-7': 'var(--j2-gray-7)',\n        'gray-8': 'var(--j2-gray-8)',\n        'gray-9': 'var(--j2-gray-9)',\n        'gray-10': 'var(--j2-gray-10)',\n        'gray-11': 'var(--j2-gray-11)',\n        'gray-12': 'var(--j2-gray-12)',\n        'green-1': 'var(--j2-green-1)',\n        'green-2': 'var(--j2-green-2)',\n        'green-3': 'var(--j2-green-3)',\n        'green-4': 'var(--j2-green-4)',\n        'green-5': 'var(--j2-green-5)',\n        'green-6': 'var(--j2-green-6)',\n        'green-7': 'var(--j2-green-7)',\n        'green-8': 'var(--j2-green-8)',\n        'green-9': 'var(--j2-green-9)',\n        'green-10': 'var(--j2-green-10)',\n        'green-11': 'var(--j2-green-11)',\n        'green-12': 'var(--j2-green-12)',\n        'gold-1': 'var(--j2-gold-1)',\n        'gold-2': 'var(--j2-gold-2)',\n        'gold-3': 'var(--j2-gold-3)',\n        'gold-4': 'var(--j2-gold-4)',\n        'gold-5': 'var(--j2-gold-5)',\n        'gold-6': 'var(--j2-gold-6)',\n        'gold-7': 'var(--j2-gold-7)',\n        'gold-8': 'var(--j2-gold-8)',\n        'gold-9': 'var(--j2-gold-9)',\n        'gold-10': 'var(--j2-gold-10)',\n        'gold-11': 'var(--j2-gold-11)',\n        'gold-12': 'var(--j2-gold-12)',\n        'red-1': 'var(--j2-red-1)',\n        'red-2': 'var(--j2-red-2)',\n        'red-3': 'var(--j2-red-3)',\n        'red-4': 'var(--j2-red-4)',\n        'red-5': 'var(--j2-red-5)',\n        'red-6': 'var(--j2-red-6)',\n        'red-7': 'var(--j2-red-7)',\n        'red-8': 'var(--j2-red-8)',\n        'red-9': 'var(--j2-red-9)',\n        'red-10': 'var(--j2-red-10)',\n        'red-11': 'var(--j2-red-11)',\n        'red-12': 'var(--j2-red-12)',\n\n        // Primary color tokens\n        primary: 'var(--j2-color-primary)',\n        'primary-hover': 'var(--j2-color-primary-hover)',\n        'primary-active': 'var(--j2-color-primary-active)',\n        'primary-bg': 'var(--j2-color-primary-bg)',\n        'primary-bg-hover': 'var(--j2-color-primary-bg-hover)',\n        'primary-border': 'var(--j2-color-primary-border)',\n        'primary-border-hover': 'var(--j2-color-primary-border-hover)',\n        'primary-text': 'var(--j2-color-primary-text)',\n        'primary-text-hover': 'var(--j2-color-primary-text-hover)',\n        'primary-text-active': 'var(--j2-color-primary-text-active)',\n\n        // Text color tokens\n        text: 'var(--j2-color-text)',\n        'text-secondary': 'var(--j2-color-text-secondary)',\n        'text-tertiary': 'var(--j2-color-text-tertiary)',\n        'text-quaternary': 'var(--j2-color-text-quaternary)',\n        'text-heading': 'var(--j2-color-text-heading)',\n        'text-label': 'var(--j2-color-text-label)',\n        'text-description': 'var(--j2-color-text-description)',\n        'text-disabled': 'var(--j2-color-text-disabled)',\n        'text-placeholder': 'var(--j2-color-text-placeholder)',\n\n        // Border color tokens\n        border: 'var(--j2-color-border)',\n        'border-secondary': 'var(--j2-color-border-secondary)',\n\n        // Background color tokens\n        'bg-layout': 'var(--j2-color-bg-layout)',\n        'bg-elevated': 'var(--j2-color-bg-elevated)',\n        'bg-mask': 'var(--j2-color-bg-mask)',\n        'bg-spotlight': 'var(--j2-color-bg-spotlight)',\n\n        // Status colors\n        success: 'var(--j2-color-success)',\n        'success-bg': 'var(--j2-color-success-bg)',\n        'success-bg-hover': 'var(--j2-color-success-bg-hover)',\n        'success-border': 'var(--j2-color-success-border)',\n        warning: 'var(--j2-color-warning)',\n        'warning-bg': 'var(--j2-color-warning-bg)',\n        'warning-bg-hover': 'var(--j2-color-warning-bg-hover)',\n        'warning-border': 'var(--j2-color-warning-border)',\n        error: 'var(--j2-color-error)',\n        'error-bg': 'var(--j2-color-error-bg)',\n        'error-bg-hover': 'var(--j2-color-error-bg-hover)',\n        'error-border': 'var(--j2-color-error-border)',\n        info: 'var(--j2-color-info)',\n        'info-bg': 'var(--j2-color-info-bg)',\n        'info-bg-hover': 'var(--j2-color-info-bg-hover)',\n        'info-border': 'var(--j2-color-info-border)',\n\n        // Icon colors\n        icon: 'var(--j2-color-icon)',\n        'icon-hover': 'var(--j2-color-icon-hover)',\n      },\n    },\n    extend: {\n      borderColor: {\n        DEFAULT: 'var(--j2-color-border)',\n      },\n      fontWeight: {\n        normal: '400',\n        medium: '500',\n        semibold: '600',\n        bold: '600',\n      },\n      borderWidth: {\n        j2: 'var(--j2-line-width)',\n        'j2-bold': 'var(--j2-line-width-bold)',\n        'j2-focus': 'var(--j2-line-width-focus)',\n      },\n      borderRadius: {\n        j2: 'var(--j2-border-radius)',\n        'j2-lg': 'var(--j2-border-radius-lg)',\n        'j2-sm': 'var(--j2-border-radius-sm)',\n        'j2-xs': 'var(--j2-border-radius-xs)',\n      },\n      fontSize: {\n        'j2-xs': [\n          'var(--j2-font-size-xs)',\n          { lineHeight: 'var(--j2-line-height-xs)' },\n        ] as [string, { lineHeight: string }],\n        'j2-lg': [\n          'var(--j2-font-size-lg)',\n          { lineHeight: 'var(--j2-line-height-lg)' },\n        ] as [string, { lineHeight: string }],\n      },\n      spacing: {\n        j2: 'var(--j2-size)',\n        'j2-xs': 'var(--j2-size-xs)',\n        'j2-sm': 'var(--j2-size-sm)',\n        'j2-md': 'var(--j2-size-md)',\n        'j2-lg': 'var(--j2-size-lg)',\n        'j2-xl': 'var(--j2-size-xl)',\n        'j2-xxl': 'var(--j2-size-xxl)',\n      },\n    },\n  },\n}\n\n// Default export for this project's own Tailwind config\nexport default {\n  ...tailwindPreset,\n  content: ['./src/**/*.{ts,tsx,mdx}'],\n  plugins: [],\n} satisfies Config\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@j2-health/design-system",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "type": "module",
   "description": "J2 Health shared React component library",
   "repository": {
@@ -24,6 +24,7 @@
     },
     "./style.css": "./dist/style.css",
     "./stylesheets/index.css": "./src/stylesheets/index.css",
+    "./stylesheets/tailwind.css": "./src/stylesheets/tailwind.css",
     "./package.json": "./package.json"
   },
   "files": [
@@ -47,33 +48,41 @@
     "start": "storybook dev -p 6006",
     "build-storybook": "storybook build",
     "test": "NODE_OPTIONS='--no-deprecation' vitest run",
+    "test:tailwind": "node scripts/test-tailwind-consumers.mjs",
     "test:dev": "NODE_OPTIONS='--no-deprecation' vitest",
     "test:coverage": "NODE_OPTIONS='--no-deprecation' vitest run --coverage",
     "type-check": "tsc --noEmit"
   },
   "peerDependencies": {
     "@ant-design/icons": "^6.3.4",
-    "@highcharts/react": "^4.2.1",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "@highcharts/react": "^5.0.0",
     "@phosphor-icons/react": "^2.1.7",
     "antd": "^6.6.3",
     "classnames": "^2.5.1",
     "formik": "^2.4.6",
-    "highcharts": "^12.5.0 || ^13.0.1",
+    "highcharts": "^13.0.1",
     "lodash": "^4.17.0",
     "react": "^18.3.1 || ^19.0.0",
     "react-dom": "^18.3.1 || ^19.0.0",
-    "tailwindcss": "^3.4.14"
+    "tailwindcss": "^3.4.14 || ^4.0.0"
   },
   "devDependencies": {
     "@ant-design/icons": "^6.3.4",
     "@chromatic-com/storybook": "^5.3.0",
-    "@eslint/js": "^9.11.1",
-    "@highcharts/react": "^4.2.1",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "@eslint/compat": "^2.1.1",
+    "@eslint/js": "^10.0.1",
+    "@highcharts/react": "^5.3.0",
     "@phosphor-icons/react": "^2.1.7",
     "@storybook/addon-docs": "^10.5.9",
     "@storybook/addon-links": "^10.3.0",
-    "@storybook/addon-onboarding": "^10.3.0",
     "@storybook/react-vite": "^10.3.0",
+    "@tailwindcss/postcss": "^4.3.3",
     "@testing-library/jest-dom": "^7.0.1",
     "@testing-library/react": "^16.3.3",
     "@types/lodash": "^4.17.14",
@@ -84,13 +93,12 @@
     "antd": "^6.6.3",
     "autoprefixer": "^10.4.20",
     "classnames": "^2.5.1",
-    "eslint": "^9.39.0",
+    "eslint": "^10.11.0",
     "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-react": "^7.37.2",
-    "eslint-plugin-react-hooks": "^5.1.0-rc.0",
-    "eslint-plugin-react-refresh": "^0.4.14",
-    "eslint-plugin-storybook": "^10.5.10",
+    "eslint-plugin-react-hooks": "^7.1.1",
+    "eslint-plugin-react-refresh": "^0.5.7",
+    "eslint-plugin-storybook": "^10.6.0",
     "formik": "^2.4.6",
     "globals": "^15.9.0",
     "happy-dom": "^20.9.0",
@@ -100,8 +108,9 @@
     "prettier": "^3.3.3",
     "react": "^19.2.8",
     "react-dom": "^19.2.8",
-    "storybook": "^10.3.5",
-    "tailwindcss": "^3.4.14",
+    "semver": "^7.8.5",
+    "storybook": "^10.6.0",
+    "tailwindcss": "^4.3.3",
     "ts-node": "^10.9.2",
     "typescript": "^5.5.3",
     "typescript-eslint": "^8.15.0",
@@ -118,5 +127,10 @@
     "extends": [
       "plugin:storybook/recommended"
     ]
+  },
+  "overrides": {
+    "eslint-plugin-react": {
+      "eslint": "$eslint"
+    }
   }
 }