@tessera-ui/react 0.4.1 → 0.5.0

package/README.md

@@ -0,0 +1,36 @@
+# @tessera-ui/react
+
+React wrappers for [Tessera UI](https://github.com/jkguidaven/tessera-ui) web components.
+
+## Installation
+
+```bash
+npm install @tessera-ui/react
+```
+
+## Usage
+
+```tsx
+import { TsButton, TsInput } from '@tessera-ui/react';
+
+function App() {
+  return (
+    <div>
+      <TsInput label="Email" placeholder="you@example.com" />
+      <TsButton variant="primary">Submit</TsButton>
+    </div>
+  );
+}
+```
+
+Design tokens (CSS custom properties) are auto-imported — no additional CSS import needed.
+
+## Documentation
+
+- [Component docs](https://jkguidaven.github.io/tessera-ui/)
+- [Storybook](https://jkguidaven.github.io/tessera-ui/storybook/)
+- [GitHub](https://github.com/jkguidaven/tessera-ui)
+
+## License
+
+MIT

package/dist/cjs/components/components.js

@@ -0,0 +1,515 @@
+"use strict";
+'use client';
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TsTooltip = exports.TsToolbar = exports.TsToggle = exports.TsToast = exports.TsTextarea = exports.TsTabs = exports.TsTable = exports.TsTabPanel = exports.TsSwitchOption = exports.TsSwitchGroup = exports.TsStepper = exports.TsStep = exports.TsStack = exports.TsSpinner = exports.TsSpacer = exports.TsSlider = exports.TsSkeleton = exports.TsSelect = exports.TsRow = exports.TsRadio = exports.TsProgress = exports.TsPopover = exports.TsPagination = exports.TsNavItem = exports.TsNav = exports.TsModal = exports.TsMenuItem = exports.TsMenu = exports.TsInput = exports.TsIcon = exports.TsGrid = exports.TsFileUpload = exports.TsEmptyState = exports.TsDrawer = exports.TsDivider = exports.TsDialog = exports.TsDatePicker = exports.TsContainer = exports.TsChip = exports.TsCheckbox = exports.TsCard = exports.TsButton = exports.TsBreadcrumbItem = exports.TsBreadcrumb = exports.TsBanner = exports.TsBadge = exports.TsAvatar = exports.TsAlert = exports.TsAccordionItem = exports.TsAccordion = void 0;
+exports.TsTreeItem = exports.TsTree = void 0;
+const runtime_1 = require("@stencil/react-output-target/runtime");
+const ts_accordion_item_js_1 = require("@tessera-ui/core/dist/components/ts-accordion-item.js");
+const ts_accordion_js_1 = require("@tessera-ui/core/dist/components/ts-accordion.js");
+const ts_alert_js_1 = require("@tessera-ui/core/dist/components/ts-alert.js");
+const ts_avatar_js_1 = require("@tessera-ui/core/dist/components/ts-avatar.js");
+const ts_badge_js_1 = require("@tessera-ui/core/dist/components/ts-badge.js");
+const ts_banner_js_1 = require("@tessera-ui/core/dist/components/ts-banner.js");
+const ts_breadcrumb_item_js_1 = require("@tessera-ui/core/dist/components/ts-breadcrumb-item.js");
+const ts_breadcrumb_js_1 = require("@tessera-ui/core/dist/components/ts-breadcrumb.js");
+const ts_button_js_1 = require("@tessera-ui/core/dist/components/ts-button.js");
+const ts_card_js_1 = require("@tessera-ui/core/dist/components/ts-card.js");
+const ts_checkbox_js_1 = require("@tessera-ui/core/dist/components/ts-checkbox.js");
+const ts_chip_js_1 = require("@tessera-ui/core/dist/components/ts-chip.js");
+const ts_container_js_1 = require("@tessera-ui/core/dist/components/ts-container.js");
+const ts_date_picker_js_1 = require("@tessera-ui/core/dist/components/ts-date-picker.js");
+const ts_dialog_js_1 = require("@tessera-ui/core/dist/components/ts-dialog.js");
+const ts_divider_js_1 = require("@tessera-ui/core/dist/components/ts-divider.js");
+const ts_drawer_js_1 = require("@tessera-ui/core/dist/components/ts-drawer.js");
+const ts_empty_state_js_1 = require("@tessera-ui/core/dist/components/ts-empty-state.js");
+const ts_file_upload_js_1 = require("@tessera-ui/core/dist/components/ts-file-upload.js");
+const ts_grid_js_1 = require("@tessera-ui/core/dist/components/ts-grid.js");
+const ts_icon_js_1 = require("@tessera-ui/core/dist/components/ts-icon.js");
+const ts_input_js_1 = require("@tessera-ui/core/dist/components/ts-input.js");
+const ts_menu_item_js_1 = require("@tessera-ui/core/dist/components/ts-menu-item.js");
+const ts_menu_js_1 = require("@tessera-ui/core/dist/components/ts-menu.js");
+const ts_modal_js_1 = require("@tessera-ui/core/dist/components/ts-modal.js");
+const ts_nav_item_js_1 = require("@tessera-ui/core/dist/components/ts-nav-item.js");
+const ts_nav_js_1 = require("@tessera-ui/core/dist/components/ts-nav.js");
+const ts_pagination_js_1 = require("@tessera-ui/core/dist/components/ts-pagination.js");
+const ts_popover_js_1 = require("@tessera-ui/core/dist/components/ts-popover.js");
+const ts_progress_js_1 = require("@tessera-ui/core/dist/components/ts-progress.js");
+const ts_radio_js_1 = require("@tessera-ui/core/dist/components/ts-radio.js");
+const ts_row_js_1 = require("@tessera-ui/core/dist/components/ts-row.js");
+const ts_select_js_1 = require("@tessera-ui/core/dist/components/ts-select.js");
+const ts_skeleton_js_1 = require("@tessera-ui/core/dist/components/ts-skeleton.js");
+const ts_slider_js_1 = require("@tessera-ui/core/dist/components/ts-slider.js");
+const ts_spacer_js_1 = require("@tessera-ui/core/dist/components/ts-spacer.js");
+const ts_spinner_js_1 = require("@tessera-ui/core/dist/components/ts-spinner.js");
+const ts_stack_js_1 = require("@tessera-ui/core/dist/components/ts-stack.js");
+const ts_step_js_1 = require("@tessera-ui/core/dist/components/ts-step.js");
+const ts_stepper_js_1 = require("@tessera-ui/core/dist/components/ts-stepper.js");
+const ts_switch_group_js_1 = require("@tessera-ui/core/dist/components/ts-switch-group.js");
+const ts_switch_option_js_1 = require("@tessera-ui/core/dist/components/ts-switch-option.js");
+const ts_tab_panel_js_1 = require("@tessera-ui/core/dist/components/ts-tab-panel.js");
+const ts_table_js_1 = require("@tessera-ui/core/dist/components/ts-table.js");
+const ts_tabs_js_1 = require("@tessera-ui/core/dist/components/ts-tabs.js");
+const ts_textarea_js_1 = require("@tessera-ui/core/dist/components/ts-textarea.js");
+const ts_toast_js_1 = require("@tessera-ui/core/dist/components/ts-toast.js");
+const ts_toggle_js_1 = require("@tessera-ui/core/dist/components/ts-toggle.js");
+const ts_toolbar_js_1 = require("@tessera-ui/core/dist/components/ts-toolbar.js");
+const ts_tooltip_js_1 = require("@tessera-ui/core/dist/components/ts-tooltip.js");
+const ts_tree_item_js_1 = require("@tessera-ui/core/dist/components/ts-tree-item.js");
+const ts_tree_js_1 = require("@tessera-ui/core/dist/components/ts-tree.js");
+const react_1 = __importDefault(require("react"));
+exports.TsAccordion = (0, runtime_1.createComponent)({
+    tagName: 'ts-accordion',
+    elementClass: ts_accordion_js_1.TsAccordion,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_accordion_js_1.defineCustomElement
+});
+exports.TsAccordionItem = (0, runtime_1.createComponent)({
+    tagName: 'ts-accordion-item',
+    elementClass: ts_accordion_item_js_1.TsAccordionItem,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsToggle: 'tsToggle' },
+    defineCustomElement: ts_accordion_item_js_1.defineCustomElement
+});
+exports.TsAlert = (0, runtime_1.createComponent)({
+    tagName: 'ts-alert',
+    elementClass: ts_alert_js_1.TsAlert,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsClose: 'tsClose' },
+    defineCustomElement: ts_alert_js_1.defineCustomElement
+});
+exports.TsAvatar = (0, runtime_1.createComponent)({
+    tagName: 'ts-avatar',
+    elementClass: ts_avatar_js_1.TsAvatar,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_avatar_js_1.defineCustomElement
+});
+exports.TsBadge = (0, runtime_1.createComponent)({
+    tagName: 'ts-badge',
+    elementClass: ts_badge_js_1.TsBadge,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_badge_js_1.defineCustomElement
+});
+exports.TsBanner = (0, runtime_1.createComponent)({
+    tagName: 'ts-banner',
+    elementClass: ts_banner_js_1.TsBanner,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsClose: 'tsClose' },
+    defineCustomElement: ts_banner_js_1.defineCustomElement
+});
+exports.TsBreadcrumb = (0, runtime_1.createComponent)({
+    tagName: 'ts-breadcrumb',
+    elementClass: ts_breadcrumb_js_1.TsBreadcrumb,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_breadcrumb_js_1.defineCustomElement
+});
+exports.TsBreadcrumbItem = (0, runtime_1.createComponent)({
+    tagName: 'ts-breadcrumb-item',
+    elementClass: ts_breadcrumb_item_js_1.TsBreadcrumbItem,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_breadcrumb_item_js_1.defineCustomElement
+});
+exports.TsButton = (0, runtime_1.createComponent)({
+    tagName: 'ts-button',
+    elementClass: ts_button_js_1.TsButton,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsClick: 'tsClick',
+        onTsFocus: 'tsFocus',
+        onTsBlur: 'tsBlur'
+    },
+    defineCustomElement: ts_button_js_1.defineCustomElement
+});
+exports.TsCard = (0, runtime_1.createComponent)({
+    tagName: 'ts-card',
+    elementClass: ts_card_js_1.TsCard,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_card_js_1.defineCustomElement
+});
+exports.TsCheckbox = (0, runtime_1.createComponent)({
+    tagName: 'ts-checkbox',
+    elementClass: ts_checkbox_js_1.TsCheckbox,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsChange: 'tsChange' },
+    defineCustomElement: ts_checkbox_js_1.defineCustomElement
+});
+exports.TsChip = (0, runtime_1.createComponent)({
+    tagName: 'ts-chip',
+    elementClass: ts_chip_js_1.TsChip,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsRemove: 'tsRemove',
+        onTsClick: 'tsClick'
+    },
+    defineCustomElement: ts_chip_js_1.defineCustomElement
+});
+exports.TsContainer = (0, runtime_1.createComponent)({
+    tagName: 'ts-container',
+    elementClass: ts_container_js_1.TsContainer,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_container_js_1.defineCustomElement
+});
+exports.TsDatePicker = (0, runtime_1.createComponent)({
+    tagName: 'ts-date-picker',
+    elementClass: ts_date_picker_js_1.TsDatePicker,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsChange: 'tsChange' },
+    defineCustomElement: ts_date_picker_js_1.defineCustomElement
+});
+exports.TsDialog = (0, runtime_1.createComponent)({
+    tagName: 'ts-dialog',
+    elementClass: ts_dialog_js_1.TsDialog,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsClose: 'tsClose' },
+    defineCustomElement: ts_dialog_js_1.defineCustomElement
+});
+exports.TsDivider = (0, runtime_1.createComponent)({
+    tagName: 'ts-divider',
+    elementClass: ts_divider_js_1.TsDivider,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_divider_js_1.defineCustomElement
+});
+exports.TsDrawer = (0, runtime_1.createComponent)({
+    tagName: 'ts-drawer',
+    elementClass: ts_drawer_js_1.TsDrawer,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsClose: 'tsClose' },
+    defineCustomElement: ts_drawer_js_1.defineCustomElement
+});
+exports.TsEmptyState = (0, runtime_1.createComponent)({
+    tagName: 'ts-empty-state',
+    elementClass: ts_empty_state_js_1.TsEmptyState,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_empty_state_js_1.defineCustomElement
+});
+exports.TsFileUpload = (0, runtime_1.createComponent)({
+    tagName: 'ts-file-upload',
+    elementClass: ts_file_upload_js_1.TsFileUpload,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsChange: 'tsChange' },
+    defineCustomElement: ts_file_upload_js_1.defineCustomElement
+});
+exports.TsGrid = (0, runtime_1.createComponent)({
+    tagName: 'ts-grid',
+    elementClass: ts_grid_js_1.TsGrid,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_grid_js_1.defineCustomElement
+});
+exports.TsIcon = (0, runtime_1.createComponent)({
+    tagName: 'ts-icon',
+    elementClass: ts_icon_js_1.TsIcon,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_icon_js_1.defineCustomElement
+});
+exports.TsInput = (0, runtime_1.createComponent)({
+    tagName: 'ts-input',
+    elementClass: ts_input_js_1.TsInput,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsInput: 'tsInput',
+        onTsChange: 'tsChange',
+        onTsFocus: 'tsFocus',
+        onTsBlur: 'tsBlur',
+        onTsValidate: 'tsValidate'
+    },
+    defineCustomElement: ts_input_js_1.defineCustomElement
+});
+exports.TsMenu = (0, runtime_1.createComponent)({
+    tagName: 'ts-menu',
+    elementClass: ts_menu_js_1.TsMenu,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsOpen: 'tsOpen',
+        onTsClose: 'tsClose'
+    },
+    defineCustomElement: ts_menu_js_1.defineCustomElement
+});
+exports.TsMenuItem = (0, runtime_1.createComponent)({
+    tagName: 'ts-menu-item',
+    elementClass: ts_menu_item_js_1.TsMenuItem,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsSelect: 'tsSelect' },
+    defineCustomElement: ts_menu_item_js_1.defineCustomElement
+});
+exports.TsModal = (0, runtime_1.createComponent)({
+    tagName: 'ts-modal',
+    elementClass: ts_modal_js_1.TsModal,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsOpen: 'tsOpen',
+        onTsClose: 'tsClose'
+    },
+    defineCustomElement: ts_modal_js_1.defineCustomElement
+});
+exports.TsNav = (0, runtime_1.createComponent)({
+    tagName: 'ts-nav',
+    elementClass: ts_nav_js_1.TsNav,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_nav_js_1.defineCustomElement
+});
+exports.TsNavItem = (0, runtime_1.createComponent)({
+    tagName: 'ts-nav-item',
+    elementClass: ts_nav_item_js_1.TsNavItem,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsSelect: 'tsSelect' },
+    defineCustomElement: ts_nav_item_js_1.defineCustomElement
+});
+exports.TsPagination = (0, runtime_1.createComponent)({
+    tagName: 'ts-pagination',
+    elementClass: ts_pagination_js_1.TsPagination,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsChange: 'tsChange' },
+    defineCustomElement: ts_pagination_js_1.defineCustomElement
+});
+exports.TsPopover = (0, runtime_1.createComponent)({
+    tagName: 'ts-popover',
+    elementClass: ts_popover_js_1.TsPopover,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsOpen: 'tsOpen',
+        onTsClose: 'tsClose'
+    },
+    defineCustomElement: ts_popover_js_1.defineCustomElement
+});
+exports.TsProgress = (0, runtime_1.createComponent)({
+    tagName: 'ts-progress',
+    elementClass: ts_progress_js_1.TsProgress,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_progress_js_1.defineCustomElement
+});
+exports.TsRadio = (0, runtime_1.createComponent)({
+    tagName: 'ts-radio',
+    elementClass: ts_radio_js_1.TsRadio,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsChange: 'tsChange' },
+    defineCustomElement: ts_radio_js_1.defineCustomElement
+});
+exports.TsRow = (0, runtime_1.createComponent)({
+    tagName: 'ts-row',
+    elementClass: ts_row_js_1.TsRow,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_row_js_1.defineCustomElement
+});
+exports.TsSelect = (0, runtime_1.createComponent)({
+    tagName: 'ts-select',
+    elementClass: ts_select_js_1.TsSelect,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsChange: 'tsChange',
+        onTsFocus: 'tsFocus',
+        onTsBlur: 'tsBlur'
+    },
+    defineCustomElement: ts_select_js_1.defineCustomElement
+});
+exports.TsSkeleton = (0, runtime_1.createComponent)({
+    tagName: 'ts-skeleton',
+    elementClass: ts_skeleton_js_1.TsSkeleton,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_skeleton_js_1.defineCustomElement
+});
+exports.TsSlider = (0, runtime_1.createComponent)({
+    tagName: 'ts-slider',
+    elementClass: ts_slider_js_1.TsSlider,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsInput: 'tsInput',
+        onTsChange: 'tsChange'
+    },
+    defineCustomElement: ts_slider_js_1.defineCustomElement
+});
+exports.TsSpacer = (0, runtime_1.createComponent)({
+    tagName: 'ts-spacer',
+    elementClass: ts_spacer_js_1.TsSpacer,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_spacer_js_1.defineCustomElement
+});
+exports.TsSpinner = (0, runtime_1.createComponent)({
+    tagName: 'ts-spinner',
+    elementClass: ts_spinner_js_1.TsSpinner,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_spinner_js_1.defineCustomElement
+});
+exports.TsStack = (0, runtime_1.createComponent)({
+    tagName: 'ts-stack',
+    elementClass: ts_stack_js_1.TsStack,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_stack_js_1.defineCustomElement
+});
+exports.TsStep = (0, runtime_1.createComponent)({
+    tagName: 'ts-step',
+    elementClass: ts_step_js_1.TsStep,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_step_js_1.defineCustomElement
+});
+exports.TsStepper = (0, runtime_1.createComponent)({
+    tagName: 'ts-stepper',
+    elementClass: ts_stepper_js_1.TsStepper,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_stepper_js_1.defineCustomElement
+});
+exports.TsSwitchGroup = (0, runtime_1.createComponent)({
+    tagName: 'ts-switch-group',
+    elementClass: ts_switch_group_js_1.TsSwitchGroup,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsChange: 'tsChange' },
+    defineCustomElement: ts_switch_group_js_1.defineCustomElement
+});
+exports.TsSwitchOption = (0, runtime_1.createComponent)({
+    tagName: 'ts-switch-option',
+    elementClass: ts_switch_option_js_1.TsSwitchOption,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_switch_option_js_1.defineCustomElement
+});
+exports.TsTabPanel = (0, runtime_1.createComponent)({
+    tagName: 'ts-tab-panel',
+    elementClass: ts_tab_panel_js_1.TsTabPanel,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_tab_panel_js_1.defineCustomElement
+});
+exports.TsTable = (0, runtime_1.createComponent)({
+    tagName: 'ts-table',
+    elementClass: ts_table_js_1.TsTable,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_table_js_1.defineCustomElement
+});
+exports.TsTabs = (0, runtime_1.createComponent)({
+    tagName: 'ts-tabs',
+    elementClass: ts_tabs_js_1.TsTabs,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsChange: 'tsChange' },
+    defineCustomElement: ts_tabs_js_1.defineCustomElement
+});
+exports.TsTextarea = (0, runtime_1.createComponent)({
+    tagName: 'ts-textarea',
+    elementClass: ts_textarea_js_1.TsTextarea,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsInput: 'tsInput',
+        onTsChange: 'tsChange',
+        onTsFocus: 'tsFocus',
+        onTsBlur: 'tsBlur'
+    },
+    defineCustomElement: ts_textarea_js_1.defineCustomElement
+});
+exports.TsToast = (0, runtime_1.createComponent)({
+    tagName: 'ts-toast',
+    elementClass: ts_toast_js_1.TsToast,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsClose: 'tsClose' },
+    defineCustomElement: ts_toast_js_1.defineCustomElement
+});
+exports.TsToggle = (0, runtime_1.createComponent)({
+    tagName: 'ts-toggle',
+    elementClass: ts_toggle_js_1.TsToggle,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: { onTsChange: 'tsChange' },
+    defineCustomElement: ts_toggle_js_1.defineCustomElement
+});
+exports.TsToolbar = (0, runtime_1.createComponent)({
+    tagName: 'ts-toolbar',
+    elementClass: ts_toolbar_js_1.TsToolbar,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_toolbar_js_1.defineCustomElement
+});
+exports.TsTooltip = (0, runtime_1.createComponent)({
+    tagName: 'ts-tooltip',
+    elementClass: ts_tooltip_js_1.TsTooltip,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_tooltip_js_1.defineCustomElement
+});
+exports.TsTree = (0, runtime_1.createComponent)({
+    tagName: 'ts-tree',
+    elementClass: ts_tree_js_1.TsTree,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {},
+    defineCustomElement: ts_tree_js_1.defineCustomElement
+});
+exports.TsTreeItem = (0, runtime_1.createComponent)({
+    tagName: 'ts-tree-item',
+    elementClass: ts_tree_item_js_1.TsTreeItem,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: react_1.default,
+    events: {
+        onTsToggle: 'tsToggle',
+        onTsSelect: 'tsSelect'
+    },
+    defineCustomElement: ts_tree_item_js_1.defineCustomElement
+});

