@tale-ui/react 0.1.0 → 0.2.0

package/checkbox/index.js

@@ -5,5 +5,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Checkbox = void 0;
-var _Checkbox = _interopRequireWildcard(require("./index.parts"));
+var _Checkbox = _interopRequireWildcard(require("./Checkbox.styled"));
 exports.Checkbox = _Checkbox;

package/collapsible/Collapsible.styled.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export declare const Root: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").CollapsibleRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Trigger: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").CollapsibleTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const Panel: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").CollapsiblePanelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/collapsible/Collapsible.styled.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Trigger = exports.Root = exports.Panel = void 0;
+var React = _interopRequireWildcard(require("react"));
+var H = _interopRequireWildcard(require("./index.parts"));
+var _cx = require("../_cx");
+var _jsxRuntime = require("react/jsx-runtime");
+const Root = exports.Root = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Root, {
+  className: (0, _cx.cx)('tale-collapsible', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") Root.displayName = "Root";
+Root.displayName = 'Collapsible.Root';
+const Trigger = exports.Trigger = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Trigger, {
+  className: (0, _cx.cx)('tale-collapsible__trigger', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") Trigger.displayName = "Trigger";
+Trigger.displayName = 'Collapsible.Trigger';
+const Panel = exports.Panel = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Panel, {
+  className: (0, _cx.cx)('tale-collapsible__panel', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") Panel.displayName = "Panel";
+Panel.displayName = 'Collapsible.Panel';

package/collapsible/index.d.ts

@@ -1,4 +1,4 @@
-export * as Collapsible from "./index.parts.js";
+export * as Collapsible from "./Collapsible.styled.js";
 export type * from "./root/CollapsibleRoot.js";
 export type * from "./trigger/CollapsibleTrigger.js";
 export type * from "./panel/CollapsiblePanel.js";

package/collapsible/index.js

@@ -5,5 +5,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Collapsible = void 0;
-var _Collapsible = _interopRequireWildcard(require("./index.parts"));
+var _Collapsible = _interopRequireWildcard(require("./Collapsible.styled"));
 exports.Collapsible = _Collapsible;

package/combobox/Combobox.styled.d.ts

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import * as H from "./index.parts.js";
+import type { ComboboxRootState, ComboboxRootProps, ComboboxRootActions, ComboboxRootChangeEventReason, ComboboxRootChangeEventDetails, ComboboxRootHighlightEventReason, ComboboxRootHighlightEventDetails } from "./root/ComboboxRoot.js";
+export declare const Root: typeof H.Root;
+export declare namespace Root {
+  type Props<Value = any, Multiple extends boolean | undefined = false> = ComboboxRootProps<Value, Multiple>;
+  type State = ComboboxRootState;
+  type Actions = ComboboxRootActions;
+  type ChangeEventReason = ComboboxRootChangeEventReason;
+  type ChangeEventDetails = ComboboxRootChangeEventDetails;
+  type HighlightEventReason = ComboboxRootHighlightEventReason;
+  type HighlightEventDetails = ComboboxRootHighlightEventDetails;
+}
+export declare const Portal: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Backdrop: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Positioner: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Arrow: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxArrowProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Icon: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxIconProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const Value: typeof H.Value;
+export declare const Status: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxStatusProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Trigger: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const List: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxListProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Row: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxRowProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Collection: typeof H.Collection;
+export declare const Clear: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxClearProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const ItemIndicator: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxItemIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const Group: React.ForwardRefExoticComponent<Omit<import("./index.js").ComboboxGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const useFilter: typeof H.useFilter;
+export declare const useFilteredItems: typeof H.useFilteredItems;
+export declare const Input: typeof H.Input;
+export declare const Popup: typeof H.Popup;
+export declare const Item: typeof H.Item;
+export declare const GroupLabel: typeof H.GroupLabel;
+export declare const Empty: typeof H.Empty;
+export declare const Chips: typeof H.Chips;
+export declare const Chip: typeof H.Chip;
+export declare const ChipRemove: typeof H.ChipRemove;
+export { Separator } from "./index.parts.js";

package/combobox/Combobox.styled.js

@@ -0,0 +1,115 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Row = exports.Root = exports.Positioner = exports.Portal = exports.Popup = exports.List = exports.ItemIndicator = exports.Item = exports.Input = exports.Icon = exports.GroupLabel = exports.Group = exports.Empty = exports.Collection = exports.Clear = exports.Chips = exports.ChipRemove = exports.Chip = exports.Backdrop = exports.Arrow = void 0;
+Object.defineProperty(exports, "Separator", {
+  enumerable: true,
+  get: function () {
+    return H.Separator;
+  }
+});
+exports.useFilteredItems = exports.useFilter = exports.Value = exports.Trigger = exports.Status = void 0;
+var React = _interopRequireWildcard(require("react"));
+var H = _interopRequireWildcard(require("./index.parts"));
+var _cx = require("../_cx");
+var _jsxRuntime = require("react/jsx-runtime");
+const Root = exports.Root = H.Root;
+const Portal = exports.Portal = H.Portal;
+const Backdrop = exports.Backdrop = H.Backdrop;
+const Positioner = exports.Positioner = H.Positioner;
+const Arrow = exports.Arrow = H.Arrow;
+const Icon = exports.Icon = H.Icon;
+const Value = exports.Value = H.Value;
+const Status = exports.Status = H.Status;
+const Trigger = exports.Trigger = H.Trigger;
+const List = exports.List = H.List;
+const Row = exports.Row = H.Row;
+const Collection = exports.Collection = H.Collection;
+const Clear = exports.Clear = H.Clear;
+const ItemIndicator = exports.ItemIndicator = H.ItemIndicator;
+const Group = exports.Group = H.Group;
+const useFilter = exports.useFilter = H.useFilter;
+const useFilteredItems = exports.useFilteredItems = H.useFilteredItems;
+const StyledInput = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Input, {
+  className: (0, _cx.cx)('tale-combobox__input', className),
+  ref: ref,
+  ...props
+}));
+StyledInput.displayName = 'Combobox.Input';
+const Input = exports.Input = StyledInput;
+const StyledPopup = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Popup, {
+  className: (0, _cx.cx)('tale-combobox__popup', className),
+  ref: ref,
+  ...props
+}));
+StyledPopup.displayName = 'Combobox.Popup';
+const Popup = exports.Popup = StyledPopup;
+const StyledItem = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Item, {
+  className: (0, _cx.cx)('tale-combobox__item', className),
+  ref: ref,
+  ...props
+}));
+StyledItem.displayName = 'Combobox.Item';
+const Item = exports.Item = StyledItem;
+const StyledGroupLabel = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.GroupLabel, {
+  className: (0, _cx.cx)('tale-combobox__group-label', className),
+  ref: ref,
+  ...props
+}));
+StyledGroupLabel.displayName = 'Combobox.GroupLabel';
+const GroupLabel = exports.GroupLabel = StyledGroupLabel;
+const StyledEmpty = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Empty, {
+  className: (0, _cx.cx)('tale-combobox__empty', className),
+  ref: ref,
+  ...props
+}));
+StyledEmpty.displayName = 'Combobox.Empty';
+const Empty = exports.Empty = StyledEmpty;
+const StyledChips = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Chips, {
+  className: (0, _cx.cx)('tale-combobox__chips', className),
+  ref: ref,
+  ...props
+}));
+StyledChips.displayName = 'Combobox.Chips';
+const Chips = exports.Chips = StyledChips;
+const StyledChip = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Chip, {
+  className: (0, _cx.cx)('tale-combobox__chip', className),
+  ref: ref,
+  ...props
+}));
+StyledChip.displayName = 'Combobox.Chip';
+const Chip = exports.Chip = StyledChip;
+const StyledChipRemove = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.ChipRemove, {
+  className: (0, _cx.cx)('tale-combobox__chip-remove', className),
+  ref: ref,
+  ...props
+}));
+StyledChipRemove.displayName = 'Combobox.ChipRemove';
+const ChipRemove = exports.ChipRemove = StyledChipRemove;

