@vicinae/api 0.3.0

package/dist/api/components/form.d.ts

@@ -0,0 +1,81 @@
+import { ReactNode, Ref } from 'react';
+type FormProps = {
+    actions?: React.ReactNode;
+    children?: React.ReactNode;
+    enableDrafts?: boolean;
+    isLoading?: boolean;
+    navigationTitle?: string;
+    searchBarAccessory?: React.ReactNode;
+};
+export type FormItemRef = {
+    focus: () => void;
+    reset: () => void;
+};
+interface FormItemProps<T extends Form.Value> {
+    id: string;
+    title?: string;
+    info?: string;
+    error?: string;
+    storeValue?: boolean;
+    autoFocus?: boolean;
+    value?: T;
+    defaultValue?: T;
+    onChange?: (newValue: T) => void;
+    onBlur?: (event: FormEvent<T>) => void;
+    onFocus?: (event: FormEvent<T>) => void;
+}
+interface FormEvent<T extends Form.Value> {
+    target: {
+        id: string;
+        value?: T;
+    };
+    type: FormEventType;
+}
+type FormEventType = 'focus' | 'blur';
+export declare namespace Form {
+    type Props = FormProps;
+    type TextField = FormItemRef;
+    type PasswordField = FormItemRef;
+    type TextArea = FormItemRef;
+    type Checkbox = FormItemRef;
+    type DatePicker = FormItemRef;
+    type Dropdown = FormItemRef;
+    type TagPicker = FormItemRef;
+    type FilePicker = FormItemRef;
+    type ItemReference = FormItemRef;
+    type ItemProps<T extends Value> = FormItemProps<T>;
+    type Value = string | number | boolean | string[] | number[] | Date | null;
+    type Values = {
+        [itemId: string]: Value;
+    };
+}
+interface WithFormRef<T> {
+    ref?: Ref<T>;
+}
+interface TextFieldProps extends FormItemProps<string>, WithFormRef<Form.TextField> {
+}
+interface PasswordFieldProps extends FormItemProps<string>, WithFormRef<Form.PasswordField> {
+}
+interface DatePickerProps extends FormItemProps<Date | null>, WithFormRef<Form.DatePicker> {
+}
+interface CheckboxProps extends FormItemProps<boolean>, WithFormRef<Form.Checkbox> {
+    label?: string;
+}
+interface DropdownProps extends FormItemProps<string>, WithFormRef<Form.Dropdown> {
+    tooltip?: string;
+    children?: ReactNode;
+    filtering?: boolean;
+    isLoading?: boolean;
+    placeholder?: string;
+    throttle?: boolean;
+    onSearchTextChange?: (text: string) => void;
+}
+export declare const Form: import("react").FC<FormProps> & {
+    TextField: import("react").FC<TextFieldProps>;
+    PasswordField: import("react").FC<PasswordFieldProps>;
+    DatePicker: import("react").FC<DatePickerProps>;
+    Checkbox: import("react").FC<CheckboxProps>;
+    Dropdown: import("react").FC<DropdownProps>;
+    Separator: () => import("react/jsx-runtime").JSX.Element;
+};
+export {};