package/dist/cjs/index.js

@@ -0,0 +1,19 @@
+"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 });
+// Auto-import Tessera UI design tokens (global CSS custom properties)
+require("@tessera-ui/core/dist/tessera-ui/tessera-ui.css");
+__exportStar(require("./components/components"), exports);

package/package.json

@@ -1,17 +1,32 @@
 {
   "name": "@tessera-ui/react",
-  "version": "0.4.1",
+  "version": "0.5.0",
   "description": "React wrappers for Tessera UI web components",
-  "main": "dist/index.cjs.js",
+  "main": "dist/cjs/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/cjs/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "sideEffects": [
+    "**/*.css",
+    "./dist/index.js",
+    "./dist/cjs/index.js"
+  ],
   "files": [
-    "dist/"
+    "dist/",
+    "README.md"
   ],
+  "dependencies": {
+    "@tessera-ui/core": "^0.5.0"
+  },
   "peerDependencies": {
     "react": ">=17.0.0",
-    "react-dom": ">=17.0.0",
-    "@tessera-ui/core": "0.4.1"
+    "react-dom": ">=17.0.0"
   },
   "devDependencies": {
     "@types/react": "^18.3.0",
@@ -25,6 +40,6 @@
   },
   "license": "MIT",
   "scripts": {
-    "build": "tsc -p tsconfig.json"
+    "build": "tsc -p tsconfig.json && tsc -p tsconfig.cjs.json"
   }
 }