@manakind/manuia-ui 0.14.0 → 0.15.0

package/dist/action-item/action-item.css

@@ -0,0 +1,124 @@
+@layer components {
+  .mui-action-item {
+    /*
+     * The row lays out by its own width, as FocusItem does, so a list in a
+     * narrow column collapses the same way a list on a phone does.
+     */
+    container: mui-action-item / inline-size;
+    display: grid;
+    grid-template-columns: minmax(0, 1fr);
+    gap: var(--semantic-space-gap-tight);
+    overflow-wrap: anywhere;
+
+    & .mui-action-item__card {
+      --ds-card-padding: var(--semantic-space-padding);
+      --ds-card-title-font-size: var(--primitives-font-size-md);
+      --ds-card-title-font-weight: var(--primitives-font-weight-medium);
+    }
+
+    /* A selected row carries a second border in the strong primary, as a chosen card does. */
+    &.mui-action-item--selected .mui-action-item__card {
+      --ds-card-border: var(--semantic-color-action-primary-strong);
+      box-shadow: 0 0 0 1px var(--semantic-color-action-primary-strong);
+    }
+
+    /*
+     * Toggle, main, controls, checkbox, in a flex row rather than a grid: the
+     * toggle, controls and checkbox are each optional, and an absent flex
+     * item leaves no track and no gap behind. The controls are capped so a
+     * long label in them wraps in its share instead of squeezing the title.
+     */
+    & .mui-action-item__row {
+      display: flex;
+      align-items: start;
+      gap: var(--semantic-space-gap) var(--semantic-space-gap-relaxed);
+    }
+
+    & .mui-action-item__main {
+      display: flex;
+      flex: 1 1 0;
+      flex-direction: column;
+      gap: var(--semantic-space-gap-tight);
+      min-width: 0;
+    }
+
+    &.mui-action-item--completed .mui-action-item__title {
+      --ds-card-text: var(--ds-card-text-muted);
+      text-decoration: line-through;
+    }
+
+    & .mui-action-item__details {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      gap: var(--semantic-space-gap-tight) var(--semantic-space-gap-relaxed);
+      margin: 0;
+      color: var(--semantic-color-text-muted);
+      font-size: var(--primitives-font-size-xs);
+    }
+
+    & .mui-action-item__detail {
+      display: inline-flex;
+      flex-wrap: wrap;
+      align-items: center;
+      gap: var(--semantic-space-gap-tight);
+    }
+
+    & .mui-action-item__secondary {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      gap: var(--semantic-space-gap);
+    }
+
+    & .mui-action-item__controls {
+      display: flex;
+      flex: 0 1 auto;
+      flex-wrap: wrap;
+      align-items: center;
+      justify-content: flex-end;
+      gap: var(--semantic-space-gap);
+      max-width: 40%;
+    }
+
+    /*
+     * Narrow: the row wraps. The toggle, the title and the checkbox keep the
+     * first line; the details, categories, second line and controls each
+     * take a full line below, in the order the main column held them.
+     */
+    @container mui-action-item (max-width: 36rem) {
+      & .mui-action-item__row {
+        flex-wrap: wrap;
+        row-gap: var(--semantic-space-gap-tight);
+      }
+
+      & .mui-action-item__main {
+        display: contents;
+      }
+
+      & .mui-action-item__title {
+        flex: 1 1 0;
+        align-self: center;
+        min-width: 0;
+      }
+
+      /* Ordered after the checkbox, which the DOM puts last, so the checkbox wraps onto the title's line. */
+      & .mui-action-item__details,
+      & .mui-action-item__categories,
+      & .mui-action-item__secondary,
+      & .mui-action-item__controls {
+        flex: 0 0 100%;
+        order: 1;
+        max-width: none;
+      }
+
+      & .mui-action-item__controls {
+        justify-content: flex-start;
+      }
+
+      & .mui-action-item__select {
+        align-self: center;
+      }
+    }
+  }
+}

package/dist/action-item/action-item.css.d.ts

@@ -0,0 +1,2 @@
+/* AUTOGENERATED: types for the stylesheet beside it. */
+export {};

package/dist/action-item/action-item.d.ts