package/dist/api/components/form.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Form = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const use_imperative_form_handle_1 = require("../hooks/use-imperative-form-handle");
+const hooks_1 = require("../hooks");
+;
+;
+const FormRoot = ({ enableDrafts = false, actions, children, isLoading = false, navigationTitle, searchBarAccessory }) => {
+    return ((0, jsx_runtime_1.jsxs)("form", { enableDrafts: enableDrafts, isLoading: isLoading, navigationTitle: navigationTitle, children: [searchBarAccessory, children, actions] }));
+};
+;
+;
+const TextField = ({ ref, onChange, onBlur, onFocus, ...props }) => {
+    (0, use_imperative_form_handle_1.useImperativeFormHandle)(ref);
+    const blur = (0, hooks_1.useEventListener)(onBlur);
+    const focus = (0, hooks_1.useEventListener)(onFocus);
+    const change = (0, hooks_1.useEventListener)(onChange);
+    return (0, jsx_runtime_1.jsx)("text-field", { onBlur: blur, onFocus: focus, onChange: change, ...props });
+};
+;
+const PasswordField = ({ ...props }) => {
+    return (0, jsx_runtime_1.jsx)("password-field", { ...props });
+};
+;
+const DatePicker = ({ ...props }) => {
+    return (0, jsx_runtime_1.jsx)("date-picker-field", { ...props });
+};
+;
+const Checkbox = ({ ref, onBlur, onFocus, onChange, ...props }) => {
+    (0, use_imperative_form_handle_1.useImperativeFormHandle)(ref);
+    const blur = (0, hooks_1.useEventListener)(onBlur);
+    const focus = (0, hooks_1.useEventListener)(onFocus);
+    const change = (0, hooks_1.useEventListener)(onChange);
+    return (0, jsx_runtime_1.jsx)("checkbox-field", { onBlur: blur, onFocus: focus, onChange: change, ...props });
+};
+;
+const Dropdown = ({ children, onBlur, onFocus, onChange, ...props }) => {
+    const onSearchTextChange = (0, hooks_1.useEventListener)(props.onSearchTextChange);
+    const blur = (0, hooks_1.useEventListener)(onBlur);
+    const focus = (0, hooks_1.useEventListener)(onFocus);
+    const change = (0, hooks_1.useEventListener)(onChange);
+    const rest = { ...props, onSearchTextChange };
+    return ((0, jsx_runtime_1.jsx)("dropdown-field", { onBlur: blur, onFocus: focus, onChange: change, ...rest, children: children }));
+};
+exports.Form = Object.assign(FormRoot, {
+    TextField,
+    PasswordField,
+    DatePicker,
+    Checkbox,
+    Dropdown,
+    Separator: () => (0, jsx_runtime_1.jsx)("separator", {})
+});

package/dist/api/components/grid.d.ts

@@ -0,0 +1,117 @@
+import React, { ReactNode } from 'react';
+import { Image, ImageLike } from '../image';
+import { Color, ColorLike } from '../color';
+declare enum GridInset {
+    Small = "small",
+    Medium = "medium",
+    Large = "large"
+}
+type SectionConfig = {
+    inset?: GridInset;
+    columns?: number;
+    fit?: GridFit;
+    aspectRatio?: GridAspectRatio;
+};
+type GridAspectRatio = '1' | '3/2' | '2/3' | '4/3' | '3/4' | '16/9' | '9/16';
+declare enum GridFit {
+    Contain = "contain",
+    Fill = "fill"
+}
+export declare namespace Grid {
+    namespace Section {
+        type Props = GridSectionProps;
+    }
+    type Props = GridProps;
+    type Inset = GridInset;
+    type AspectRatio = GridAspectRatio;
+    namespace Item {
+        type Props = {
+            title?: string;
+            detail?: React.ReactNode;
+            keywords?: string[];
+            icon?: ImageLike;
+            content: Image.ImageLike | {
+                color: ColorLike;
+            } | {
+                value: Image.ImageLike;
+                tooltip?: string;
+            };
+            id?: string;
+            subtitle?: string;
+            actions?: ReactNode;
+            accessories?: Grid.Item.Accessory[];
+        };
+        type Tag = string | Date | undefined | null | {
+            color: ColorLike;
+            value: string | Date | undefined | null;
+        };
+        type Text = string | Date | undefined | null | {
+            color: Color;
+            value: string | Date | undefined | null;
+        };
+        type Accessory = ({
+            tag?: Tag;
+        } | {
+            text?: Text;
+        }) & {
+            icon?: Image.ImageLike;
+            tooltip?: string | null;
+        };
+    }
+}
+type GridProps = SectionConfig & {
+    actions?: React.ReactNode;
+    children?: React.ReactNode;
+    filtering?: boolean;
+    /**
+     * @deprecated use filtering
+     */
+    enableFiltering?: boolean;
+    isLoading?: boolean;
+    searchText?: string;
+    searchBarPlaceholder?: string;
+    navigationTitle?: string;
+    searchBarAccessory?: ReactNode;
+    onSearchTextChange?: (text: string) => void;
+    onSelectionChange?: (id: string) => void;
+};
+type GridSectionProps = SectionConfig & {
+    title?: string;
+    subtitle?: string;
+    children?: ReactNode;
+};
+export declare const GridAccessory: React.FC<Grid.Item.Accessory>;
+export declare const Grid: React.FC<GridProps> & {
+    Section: React.FC<GridSectionProps>;
+    EmptyView: React.FC<import("./empty-view").EmptyViewProps>;
+    Dropdown: React.FC<{
+        tooltip?: string;
+        children?: ReactNode;
+        defaultValue?: string;
+        filtering?: boolean;
+        id?: string;
+        isLoading?: boolean;
+        placeholder?: string;
+        storeValue?: boolean;
+        throttle?: boolean;
+        value?: string;
+        onChange?: (newValue: string) => void;
+        onSearchTextChange?: (text: string) => void;
+    }> & {
+        Item: React.FC<{
+            title: string;
+            value: string;
+            icon?: Image.ImageLike;
+            keywords?: string[];
+        }>;
+        Section: React.FC<{
+            title?: string;
+            children?: ReactNode;
+        }>;
+    };
+    Inset: typeof GridInset;
+    Item: React.FC<Grid.Item.Props> & {
+        Accessory: React.FC<Grid.Item.Accessory>;
+    };
+};
+export {};

