@rinzai/zen 0.13.0 → 0.15.0

package/dist/docs/toggle-group.md

@@ -0,0 +1,83 @@
+# Toggle Group
+
+Buttons that stay pressed, in a row: any number of them, like filters, or at most one. One stop in the tab order; the arrow keys go through them.
+
+```tsx
+import { ToggleGroup, ToggleGroupItem } from '@rinzai/zen';
+```
+
+## Examples
+
+### Default
+
+```tsx
+import { ToggleGroup, ToggleGroupItem } from '@rinzai/zen';
+import { useState } from 'react';
+
+/** Filters: any number on at once. */
+export default function Default() {
+    const [kinds, setKinds] = useState<readonly string[]>(['expense', 'income']);
+    return (
+        <div className="flex flex-col items-center gap-3">
+            <ToggleGroup multiple aria-label="Show" value={kinds} onValueChange={setKinds}>
+                <ToggleGroupItem value="expense">Expenses</ToggleGroupItem>
+                <ToggleGroupItem value="income">Income</ToggleGroupItem>
+                <ToggleGroupItem value="transfer">Transfers</ToggleGroupItem>
+            </ToggleGroup>
+            <p className="text-muted-foreground mt-0! text-sm">
+                {kinds.length ? `Showing ${kinds.length} of 3 kinds` : 'Showing everything'}
+            </p>
+        </div>
+    );
+}
+```
+
+### Single
+
+```tsx
+import { ToggleGroup, ToggleGroupItem } from '@rinzai/zen';
+// Icons from Heroicons (https://heroicons.com): ChartBar (chart-bar), ListBullet (list-bullet), Squares (squares-2x2).
+
+/** At most one: pressing the pressed one releases it. Icon-only items carry an aria-label. */
+export default function Single() {
+    return (
+        <ToggleGroup aria-label="Group by" defaultValue="list">
+            <ToggleGroupItem value="list" aria-label="As a list" className="px-2">
+                <ListBullet className="size-4" />
+            </ToggleGroupItem>
+            <ToggleGroupItem value="cards" aria-label="As cards" className="px-2">
+                <Squares className="size-4" />
+            </ToggleGroupItem>
+            <ToggleGroupItem value="chart" aria-label="As a chart" className="px-2">
+                <ChartBar className="size-4" />
+            </ToggleGroupItem>
+        </ToggleGroup>
+    );
+}
+```
+
+## API reference
+
+### ToggleGroup
+
+Buttons that stay pressed, in a row: any number of them (`multiple`, e.g.
+filters), or at most one, which can be released again. For exactly one
+always chosen, use Segmented. ←→ move between them, Home and End jump to
+the ends; Space or Enter presses.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `children` | `ReactNode` |  | The ToggleGroupItems. |
+| `defaultValue` | `string \| readonly string[] \| null` |  |  |
+| `multiple` | `boolean` |  | At most one pressed (the default); pressing another releases it. Any number pressed. |
+| `name` | `string` |  | Form field name: each pressed item's value is submitted under it. |
+| `onValueChange` | `((value: string \| null) => void) \| ((value: readonly string[]) => void)` |  |  |
+| `value` | `string \| readonly string[] \| null` |  | The pressed item's value, or null for none, when you keep it. |
+
+### ToggleGroupItem
+
+One button of a ToggleGroup: text, an icon (give it an aria-label), or both.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `value` (required) | `string` |  |  |

package/dist/docs/toggle.md