package/combobox/index.d.ts

@@ -1,4 +1,4 @@
-export * as Combobox from "./index.parts.js";
+export * as Combobox from "./Combobox.styled.js";
 export type * from "./root/ComboboxRoot.js";
 export type * from "./trigger/ComboboxTrigger.js";
 export type * from "./input/ComboboxInput.js";

package/combobox/index.js

@@ -5,5 +5,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Combobox = void 0;
-var _Combobox = _interopRequireWildcard(require("./index.parts"));
+var _Combobox = _interopRequireWildcard(require("./Combobox.styled"));
 exports.Combobox = _Combobox;

package/container/Container.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+export declare const CONTAINER_COLORS: readonly ["brand", "random", "red", "orange", "amber", "yellow", "lime", "green", "emerald", "teal", "cyan", "sky", "indigo", "violet", "purple", "fuchsia", "pink", "rose"];
+export type ContainerColor = typeof CONTAINER_COLORS[number];
+export type ContainerProps = React.HTMLAttributes<HTMLDivElement> & {
+  color?: ContainerColor;
+};
+export declare function Container({
+  color,
+  children,
+  style,
+  ...props
+}: ContainerProps): import("react/jsx-runtime").JSX.Element;

package/container/Container.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CONTAINER_COLORS = void 0;
+exports.Container = Container;
+var React = _interopRequireWildcard(require("react"));
+var _color = require("@tale-ui/utils/color");
+var _jsxRuntime = require("react/jsx-runtime");
+const CONTAINER_COLORS = exports.CONTAINER_COLORS = ['brand', 'random', 'red', 'orange', 'amber', 'yellow', 'lime', 'green', 'emerald', 'teal', 'cyan', 'sky', 'indigo', 'violet', 'purple', 'fuchsia', 'pink', 'rose'];
+// Computed once per page load — changes on hard refresh
+const randomBase = (0, _color.randomBaseColor)('named');
+const randomPalette = (0, _color.generatePalette)(randomBase, 'named');
+const randomColorVars = Object.fromEntries(randomPalette.map(({
+  shade,
+  hex
+}) => [`--color-${shade}`, hex]));
+function getColorVars(color) {
+  if (color === 'brand') return undefined;
+  if (color === 'random') return randomColorVars;
+  return Object.fromEntries(_color.NAMED_SHADES.map(shade => [`--color-${shade}`, `var(--${color}-${shade})`]));
+}
+function Container({
+  color = 'brand',
+  children,
+  style,
+  ...props
+}) {
+  const colorVars = getColorVars(color);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    style: {
+      ...colorVars,
+      ...style
+    },
+    ...props,
+    children: children
+  });
+}