package/dist/api/components/grid.js

@@ -0,0 +1,80 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Grid = exports.GridAccessory = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const image_1 = require("../image");
+const crypto_1 = require("crypto");
+const empty_view_1 = require("./empty-view");
+const hooks_1 = require("../hooks");
+const dropdown_1 = require("./dropdown");
+var GridInset;
+(function (GridInset) {
+    GridInset["Small"] = "small";
+    GridInset["Medium"] = "medium";
+    GridInset["Large"] = "large";
+})(GridInset || (GridInset = {}));
+var GridFit;
+(function (GridFit) {
+    GridFit["Contain"] = "contain";
+    GridFit["Fill"] = "fill";
+})(GridFit || (GridFit = {}));
+;
+const GridRoot = ({ onSearchTextChange, searchBarAccessory, onSelectionChange, children, actions, inset, fit = GridFit.Contain, aspectRatio = '1', ...props }) => {
+    const searchTextChangeHandler = (0, hooks_1.useEventListener)(onSearchTextChange);
+    const selectionChangeHandler = (0, hooks_1.useEventListener)(onSelectionChange);
+    if (typeof props.enableFiltering === "boolean" && typeof props.filtering === "undefined") {
+        props.filtering = props.enableFiltering;
+    }
+    return (0, jsx_runtime_1.jsxs)("grid", { fit: fit, inset: inset, aspectRatio: aspectRatio, onSearchTextChange: searchTextChangeHandler, onSelectionChange: selectionChangeHandler, ...props, children: [searchBarAccessory, children, actions] });
+};
+const GridItem = ({ detail, actions, keywords, ...props }) => {
+    const id = (0, react_1.useRef)(props.id ?? (0, crypto_1.randomUUID)());
+    const nativeProps = {
+        title: props.title,
+        subtitle: props.subtitle,
+        id: id.current,
+        keywords,
+    };
+    const isColor = (content) => {
+        return !!content['color'];
+    };
+    const isDataWithTooltip = (content) => {
+        return !!content['value'];
+    };
+    if (isColor(props.content)) {
+        nativeProps.content = { color: props.content.color };
+    }
+    else if (isDataWithTooltip(props.content)) {
+        nativeProps.content = {
+            value: (0, image_1.serializeImageLike)(props.content.value),
+            tooltip: props.content.tooltip
+        };
+    }
+    else {
+        nativeProps.content = (0, image_1.serializeImageLike)(props.content);
+    }
+    return ((0, jsx_runtime_1.jsxs)("grid-item", { ...nativeProps, children: [detail, actions] }));
+};
+const GridSection = ({ fit = GridFit.Contain, aspectRatio = '1', inset, ...props }) => {
+    const nativeProps = {
+        fit,
+        aspectRatio,
+        inset,
+        ...props
+    };
+    return (0, jsx_runtime_1.jsx)("grid-section", { ...nativeProps });
+};
+const GridAccessory = (props) => {
+    return (0, jsx_runtime_1.jsx)("list-accessory", {});
+};
+exports.GridAccessory = GridAccessory;
+exports.Grid = Object.assign(GridRoot, {
+    Section: GridSection,
+    EmptyView: empty_view_1.EmptyView,
+    Dropdown: dropdown_1.Dropdown,
+    Inset: GridInset,
+    Item: Object.assign(GridItem, {
+        Accessory: exports.GridAccessory
+    }),
+});