@@ -0,0 +1,38 @@
+# Toggle
+
+An on/off switch.
+
+```tsx
+import { Toggle } from '@rinzai/zen';
+```
+
+## Examples
+
+### Default
+
+```tsx
+import { Toggle } from '@rinzai/zen';
+import { useState } from 'react';
+
+export default function Default() {
+    const [on, setOn] = useState(true);
+    return (
+        <label className="flex w-64 items-center justify-between">
+            Repeats every month
+            <Toggle checked={on} onCheckedChange={setOn} />
+        </label>
+    );
+}
+```
+
+## API reference
+
+### Toggle
+
+On/off switch. A native checkbox with the switch role underneath, so forms
+and screen readers work as they do for any checkbox. Space and Enter both
+flip it (Enter doesn't submit a surrounding form), as for a switch button.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `onCheckedChange` | `((checked: boolean) => void)` |  |  |

package/dist/docs/toolbar.md

@@ -0,0 +1,97 @@
+# Toolbar
+
+A row of controls for one thing, like a table’s: one stop for Tab, and the arrow keys through its buttons, toggles and fields.
+
+```tsx
+import { Toolbar, ToolbarSeparator } from '@rinzai/zen';
+```
+
+## Examples
+
+### Default
+
+```tsx
+import { Button, Toolbar, ToolbarSeparator, ToggleGroup, ToggleGroupItem } from '@rinzai/zen';
+// Icons from Heroicons (https://heroicons.com): ChartBar (chart-bar), ListBullet (list-bullet), Settings (cog-6-tooth), Table (table-cells).
+
+/** A table's controls: one stop for Tab, and ←→ through them all, the toggle group's items too. */
+export default function Default() {
+    return (
+        <Toolbar aria-label="Entries">
+            <ToggleGroup aria-label="View" defaultValue="table">
+                <ToggleGroupItem value="table" aria-label="Table" className="px-2">
+                    <Table className="size-4" />
+                </ToggleGroupItem>
+                <ToggleGroupItem value="list" aria-label="List" className="px-2">
+                    <ListBullet className="size-4" />
+                </ToggleGroupItem>
+                <ToggleGroupItem value="chart" aria-label="Chart" className="px-2">
+                    <ChartBar className="size-4" />
+                </ToggleGroupItem>
+            </ToggleGroup>
+            <ToolbarSeparator />
+            <Button variant="ghost" size="sm">
+                Filter
+            </Button>
+            <Button variant="ghost" size="sm">
+                Sort
+            </Button>
+            <ToolbarSeparator />
+            <Button variant="ghost" size="icon-sm" aria-label="Table settings">
+                <Settings className="size-4" />
+            </Button>
+        </Toolbar>
+    );
+}
+```
+
+### Vertical
+
+```tsx
+import { Button, Toolbar, ToolbarSeparator, ToggleGroup, ToggleGroupItem } from '@rinzai/zen';
+// Icons from Heroicons (https://heroicons.com): ChartBar (chart-bar), MinusMicro (minus), PlusMicro (plus), Squares (squares-2x2).
+
+/** Upright beside what it controls, e.g. a chart: ↑↓ move through it, and its toggle group stacks too. */
+export default function Vertical() {
+    return (
+        <Toolbar aria-label="Chart" orientation="vertical">
+            <Button variant="ghost" size="icon-sm" aria-label="Zoom in">
+                <PlusMicro />
+            </Button>
+            <Button variant="ghost" size="icon-sm" aria-label="Zoom out">
+                <MinusMicro />
+            </Button>
+            <ToolbarSeparator />
+            <ToggleGroup aria-label="Chart type" defaultValue="bars">
+                <ToggleGroupItem value="bars" aria-label="Bars" className="px-2">
+                    <ChartBar className="size-4" />
+                </ToggleGroupItem>
+                <ToggleGroupItem value="tiles" aria-label="Tiles" className="px-2">
+                    <Squares className="size-4" />
+                </ToggleGroupItem>
+            </ToggleGroup>
+        </Toolbar>
+    );
+}
+```
+
+## API reference
+
+### Toolbar
+
+A row of controls for one thing, e.g. a table's or an editor's: buttons,
+ToggleGroups, Selects, a search field. Tab enters it once; ←→ (↑↓ when
+`orientation="vertical"`) move between its controls, Home and End jump to
+the ends. Divide it with ToolbarSeparator. Give it an aria-label.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `orientation` | `"horizontal" \| "vertical"` | `horizontal` |  |
+
+### ToolbarSeparator
+
+A hairline between groups of a Toolbar's controls, across its direction.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `decorative` | `boolean` |  | Only visual: hidden from screen readers. |

package/dist/docs/tooltip.md

@@ -0,0 +1,60 @@
+# Tooltip
+
+A short glass hint on hover or keyboard focus, describing its trigger to screen readers.
+
+```tsx
+import { Tooltip, TooltipTrigger, TooltipContent } from '@rinzai/zen';
+```
+
+## Examples
+
+### Default
+
+```tsx
+import { Badge, Tooltip, TooltipContent, TooltipTrigger } from '@rinzai/zen';
+
+/** Shows on hover and on keyboard focus; the trigger is described by it for screen readers. */
+export default function Default() {
+    return (
+        <Tooltip>
+            <TooltipTrigger className="rounded-md">
+                <Badge variant="secondary">Beta</Badge>
+            </TooltipTrigger>
+            <TooltipContent>
+                <div className="p-3 text-sm">
+                    <p className="font-medium">Beta feature</p>
+                    <p className="text-muted-foreground mt-0.5!">This feature is still in preview and may change.</p>
+                </div>
+            </TooltipContent>
+        </Tooltip>
+    );
+}
+```
+
+## API reference
+
+### Tooltip
+
+A short hint shown while the pointer is over its trigger or the trigger has
+keyboard focus; Escape hides it. The trigger is described by it for screen
+readers. Put a TooltipTrigger and a TooltipContent inside. For anything to
+click or fill in, use Popover.
+
+No props of its own; it accepts the props of the element it renders.
+
+### TooltipTrigger
+
+What the tooltip describes: a button by default. With `asChild`, your own focusable element instead.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `asChild` | `boolean` |  | Put the trigger's props on your own focusable element instead of rendering a button. |
+
+### TooltipContent
+
+The hint: glass, below the trigger (above it if there's no room), centred on it by default.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `align` | `"center" \| "end" \| "start"` | `center` | Centred on the trigger (default), or lined up with its start or end edge. |
+| `offset` | `number` | `5` | Gap from the trigger, in px. |

package/dist/docs/tree.md

@@ -0,0 +1,295 @@
+# Tree Table
+
+Rows that open into child rows, animated, built from useTree and the Table parts. With virtual rows and editable cells, enough for a budget planner.
+
+```tsx
+import { TreeRow, TreeCell, TreeLabel, TreeToggle } from '@rinzai/zen';
+```
+
+## Examples
+
+### Basic
+
+```tsx
+import {
+    Table,
+    TableBody,
+    TableContainer,
+    TableHead,
+    TableHeader,
+    TableRow,
+    TreeCell,
+    TreeLabel,
+    TreeRow,
+    useTree,
+} from '@rinzai/zen';
+
+interface Node {
+    name: string;
+    size: string;
+    children?: Node[];
+}
+
+const FILES: Node[] = [
+    {
+        name: 'packages',
+        size: '412 kB',
+        children: [
+            {
+                name: 'button',
+                size: '6 kB',
+                children: [
+                    { name: 'index.tsx', size: '2 kB' },
+                    { name: 'index.test.tsx', size: '4 kB' },
+                ],
+            },
+            { name: 'table', size: '14 kB', children: [{ name: 'index.tsx', size: '9 kB' }] },
+        ],
+    },
+    { name: 'docs', size: '88 kB', children: [{ name: 'app', size: '80 kB' }] },
+    { name: 'package.json', size: '3 kB' },
+];
+
+/** Nested data in, visible rows out: useTree handles opening, closing and the animation. Start collapsed with defaultExpanded={false}. */
+export default function Basic() {
+    const tree = useTree({ items: FILES, getKey: (n) => n.name + n.size, getChildren: (n) => n.children });
+    return (
+        <TableContainer className="w-full max-w-md">
+            <Table {...tree.tableProps}>
+                <TableHeader>
+                    <TableRow>
+                        <TableHead>Name</TableHead>
+                        <TableHead numeric>Size</TableHead>
+                    </TableRow>
+                </TableHeader>
+                <TableBody>
+                    {tree.rows.map((row) => (
+                        <TreeRow key={row.key} row={row} tree={tree}>
+                            <TreeCell className={row.hasChildren ? 'font-medium' : undefined}>
+                                <TreeLabel row={row} tree={tree}>
+                                    {row.item.name}
+                                </TreeLabel>
+                            </TreeCell>
+                            <TreeCell numeric className="text-muted-foreground">
+                                {row.item.size}
+                            </TreeCell>
+                        </TreeRow>
+                    ))}
+                </TableBody>
+            </Table>
+        </TableContainer>
+    );
+}
+```
+
+### Planner
+
+```tsx
+import {
+    EditableCell,
+    formatMoney,
+    MoneyInput,
+    Table,
+    TableBody,
+    TableContainer,
+    TableFooter,
+    TableFooterCell,
+    TableHead,
+    TableHeader,
+    TableRow,
+    TableSpacerRow,
+    TreeCell,
+    TreeLabel,
+    TreeRow,
+    useTree,
+    useVirtualList,
+} from '@rinzai/zen';
+import { useRef, useState } from 'react';
+
+const MONTHS = ['Oct', 'Nov', 'Dec', 'Jan', 'Feb', 'Mar'];
+const ROW_HEIGHT = 36;
+
+interface Line {
+    key: string;
+    label: string;
+    /** Amount per month, in paise; groups add up their items. */
+    amounts?: number[];
+    items?: Line[];
+}
+
+const item = (label: string, rupees: number[]): Line => ({
+    key: label.toLowerCase().replace(/\W+/g, '-'),
+    label,
+    amounts: rupees.map((r) => r * 100),
+});
+
+const PLAN: Line[] = [
+    {
+        key: 'home',
+        label: 'Home',
+        items: [
+            item('Rent', [18500, 18500, 18500, 18500, 18500, 18500]),
+            item('Electricity', [1400, 1250, 1600, 1900, 1700, 1300]),
+            item('Internet', [799, 799, 799, 799, 799, 799]),
+        ],
+    },
+    {
+        key: 'food',
+        label: 'Food',
+        items: [
+            item('Groceries', [9000, 9500, 12000, 9000, 9000, 9500]),
+            item('Dining out', [3000, 2500, 6000, 2000, 2500, 3000]),
+        ],
+    },
+    {
+        key: 'transport',
+        label: 'Transport',
+        items: [
+            item('Metro card', [1200, 1200, 1200, 1200, 1200, 1200]),
+            item('Cabs', [1500, 1800, 2500, 1500, 1200, 1600]),
+        ],
+    },
+];
+
+const total = (line: Line, month: number): number =>
+    line.items ? line.items.reduce((sum, i) => sum + total(i, month), 0) : (line.amounts?.[month] ?? 0);
+
+/**
+ * A budget grid like a planner: categories open into items, months run across,
+ * and the header, first column and totals stay put while it scrolls either way.
+ * Click an amount to change it. Rows are virtualized, so long plans stay fast.
+ */
+export default function Planner() {
+    const [plan, setPlan] = useState(PLAN);
+    const tree = useTree({ items: plan, getKey: (l) => l.key, getChildren: (l) => l.items, rowHeight: ROW_HEIGHT });
+    const scrollRef = useRef<HTMLDivElement>(null);
+    const rows = useVirtualList({ count: tree.rows.length, itemHeight: ROW_HEIGHT, scrollRef, overscan: 12 });
+    const inr = (paise: number) => formatMoney(paise, 'INR', 'en-IN', { showDecimals: false });
+
+    const setAmount = (key: string, month: number, paise: number | null) =>
+        setPlan((p) =>
+            p.map((group) => ({
+                ...group,
+                items: group.items?.map((i) =>
+                    i.key === key ? { ...i, amounts: i.amounts!.map((a, m) => (m === month ? (paise ?? 0) : a)) } : i,
+                ),
+            })),
+        );
+
+    return (
+        <TableContainer ref={scrollRef} label="Budget plan" className="max-h-80 w-full">
+            <Table {...tree.tableProps} className="w-max min-w-full">
+                <TableHeader>
+                    <TableRow>
+                        <TableHead sticky="start" className="min-w-44">
+                            Budget
+                        </TableHead>
+                        {MONTHS.map((m) => (
+                            <TableHead key={m} numeric className="min-w-28">
+                                {m}
+                            </TableHead>
+                        ))}
+                    </TableRow>
+                </TableHeader>
+                <TableBody>
+                    <TableSpacerRow height={rows.paddingTop} colSpan={MONTHS.length + 1} />
+                    {rows.items.map(({ index }) => {
+                        const row = tree.rows[index];
+                        const line = row.item;
+                        return (
+                            <TreeRow key={row.key} row={row} tree={tree}>
+                                <TreeCell sticky="start" className={row.hasChildren ? 'font-medium' : undefined}>
+                                    <TreeLabel row={row} tree={tree}>
+                                        <span className="truncate">{line.label}</span>
+                                    </TreeLabel>
+                                </TreeCell>
+                                {MONTHS.map((month, m) => (
+                                    <TreeCell key={month} numeric>
+                                        {row.hasChildren ? (
+                                            <span className="text-muted-foreground px-1.5">{inr(total(line, m))}</span>
+                                        ) : (
+                                            <EditableCell
+                                                label={`${line.label}, ${month}: ${inr(total(line, m))}`}
+                                                editor={(close) => (
+                                                    <MoneyInput
+                                                        compact
+                                                        autoFocus
+                                                        allowEmpty
+                                                        aria-label={`${line.label}, ${month}`}
+                                                        value={total(line, m)}
+                                                        currency="INR"
+                                                        locale="en-IN"
+                                                        className="w-28"
+                                                        onValueChange={(v) => {
+                                                            setAmount(line.key, m, v);
+                                                            close();
+                                                        }}
+                                                        onCancel={close}
+                                                    />
+                                                )}
+                                            >
+                                                {inr(total(line, m))}
+                                            </EditableCell>
+                                        )}
+                                    </TreeCell>
+                                ))}
+                            </TreeRow>
+                        );
+                    })}
+                    <TableSpacerRow height={rows.paddingBottom} colSpan={MONTHS.length + 1} />
+                </TableBody>
+                <TableFooter>
+                    <TableRow>
+                        <TableFooterCell sticky="start">Total</TableFooterCell>
+                        {MONTHS.map((month, m) => (
+                            <TableFooterCell key={month} numeric>
+                                {inr(plan.reduce((sum, g) => sum + total(g, m), 0))}
+                            </TableFooterCell>
+                        ))}
+                    </TableRow>
+                </TableFooter>
+            </Table>
+        </TableContainer>
+    );
+}
+```
+
+## API reference
+
+### TreeRow
+
+A table row wired to useTree: tree semantics, the keyboard and the open/close animation.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `row` (required) | `TreeRowData<T>` |  |  |
+| `tree` (required) | `{ rows: TreeRowData<T>[]; toggle: (key: string) => void; isExpanded: (key: string) => boolean; expand: (key: string) => void; collapse: (key: string) => void; expandAll: () => void; ... 4 more ...; rowHeight: number; }` |  |  |
+
+### TreeCell
+
+A cell in a TreeRow: its content sits in a box whose height animates as groups open and close.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `numeric` | `boolean` |  | Aligned to the end, tabular digits. |
+| `sticky` | `"start"` |  | Stay in view when the table scrolls sideways. |
+
+### TreeLabel
+
+The first column's content: indented by depth, with the row's toggle (or a spacer, so labels line up).
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `row` (required) | `TreeRowData<T>` |  |  |
+| `tree` (required) | `{ rows: TreeRowData<T>[]; toggle: (key: string) => void; isExpanded: (key: string) => boolean; expand: (key: string) => void; collapse: (key: string) => void; expandAll: () => void; ... 4 more ...; rowHeight: number; }` |  |  |
+| `className` | `string` |  |  |
+| `indent` | `number` | `20` | Indent per level, in px. |
+
+### TreeToggle
+
+Chevron button that opens and closes a row: points right when closed, down when open.
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `expanded` (required) | `boolean` |  |  |
+| `onToggle` (required) | `() => void` |  |  |

package/dist/docs/trend.md

@@ -0,0 +1,50 @@
+# Trend
+
+A change, like +12% with an arrow, coloured by whether it is good news.
+
+```tsx
+import { Trend } from '@rinzai/zen';
+```
+
+## Examples
+
+### Default
+
+```tsx
+import { Stat, StatRow, Trend } from '@rinzai/zen';
+
+/** Spending going up is bad news (`good="down"`); savings going up is good. */
+export default function Default() {
+    return (
+        <StatRow className="w-full max-w-xl">
+            <Stat
+                label="Spent"
+                value="$1,845"
+                hint={
+                    <Trend value={0.12} good="down">
+                        vs last month
+                    </Trend>
+                }
+            />
+            <Stat label="Saved" value="$640" hint={<Trend value={0.084}>vs last month</Trend>} />
+            <Stat label="Bills" value="$1,210" hint={<Trend value={0}>vs last month</Trend>} />
+        </StatRow>
+    );
+}
+```
+
+## API reference
+
+### Trend
+
+A change, e.g. "+12%" with an arrow, coloured by whether it's good news:
+savings going up is, spending going up isn't (`good="down"`). `value` is
+the change as a fraction (0.12 for 12%); children follow it, muted, e.g.
+"vs last month".
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `value` (required) | `number` |  | The change as a fraction: 0.12 is 12% up, -0.05 is 5% down. |
+| `format` | `((value: number) => string)` |  | How the change reads, e.g. as money instead of a percent. |
+| `good` | `"down" \| "up"` | `up` | Which way is good news (default `up`); spending would be `down`. |
+| `locale` | `string` |  | For the default percent format. Defaults to the LocaleProvider's. |

package/dist/icons/arrow-path.d.ts

@@ -0,0 +1,3 @@
+import { default as IconProps } from './icon.types';
+export default function ArrowPath(props: IconProps): import('react').JSX.Element;
+//# sourceMappingURL=arrow-path.d.ts.map

package/dist/icons/arrow-path.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"arrow-path.d.ts","sourceRoot":"","sources":["../../packages/icons/arrow-path.tsx"],"names":[],"mappings":"AAEA,OAAO,SAAS,MAAM,cAAc,CAAC;AAErC,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,KAAK,EAAE,SAAS,+BAoBjD"}

package/dist/icons/arrows-right-left.d.ts

@@ -0,0 +1,3 @@
+import { default as IconProps } from './icon.types';
+export default function ArrowsRightLeft(props: IconProps): import('react').JSX.Element;
+//# sourceMappingURL=arrows-right-left.d.ts.map

package/dist/icons/arrows-right-left.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"arrows-right-left.d.ts","sourceRoot":"","sources":["../../packages/icons/arrows-right-left.tsx"],"names":[],"mappings":"AAEA,OAAO,SAAS,MAAM,cAAc,CAAC;AAErC,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,SAAS,+BAoBvD"}