@@ -0,0 +1,88 @@
+import { type BadgeVariant, type IconSource } from '@manakind/ui-core';
+import type { ComponentProps, ReactNode } from 'react';
+import { type GoalCategory } from '../goal-categories';
+import './action-item.css';
+/** One fact about the action, shown after the title: its project, outcome, effort, duration. */
+export interface ActionItemDetail {
+    /** Pre-formatted text, such as "Website relaunch" or "30 min". */
+    label: string;
+    /** Glyph before the text, supplied by the product. */
+    icon?: IconSource;
+}
+/** How the note reads: an aside, or a warning the user should act on. The two Badge variants it maps to. */
+export type ActionItemNoteTone = Extract<BadgeVariant, 'muted' | 'warning'>;
+export interface ActionItemProps extends Omit<ComponentProps<'li'>, 'title' | 'children' | 'className'> {
+    /** The action's description. Rendered as the row's heading. */
+    title: string;
+    /** Whether the action is done. Strikes the title and presses the completion toggle. */
+    completed: boolean;
+    /**
+     * Called with the new state when the completion toggle is pressed. Without
+     * it, or without `completeIcon`, the row has no toggle and the struck
+     * title alone says the action is done.
+     */
+    onCompletedChange?: (completed: boolean) => void;
+    /** Glyph on the completion toggle, supplied by the product. */
+    completeIcon?: IconSource;
+    /** Facts shown after the title, each with an optional glyph. */
+    details?: ActionItemDetail[];
+    /** Categories the action belongs to, as dotted text. */
+    categories?: GoalCategory[];
+    /** How many categories to show before collapsing into `+N more`. Defaults to 2, as on `GoalListItem`. */
+    maxVisibleCategories?: number;
+    /**
+     * A short pre-formatted status beside the details: the days it was done,
+     * or how long it has waited unscheduled. `noteTone` says how it reads.
+     */
+    note?: string;
+    /** `muted` (default) for an aside; `warning` for a note the user should act on, such as a stale action. */
+    noteTone?: ActionItemNoteTone;
+    /**
+     * Whether the row is selected for a bulk change. With `onSelectedChange`
+     * the row carries a checkbox named "Select …" and, when selected, a ring;
+     * without the handler neither is shown.
+     */
+    selected?: boolean;
+    /** Called with the new state when the selection checkbox changes. Without it the row has no checkbox. */
+    onSelectedChange?: (selected: boolean) => void;
+    /**
+     * The product's controls that act on this row, placed at its end: a focus
+     * toggle, an edit button. They render as given; the row only places them.
+     */
+    controls?: ReactNode;
+    /**
+     * The product's second line under the details: the control that
+     * schedules the action, a delete button for a stale one. Rendered as given.
+     */
+    secondary?: ReactNode;
+    /** Heading level for the title. Defaults to `h3`; match the surrounding outline. */
+    titleAs?: 'h2' | 'h3' | 'h4';
+    /** Extra class names on the `<li>`. */
+    className?: string;
+    /**
+     * A message about this action, shown under the row inside the same `<li>`:
+     * an `Alert` after a failed change, say. Kept in the item so the list's
+     * item count stays the number of actions.
+     */
+    children?: ReactNode;
+}
+/**
+ * One Manuia action as a row. Render it inside an `ActionList`: it is the
+ * `<li>`.
+ *
+ * The row leads with a round completion toggle, then the title over its
+ * details, categories and the product's second line, then the product's
+ * controls and, when the list allows a bulk change, a selection checkbox.
+ * The toggle is a pressed/unpressed button named "Complete …" in both
+ * states, so a screen reader hears the state change rather than a different
+ * control; it has no pending state, for `FocusItem`'s reason, so the product
+ * keeps its change idempotent.
+ *
+ * Wide, the row reads left to right. Narrow, the toggle, the title and the
+ * checkbox share the first line; the details, categories, second line and
+ * controls take the full width below. Attributes other than the props land
+ * on the `<li>`: a virtualised list gives each row `aria-setsize` and
+ * `aria-posinset`, so the count a screen reader hears is the whole list's.
+ */
+export declare function ActionItem({ title, completed, onCompletedChange, completeIcon, details, categories, maxVisibleCategories, note, noteTone, selected, onSelectedChange, controls, secondary, titleAs, className, children, ...listItemProps }: ActionItemProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=action-item.d.ts.map

package/dist/action-item/action-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-item.d.ts","sourceRoot":"","sources":["../../src/action-item/action-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,YAAY,EAOjB,KAAK,UAAU,EAChB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAkB,KAAK,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACvE,OAAO,mBAAmB,CAAC;AAE3B,gGAAgG;AAChG,MAAM,WAAW,gBAAgB;IAC/B,kEAAkE;IAClE,KAAK,EAAE,MAAM,CAAC;IACd,sDAAsD;IACtD,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB;AAED,4GAA4G;AAC5G,MAAM,MAAM,kBAAkB,GAAG,OAAO,CAAC,YAAY,EAAE,OAAO,GAAG,SAAS,CAAC,CAAC;AAE5E,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,WAAW,CAAC;IACtE,+DAA+D;IAC/D,KAAK,EAAE,MAAM,CAAC;IACd,uFAAuF;IACvF,SAAS,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACjD,+DAA+D;IAC/D,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B,gEAAgE;IAChE,OAAO,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC7B,wDAAwD;IACxD,UAAU,CAAC,EAAE,YAAY,EAAE,CAAC;IAC5B,yGAAyG;IACzG,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,2GAA2G;IAC3G,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,yGAAyG;IACzG,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAC/C;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,oFAAoF;IACpF,OAAO,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC7B,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,SAAS,EACT,iBAAiB,EACjB,YAAY,EACZ,OAAY,EACZ,UAAe,EACf,oBAAwB,EACxB,IAAI,EACJ,QAAkB,EAClB,QAAgB,EAChB,gBAAgB,EAChB,QAAQ,EACR,SAAS,EACT,OAAc,EACd,SAAS,EACT,QAAQ,EACR,GAAG,aAAa,EACjB,EAAE,eAAe,2CAmFjB"}

package/dist/action-item/action-item.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge, Card, CardTitle, Checkbox, cx, Icon, IconButton, } from '@manakind/ui-core';
+import { GoalCategories } from '../goal-categories';
+import './action-item.css';
+/**
+ * One Manuia action as a row. Render it inside an `ActionList`: it is the
+ * `<li>`.
+ *
+ * The row leads with a round completion toggle, then the title over its
+ * details, categories and the product's second line, then the product's
+ * controls and, when the list allows a bulk change, a selection checkbox.
+ * The toggle is a pressed/unpressed button named "Complete …" in both
+ * states, so a screen reader hears the state change rather than a different
+ * control; it has no pending state, for `FocusItem`'s reason, so the product
+ * keeps its change idempotent.
+ *
+ * Wide, the row reads left to right. Narrow, the toggle, the title and the
+ * checkbox share the first line; the details, categories, second line and
+ * controls take the full width below. Attributes other than the props land
+ * on the `<li>`: a virtualised list gives each row `aria-setsize` and
+ * `aria-posinset`, so the count a screen reader hears is the whole list's.
+ */
+export function ActionItem({ title, completed, onCompletedChange, completeIcon, details = [], categories = [], maxVisibleCategories = 2, note, noteTone = 'muted', selected = false, onSelectedChange, controls, secondary, titleAs = 'h3', className, children, ...listItemProps }) {
+    const selectable = onSelectedChange !== undefined;
+    const toggle = completeIcon && onCompletedChange ? (_jsx(IconButton, { className: "mui-action-item__complete", variant: completed ? 'primary' : 'secondary', size: "md", icon: completeIcon, "aria-pressed": completed, "aria-label": `Complete ${title}`, onClick: () => onCompletedChange(!completed) })) : null;
+    /*
+     * A detail's key is its label and its rank among equal labels: a project
+     * and an outcome may share a name, and a key that only held the label
+     * would collide.
+     */
+    const seen = new Map();
+    const detailRows = details.map((detail) => {
+        const rank = seen.get(detail.label) ?? 0;
+        seen.set(detail.label, rank + 1);
+        return (_jsxs("span", { className: "mui-action-item__detail", children: [detail.icon && _jsx(Icon, { source: detail.icon, size: "sm", decorative: true }), detail.label] }, `${detail.label}-${rank}`));
+    });
+    const detailList = details.length > 0 || note ? (_jsxs("p", { className: "mui-action-item__details", children: [detailRows, note && (_jsx(Badge, { variant: noteTone, className: "mui-action-item__note", children: note }))] })) : null;
+    return (_jsxs("li", { ...listItemProps, className: cx('mui-action-item', completed && 'mui-action-item--completed', selectable && selected && 'mui-action-item--selected', className), children: [_jsx(Card, { className: "mui-action-item__card", children: _jsxs("div", { className: "mui-action-item__row", children: [toggle, _jsxs("div", { className: "mui-action-item__main", children: [_jsx(CardTitle, { as: titleAs, className: "mui-action-item__title", children: title }), detailList, _jsx(GoalCategories, { className: "mui-action-item__categories", categories: categories, maxVisible: maxVisibleCategories }), secondary && _jsx("div", { className: "mui-action-item__secondary", children: secondary })] }), controls && _jsx("div", { className: "mui-action-item__controls", children: controls }), selectable && (_jsx(Checkbox, { className: "mui-action-item__select", "aria-label": `Select ${title}`, checked: selected, onCheckedChange: onSelectedChange }))] }) }), children] }));
+}
+//# sourceMappingURL=action-item.js.map