package/dist/api/components/index.d.ts

@@ -0,0 +1,7 @@
+export * from './list.js';
+export * from './grid.js';
+export * from './detail.js';
+export * from './action-pannel.js';
+export * from './actions.js';
+export * from './form.js';
+export * from './menu-bar.js';

package/dist/api/components/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./list.js"), exports);
+__exportStar(require("./grid.js"), exports);
+__exportStar(require("./detail.js"), exports);
+__exportStar(require("./action-pannel.js"), exports);
+__exportStar(require("./actions.js"), exports);
+__exportStar(require("./form.js"), exports);
+__exportStar(require("./menu-bar.js"), exports);

package/dist/api/components/list.d.ts

@@ -0,0 +1,109 @@
+import React, { ReactNode } from 'react';
+import { Image, ImageLike } from '../image';
+import { Color, ColorLike } from '../color';
+export declare namespace List {
+    namespace Item {
+        type Props = ListItemProps;
+        type Tag = string | Date | undefined | null | {
+            color: ColorLike;
+            value: string | Date | undefined | null;
+        };
+        type Text = string | Date | undefined | null | {
+            color: Color;
+            value: string | Date | undefined | null;
+        };
+        type Accessory = ({
+            tag?: Tag;
+        } | {
+            text?: Text;
+        }) & {
+            icon?: Image.ImageLike;
+            tooltip?: string | null;
+        };
+    }
+}
+type ListProps = {
+    actions?: React.ReactNode;
+    children?: React.ReactNode;
+    filtering?: boolean;
+    /**
+     * @deprecated use filtering
+     */
+    enableFiltering?: boolean;
+    isLoading?: boolean;
+    isShowingDetail?: boolean;
+    searchText?: string;
+    searchBarPlaceholder?: string;
+    navigationTitle?: string;
+    searchBarAccessory?: ReactNode;
+    onSearchTextChange?: (text: string) => void;
+    onSelectionChange?: (id: string) => void;
+};
+export type ListItemProps = {
+    title: string;
+    keywords?: string[];
+    detail?: React.ReactNode;
+    icon?: ImageLike;
+    id?: string;
+    subtitle?: string;
+    actions?: ReactNode;
+    accessories?: List.Item.Accessory[];
+};
+export type ListItemDetailProps = {
+    isLoading?: boolean;
+    markdown?: string;
+    metadata?: React.ReactNode;
+};
+type ListSectionProps = {
+    title?: string;
+    subtitle?: string;
+    children?: ReactNode;
+};
+export declare const ListAccessory: React.FC<List.Item.Accessory>;
+export declare const List: React.FC<ListProps> & {
+    Section: React.FC<ListSectionProps>;
+    EmptyView: React.FC<import("./empty-view").EmptyViewProps>;
+    Dropdown: React.FC<{
+        tooltip?: string;
+        children?: ReactNode;
+        defaultValue?: string;
+        filtering?: boolean;
+        id?: string;
+        isLoading?: boolean;
+        placeholder?: string;
+        storeValue?: boolean;
+        throttle?: boolean;
+        value?: string;
+        onChange?: (newValue: string) => void;
+        onSearchTextChange?: (text: string) => void;
+    }> & {
+        Item: React.FC<{
+            title: string;
+            value: string;
+            icon?: Image.ImageLike;
+            keywords?: string[];
+        }>;
+        Section: React.FC<{
+            title?: string;
+            children?: ReactNode;
+        }>;
+    };
+    Item: React.FC<ListItemProps> & {
+        Detail: React.FC<ListItemDetailProps> & {
+            Metadata: React.FC<import("./metadata").MetadataProps> & {
+                Label: React.FC<import("./metadata").ListItemDetailMetadataLabelProps>;
+                Separator: React.FC<{}>;
+                TagList: React.FC<import("./tag").TagListProps> & {
+                    Item: React.FC<import("./tag").TagItemProps>;
+                };
+                Link: React.FC<{
+                    title: string;
+                    target: string;
+                    text: string;
+                }>;
+            };
+        };
+        Accessory: React.FC<List.Item.Accessory>;
+    };
+};
+export {};