package/container/index.d.ts

@@ -0,0 +1,2 @@
+export { Container, CONTAINER_COLORS } from "./Container.js";
+export type { ContainerColor, ContainerProps } from "./Container.js";

package/container/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "CONTAINER_COLORS", {
+  enumerable: true,
+  get: function () {
+    return _Container.CONTAINER_COLORS;
+  }
+});
+Object.defineProperty(exports, "Container", {
+  enumerable: true,
+  get: function () {
+    return _Container.Container;
+  }
+});
+var _Container = require("./Container");

package/context-menu/ContextMenu.styled.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import * as H from "./index.parts.js";
+export declare const Root: typeof H.Root;
+export declare const Trigger: React.ForwardRefExoticComponent<Omit<import("./index.js").ContextMenuTriggerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Portal: React.ForwardRefExoticComponent<Omit<import("./index.js").ContextMenuPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Backdrop: React.ForwardRefExoticComponent<Omit<import("./index.js").ContextMenuBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Positioner: React.ForwardRefExoticComponent<Omit<import("./index.js").ContextMenuPositionerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Arrow: React.ForwardRefExoticComponent<Omit<import("./index.js").ContextMenuArrowProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Group: React.ForwardRefExoticComponent<Omit<import("./index.js").ContextMenuGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const RadioGroup: React.NamedExoticComponent<Omit<import("./index.js").ContextMenuRadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const SubmenuRoot: typeof H.SubmenuRoot;
+export declare const Separator: React.ForwardRefExoticComponent<Omit<import("../index.js").SeparatorProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Popup: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").ContextMenuPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Item: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").ContextMenuItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+export declare const CheckboxItem: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").ContextMenuCheckboxItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+export declare const CheckboxItemIndicator: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").ContextMenuCheckboxItemIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const RadioItem: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").ContextMenuRadioItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+export declare const RadioItemIndicator: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").ContextMenuRadioItemIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export declare const LinkItem: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").ContextMenuLinkItemProps, "ref"> & React.RefAttributes<Element>, "ref"> & React.RefAttributes<Element>>;
+export declare const SubmenuTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").ContextMenuSubmenuTriggerProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+export declare const GroupLabel: React.ForwardRefExoticComponent<Omit<Omit<import("./index.js").ContextMenuGroupLabelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/context-menu/ContextMenu.styled.js