package/dist/action-item/action-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-item.js","sourceRoot":"","sources":["../../src/action-item/action-item.tsx"],"names":[],"mappings":"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"}

package/dist/action-item/index.d.ts

@@ -0,0 +1,3 @@
+export type { ActionItemDetail, ActionItemNoteTone, ActionItemProps } from './action-item';
+export { ActionItem } from './action-item';
+//# sourceMappingURL=index.d.ts.map

package/dist/action-item/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/action-item/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAC3F,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/action-item/index.js

@@ -0,0 +1,2 @@
+export { ActionItem } from './action-item';
+//# sourceMappingURL=index.js.map

package/dist/action-item/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/action-item/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/action-list/action-list.css

@@ -0,0 +1,10 @@
+@layer components {
+  .mui-action-list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--semantic-space-gap);
+    margin: 0;
+    padding: 0;
+    list-style: none;
+  }
+}

package/dist/action-list/action-list.css.d.ts

@@ -0,0 +1,2 @@
+/* AUTOGENERATED: types for the stylesheet beside it. */
+export {};

package/dist/action-list/action-list.d.ts

@@ -0,0 +1,19 @@
+import type { ComponentProps } from 'react';
+import './action-list.css';
+export interface ActionListProps extends ComponentProps<'ul'> {
+    /** `ActionItem`s. Each renders its own `<li>`. */
+    children?: ComponentProps<'ul'>['children'];
+}
+/**
+ * A `<ul>` of `ActionItem` rows: the actions of a day, a block or a project.
+ *
+ * A real list, so a screen reader announces how many items there are. Name it
+ * with `aria-label` or `aria-labelledby` when the heading above it doesn't
+ * already say what it lists. Loading and empty states belong to the product,
+ * outside the list: an empty `<ul>` is a list of none. A list that renders
+ * only a window of its rows gives each `ActionItem` `aria-setsize` and
+ * `aria-posinset`, and keeps its spacers as padding on the `<ul>`, so the
+ * count stays the whole list's and no spacer becomes an item.
+ */
+export declare function ActionList({ className, children, ...props }: ActionListProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=action-list.d.ts.map

package/dist/action-list/action-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-list.d.ts","sourceRoot":"","sources":["../../src/action-list/action-list.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,mBAAmB,CAAC;AAE3B,MAAM,WAAW,eAAgB,SAAQ,cAAc,CAAC,IAAI,CAAC;IAC3D,kDAAkD;IAClD,QAAQ,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,CAAC,UAAU,CAAC,CAAC;CAC7C;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAM5E"}

package/dist/action-list/action-list.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cx } from '@manakind/ui-core';
+import './action-list.css';
+/**
+ * A `<ul>` of `ActionItem` rows: the actions of a day, a block or a project.
+ *
+ * A real list, so a screen reader announces how many items there are. Name it
+ * with `aria-label` or `aria-labelledby` when the heading above it doesn't
+ * already say what it lists. Loading and empty states belong to the product,
+ * outside the list: an empty `<ul>` is a list of none. A list that renders
+ * only a window of its rows gives each `ActionItem` `aria-setsize` and
+ * `aria-posinset`, and keeps its spacers as padding on the `<ul>`, so the
+ * count stays the whole list's and no spacer becomes an item.
+ */
+export function ActionList({ className, children, ...props }) {
+    return (_jsx("ul", { className: cx('mui-action-list', className), ...props, children: children }));
+}
+//# sourceMappingURL=action-list.js.map