package/dist/api/components/list.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.List = exports.ListAccessory = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const image_1 = require("../image");
+const crypto_1 = require("crypto");
+const metadata_1 = require("./metadata");
+const empty_view_1 = require("./empty-view");
+const hooks_1 = require("../hooks");
+const dropdown_1 = require("./dropdown");
+;
+const ListRoot = ({ onSearchTextChange, searchBarAccessory, onSelectionChange, children, actions, ...props }) => {
+    const searchTextChangeHandler = (0, hooks_1.useEventListener)(onSearchTextChange);
+    const selectionChangeHandler = (0, hooks_1.useEventListener)(onSelectionChange);
+    if (typeof props.enableFiltering === "boolean" && typeof props.filtering === "undefined") {
+        props.filtering = props.enableFiltering;
+    }
+    return (0, jsx_runtime_1.jsxs)("list", { onSearchTextChange: searchTextChangeHandler, onSelectionChange: selectionChangeHandler, ...props, children: [searchBarAccessory, children, actions] });
+};
+const ListItem = ({ detail, actions, ...props }) => {
+    const id = (0, react_1.useRef)(props.id ?? (0, crypto_1.randomUUID)());
+    const nativeProps = {
+        title: props.title,
+        subtitle: props.subtitle,
+        id: id.current,
+    };
+    if (props.icon)
+        nativeProps.icon = (0, image_1.serializeImageLike)(props.icon);
+    return ((0, jsx_runtime_1.jsxs)("list-item", { ...nativeProps, children: [detail, actions] }));
+};
+const ListItemDetail = ({ metadata, ...props }) => {
+    return ((0, jsx_runtime_1.jsx)("list-item-detail", { ...props, children: metadata }));
+};
+const ListSection = (props) => {
+    const nativeProps = props;
+    return (0, jsx_runtime_1.jsx)("list-section", { ...nativeProps });
+};
+const ListAccessory = (props) => {
+    return (0, jsx_runtime_1.jsx)("list-accessory", {});
+};
+exports.ListAccessory = ListAccessory;
+exports.List = Object.assign(ListRoot, {
+    Section: ListSection,
+    EmptyView: empty_view_1.EmptyView,
+    Dropdown: dropdown_1.Dropdown,
+    Item: Object.assign(ListItem, {
+        Detail: Object.assign(ListItemDetail, {
+            Metadata: metadata_1.Metadata
+        }),
+        Accessory: exports.ListAccessory
+    }),
+});

package/dist/api/components/menu-bar.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from "react";
+import { Image } from "../image";
+import { Keyboard } from "../keyboard";
+type MenuBarExtraProps = {
+    icon?: Image.ImageLike;
+    isLoading?: boolean;
+    title?: string;
+    tooltip?: string;
+    children?: ReactNode;
+};
+type MenuBarExtraItemProps = {
+    title: string;
+    alternate?: any;
+    icon?: Image.ImageLike;
+    shortcut?: Keyboard.Shortcut;
+    subtitle?: string;
+    tooltip?: string;
+    onAction?: (event: any) => void;
+};
+export declare const MenuBarExtra: import("react").FC<MenuBarExtraProps> & {
+    Item: import("react").FC<MenuBarExtraItemProps>;
+    Submenu: import("react").FC<any>;
+    Section: import("react").FC<any>;
+    Separator: import("react").FC<any>;
+};
+export {};