@@ -0,0 +1,111 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Trigger = exports.SubmenuTrigger = exports.SubmenuRoot = exports.Separator = exports.Root = exports.RadioItemIndicator = exports.RadioItem = exports.RadioGroup = exports.Positioner = exports.Portal = exports.Popup = exports.LinkItem = exports.Item = exports.GroupLabel = exports.Group = exports.CheckboxItemIndicator = exports.CheckboxItem = exports.Backdrop = exports.Arrow = void 0;
+var React = _interopRequireWildcard(require("react"));
+var H = _interopRequireWildcard(require("./index.parts"));
+var _cx = require("../_cx");
+var _jsxRuntime = require("react/jsx-runtime");
+const Root = exports.Root = H.Root;
+const Trigger = exports.Trigger = H.Trigger;
+const Portal = exports.Portal = H.Portal;
+const Backdrop = exports.Backdrop = H.Backdrop;
+const Positioner = exports.Positioner = H.Positioner;
+const Arrow = exports.Arrow = H.Arrow;
+const Group = exports.Group = H.Group;
+const RadioGroup = exports.RadioGroup = H.RadioGroup;
+const SubmenuRoot = exports.SubmenuRoot = H.SubmenuRoot;
+const Separator = exports.Separator = H.Separator;
+const Popup = exports.Popup = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Popup, {
+  className: (0, _cx.cx)('tale-menu__popup', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") Popup.displayName = "Popup";
+Popup.displayName = 'ContextMenu.Popup';
+const Item = exports.Item = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Item, {
+  className: (0, _cx.cx)('tale-menu__item', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") Item.displayName = "Item";
+Item.displayName = 'ContextMenu.Item';
+const CheckboxItem = exports.CheckboxItem = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.CheckboxItem, {
+  className: (0, _cx.cx)('tale-menu__checkbox-item', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") CheckboxItem.displayName = "CheckboxItem";
+CheckboxItem.displayName = 'ContextMenu.CheckboxItem';
+const CheckboxItemIndicator = exports.CheckboxItemIndicator = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.CheckboxItemIndicator, {
+  className: (0, _cx.cx)('tale-menu__item-indicator', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") CheckboxItemIndicator.displayName = "CheckboxItemIndicator";
+CheckboxItemIndicator.displayName = 'ContextMenu.CheckboxItemIndicator';
+const RadioItem = exports.RadioItem = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.RadioItem, {
+  className: (0, _cx.cx)('tale-menu__radio-item', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") RadioItem.displayName = "RadioItem";
+RadioItem.displayName = 'ContextMenu.RadioItem';
+const RadioItemIndicator = exports.RadioItemIndicator = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.RadioItemIndicator, {
+  className: (0, _cx.cx)('tale-menu__item-indicator', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") RadioItemIndicator.displayName = "RadioItemIndicator";
+RadioItemIndicator.displayName = 'ContextMenu.RadioItemIndicator';
+const LinkItem = exports.LinkItem = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.LinkItem, {
+  className: (0, _cx.cx)('tale-menu__link-item', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") LinkItem.displayName = "LinkItem";
+LinkItem.displayName = 'ContextMenu.LinkItem';
+const SubmenuTrigger = exports.SubmenuTrigger = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.SubmenuTrigger, {
+  className: (0, _cx.cx)('tale-menu__submenu-trigger', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") SubmenuTrigger.displayName = "SubmenuTrigger";
+SubmenuTrigger.displayName = 'ContextMenu.SubmenuTrigger';
+const GroupLabel = exports.GroupLabel = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.GroupLabel, {
+  className: (0, _cx.cx)('tale-menu__group-label', className),
+  ref: ref,
+  ...props
+}));
+if (process.env.NODE_ENV !== "production") GroupLabel.displayName = "GroupLabel";
+GroupLabel.displayName = 'ContextMenu.GroupLabel';

package/context-menu/index.d.ts

@@ -1,4 +1,4 @@
-export * as ContextMenu from "./index.parts.js";
+export * as ContextMenu from "./ContextMenu.styled.js";
 export type * from "./root/ContextMenuRoot.js";
 export type * from "./trigger/ContextMenuTrigger.js";
 export type { MenuBackdropProps as ContextMenuBackdropProps, MenuBackdropState as ContextMenuBackdropState } from "../menu/backdrop/MenuBackdrop.js";

package/context-menu/index.js

@@ -5,5 +5,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ContextMenu = void 0;
-var _ContextMenu = _interopRequireWildcard(require("./index.parts"));
+var _ContextMenu = _interopRequireWildcard(require("./ContextMenu.styled"));
 exports.ContextMenu = _ContextMenu;

package/context-menu/root/ContextMenuRoot.d.ts

@@ -1,4 +1,3 @@
-import { Menu } from "../../menu/index.js";
 import type { TaleUIChangeEventDetails } from "../../types/index.js";
 import type { MenuRoot } from "../../menu/root/MenuRoot.js";
 /**
@@ -9,7 +8,7 @@ import type { MenuRoot } from "../../menu/root/MenuRoot.js";
  */
 export declare function ContextMenuRoot(props: ContextMenuRoot.Props): import("react/jsx-runtime").JSX.Element;
 export interface ContextMenuRootState {}
-export interface ContextMenuRootProps extends Omit<Menu.Root.Props, 'modal' | 'openOnHover' | 'delay' | 'closeDelay' | 'onOpenChange'> {
+export interface ContextMenuRootProps extends Omit<MenuRoot.Props, 'modal' | 'openOnHover' | 'delay' | 'closeDelay' | 'onOpenChange'> {
   /**
    * Event handler called when the menu is opened or closed.
    */

package/dialog/Dialog.styled.d.ts

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import * as H from "./index.parts.js";
+import type { DialogRootProps, DialogRootActions, DialogRootChangeEventReason, DialogRootChangeEventDetails } from "./root/DialogRoot.js";
+import type { DialogPopupProps, DialogPopupState } from "./popup/DialogPopup.js";
+import type { DialogPortalProps } from "./portal/DialogPortal.js";
+import type { DialogTriggerProps, DialogTriggerState } from "./trigger/DialogTrigger.js";
+export declare const Root: typeof H.Root;
+export declare namespace Root {
+  type Props<Payload = unknown> = DialogRootProps<Payload>;
+  type Actions = DialogRootActions;
+  type ChangeEventReason = DialogRootChangeEventReason;
+  type ChangeEventDetails = DialogRootChangeEventDetails;
+}
+export declare const Portal: React.ForwardRefExoticComponent<Omit<DialogPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare namespace Portal {
+  type Props = DialogPortalProps;
+}
+export declare const Viewport: React.ForwardRefExoticComponent<Omit<import("./index.js").DialogViewportProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Trigger: H.Trigger;
+export declare namespace Trigger {
+  type Props<Payload = unknown> = DialogTriggerProps<Payload>;
+  type State = DialogTriggerState;
+}
+export declare const createHandle: typeof H.createHandle;
+export declare const Handle: typeof H.Handle;
+export declare const Backdrop: typeof H.Backdrop;
+export declare const Popup: typeof H.Popup;
+export declare namespace Popup {
+  type Props = DialogPopupProps;
+  type State = DialogPopupState;
+}
+export declare const Title: typeof H.Title;
+export declare const Description: typeof H.Description;
+export declare const Close: React.ForwardRefExoticComponent<Omit<import("./index.js").DialogCloseProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dialog/Dialog.styled.js

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createHandle = exports.Viewport = exports.Trigger = exports.Title = exports.Root = exports.Portal = exports.Popup = exports.Handle = exports.Description = exports.Close = exports.Backdrop = void 0;
+var React = _interopRequireWildcard(require("react"));
+var H = _interopRequireWildcard(require("./index.parts"));
+var _cx = require("../_cx");
+var _jsxRuntime = require("react/jsx-runtime");
+const Root = exports.Root = H.Root;
+const Portal = exports.Portal = H.Portal;
+const Viewport = exports.Viewport = H.Viewport;
+const Trigger = exports.Trigger = H.Trigger;
+const createHandle = exports.createHandle = H.createHandle;
+const Handle = exports.Handle = H.Handle;
+const StyledBackdrop = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Backdrop, {
+  className: (0, _cx.cx)('tale-dialog__backdrop', className),
+  ref: ref,
+  ...props
+}));
+StyledBackdrop.displayName = 'Dialog.Backdrop';
+const Backdrop = exports.Backdrop = StyledBackdrop;
+const StyledPopup = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Popup, {
+  className: (0, _cx.cx)('tale-dialog__popup', className),
+  ref: ref,
+  ...props
+}));
+StyledPopup.displayName = 'Dialog.Popup';
+const Popup = exports.Popup = StyledPopup;
+const StyledTitle = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Title, {
+  className: (0, _cx.cx)('tale-dialog__title', className),
+  ref: ref,
+  ...props
+}));
+StyledTitle.displayName = 'Dialog.Title';
+const Title = exports.Title = StyledTitle;
+const StyledDescription = /*#__PURE__*/React.forwardRef(({
+  className,
+  ...props
+}, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(H.Description, {
+  className: (0, _cx.cx)('tale-dialog__description', className),
+  ref: ref,
+  ...props
+}));
+StyledDescription.displayName = 'Dialog.Description';
+const Description = exports.Description = StyledDescription;
+const Close = exports.Close = H.Close;

package/dialog/index.d.ts

@@ -1,4 +1,4 @@
-export * as Dialog from "./index.parts.js";
+export * as Dialog from "./Dialog.styled.js";
 export type * from "./root/DialogRoot.js";
 export type * from "./trigger/DialogTrigger.js";
 export type * from "./portal/DialogPortal.js";

package/dialog/index.js

@@ -5,5 +5,5 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Dialog = void 0;
-var _Dialog = _interopRequireWildcard(require("./index.parts"));
+var _Dialog = _interopRequireWildcard(require("./Dialog.styled"));
 exports.Dialog = _Dialog;

package/drawer/Drawer.styled.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import * as H from "./index.parts.js";
+import type { DrawerRootProps, DrawerRootActions, DrawerRootChangeEventReason, DrawerRootChangeEventDetails, DrawerRootSnapPointChangeEventReason, DrawerRootSnapPointChangeEventDetails } from "./root/DrawerRoot.js";
+import type { DrawerSnapPoint } from "./root/DrawerRootContext.js";
+export declare const Root: typeof H.Root;
+export declare namespace Root {
+  type Props<Payload = unknown> = DrawerRootProps<Payload>;
+  type Actions = DrawerRootActions;
+  type ChangeEventReason = DrawerRootChangeEventReason;
+  type ChangeEventDetails = DrawerRootChangeEventDetails;
+  type SnapPointChangeEventReason = DrawerRootSnapPointChangeEventReason;
+  type SnapPointChangeEventDetails = DrawerRootSnapPointChangeEventDetails;
+  type SnapPoint = DrawerSnapPoint;
+}
+export declare const Portal: H.Portal;
+export declare const Viewport: React.ForwardRefExoticComponent<Omit<import("./index.js").DrawerViewportProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Trigger: H.Trigger;
+export declare const Provider: typeof H.Provider;
+export declare const Indent: React.ForwardRefExoticComponent<Omit<import("./index.js").DrawerIndentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const IndentBackground: React.ForwardRefExoticComponent<Omit<import("./index.js").DrawerIndentBackgroundProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const createHandle: typeof H.createHandle;
+export declare const Handle: typeof H.Handle;
+export declare const Backdrop: typeof H.Backdrop;
+export declare const Popup: typeof H.Popup;
+export declare const Content: typeof H.Content;
+export declare const Title: typeof H.Title;
+export declare const Description: typeof H.Description;
+export declare const Close: H.Close;