package/dist/action-list/action-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-list.js","sourceRoot":"","sources":["../../src/action-list/action-list.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAC;AAEvC,OAAO,mBAAmB,CAAC;AAO3B;;;;;;;;;;GAUG;AACH,MAAM,UAAU,UAAU,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAmB;IAC3E,OAAO,CACL,aAAI,SAAS,EAAE,EAAE,CAAC,iBAAiB,EAAE,SAAS,CAAC,KAAM,KAAK,YACvD,QAAQ,GACN,CACN,CAAC;AACJ,CAAC"}

package/dist/action-list/index.d.ts

@@ -0,0 +1,3 @@
+export type { ActionListProps } from './action-list';
+export { ActionList } from './action-list';
+//# sourceMappingURL=index.d.ts.map

package/dist/action-list/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/action-list/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/action-list/index.js

@@ -0,0 +1,2 @@
+export { ActionList } from './action-list';
+//# sourceMappingURL=index.js.map

package/dist/action-list/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/action-list/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/index.d.ts

@@ -9,6 +9,8 @@
  * `.storybook/preview.ts` for the canonical setup.
  */
 export * from '@manakind/ui-core';
+export * from './action-item';
+export * from './action-list';
 export * from './category-card';
 export * from './focus-item';
 export * from './focus-list';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC;AAClC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}

package/dist/index.js

@@ -9,6 +9,8 @@
  * `.storybook/preview.ts` for the canonical setup.
  */
 export * from '@manakind/ui-core';
+export * from './action-item';
+export * from './action-list';
 export * from './category-card';
 export * from './focus-item';
 export * from './focus-list';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AACH,cAAc,mBAAmB,CAAC;AAClC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@manakind/manuia-ui",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "type": "module",
   "license": "MIT",
   "repository": {