package/dist/api/components/menu-bar.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuBarExtra = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Root = () => {
+    return (0, jsx_runtime_1.jsx)("menu-bar", {});
+};
+const Item = () => {
+    return (0, jsx_runtime_1.jsx)("menu-bar-item", {});
+};
+const Submenu = () => {
+    return (0, jsx_runtime_1.jsx)("menu-bar-submenu", {});
+};
+const Section = () => {
+    return (0, jsx_runtime_1.jsx)("menu-bar-section", {});
+};
+const Separator = () => {
+    return (0, jsx_runtime_1.jsx)("separator", {});
+};
+exports.MenuBarExtra = Object.assign(Root, {
+    Item,
+    Submenu,
+    Section,
+    Separator
+});

package/dist/api/components/metadata.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { ImageLike } from '../image';
+export type MetadataProps = {
+    children?: React.ReactNode;
+};
+export type ListItemDetailMetadataLabelProps = {
+    title: string;
+    text: string;
+    icon?: ImageLike;
+};
+export type ListItemDetailMetadataSeparator = {};
+export declare const Metadata: React.FC<MetadataProps> & {
+    Label: React.FC<ListItemDetailMetadataLabelProps>;
+    Separator: React.FC<{}>;
+    TagList: React.FC<import("./tag").TagListProps> & {
+        Item: React.FC<import("./tag").TagItemProps>;
+    };
+    Link: React.FC<{
+        title: string;
+        target: string;
+        text: string;
+    }>;
+};

package/dist/api/components/metadata.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Metadata = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const image_1 = require("../image");
+const tag_1 = require("./tag");
+const MetadataRoot = (props) => {
+    return (0, jsx_runtime_1.jsx)("metadata", { ...props });
+};
+const MetadataLabel = ({ icon, ...props }) => {
+    const nativeProps = props;
+    if (icon)
+        nativeProps.icon = (0, image_1.serializeImageLike)(icon);
+    return (0, jsx_runtime_1.jsx)("metadata-label", { ...props });
+};
+const MetadataSeparator = () => {
+    return (0, jsx_runtime_1.jsx)("metadata-separator", {});
+};
+const MetadataLink = ({ title, target, text }) => {
+    return (0, jsx_runtime_1.jsx)("metadata-link", { title: title, target: target, text: text });
+};
+exports.Metadata = Object.assign(MetadataRoot, {
+    Label: MetadataLabel,
+    Separator: MetadataSeparator,
+    TagList: tag_1.TagList,
+    Link: MetadataLink
+});

package/dist/api/components/tag.d.ts

@@ -0,0 +1,16 @@
+import React, { ReactNode } from 'react';
+import { ImageLike } from '../image';
+import { ColorLike } from '../color';
+export type TagListProps = {
+    title: string;
+    children: ReactNode;
+};
+export type TagItemProps = {
+    color?: ColorLike;
+    icon?: ImageLike;
+    text?: string;
+    onAction?: () => void;
+};
+export declare const TagList: React.FC<TagListProps> & {
+    Item: React.FC<TagItemProps>;
+};

package/dist/api/components/tag.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TagList = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const image_1 = require("../image");
+const color_1 = require("../color");
+const hooks_1 = require("../hooks");
+const TagListRoot = ({ title, children }) => {
+    const nativeProps = {
+        title,
+        children
+    };
+    return (0, jsx_runtime_1.jsx)("tag-list", { ...nativeProps });
+};
+const TagItem = ({ color, icon, text, onAction }) => {
+    const onActionHandler = (0, hooks_1.useEventListener)(onAction);
+    const nativeProps = {
+        text, onAction: onActionHandler
+    };
+    if (color)
+        nativeProps.color = (0, color_1.serializeColorLike)(color);
+    if (icon)
+        nativeProps.icon = (0, image_1.serializeImageLike)(icon);
+    return (0, jsx_runtime_1.jsx)("tag-item", { ...nativeProps });
+};
+exports.TagList = Object.assign(TagListRoot, {
+    Item: TagItem
+});

package/dist/api/context/index.d.ts

@@ -0,0 +1 @@
+export * from './navigation-provider';