package/dist/icons/backward.d.ts

@@ -0,0 +1,3 @@
+import { default as IconProps } from './icon.types';
+export default function Backward(props: IconProps): import('react').JSX.Element;
+//# sourceMappingURL=backward.d.ts.map

package/dist/icons/backward.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"backward.d.ts","sourceRoot":"","sources":["../../packages/icons/backward.tsx"],"names":[],"mappings":"AAEA,OAAO,SAAS,MAAM,cAAc,CAAC;AAErC,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAK,EAAE,SAAS,+BAchD"}

package/dist/icons/forward.d.ts

@@ -0,0 +1,3 @@
+import { default as IconProps } from './icon.types';
+export default function Forward(props: IconProps): import('react').JSX.Element;
+//# sourceMappingURL=forward.d.ts.map

package/dist/icons/forward.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"forward.d.ts","sourceRoot":"","sources":["../../packages/icons/forward.tsx"],"names":[],"mappings":"AAEA,OAAO,SAAS,MAAM,cAAc,CAAC;AAErC,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,KAAK,EAAE,SAAS,+BAc/C"}

package/dist/icons/heart-solid.d.ts

@@ -0,0 +1,3 @@
+import { default as IconProps } from './icon.types';
+export default function HeartSolid(props: IconProps): import('react').JSX.Element;
+//# sourceMappingURL=heart-solid.d.ts.map

package/dist/icons/heart-solid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"heart-solid.d.ts","sourceRoot":"","sources":["../../packages/icons/heart-solid.tsx"],"names":[],"mappings":"AAEA,OAAO,SAAS,MAAM,cAAc,CAAC;AAErC,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,KAAK,EAAE,SAAS,+BAclD"}

package/dist/icons/heart.d.ts

@@ -0,0 +1,3 @@
+import { default as IconProps } from './icon.types';
+export default function Heart(props: IconProps): import('react').JSX.Element;
+//# sourceMappingURL=heart.d.ts.map

package/dist/icons/heart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"heart.d.ts","sourceRoot":"","sources":["../../packages/icons/heart.tsx"],"names":[],"mappings":"AAEA,OAAO,SAAS,MAAM,cAAc,CAAC;AAErC,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,KAAK,EAAE,SAAS,+BAoB7C"}