@ark-ui/solid 1.3.0 → 2.0.1

package/source/combobox/combobox-root.jsx

@@ -0,0 +1,57 @@
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props';
+import { ark } from '../factory';
+import { PresenceProvider, splitPresenceProps, usePresence, } from '../presence';
+import { runIfFn } from '../run-if-fn';
+import { ComboboxProvider } from './combobox-context';
+import { useCombobox } from './use-combobox';
+export const ComboboxRoot = (props) => {
+    const [presenceProps, comboboxProps] = splitPresenceProps(props);
+    const [useComboboxProps, localProps] = createSplitProps()(comboboxProps, [
+        'allowCustomValue',
+        'autoFocus',
+        'closeOnSelect',
+        'dir',
+        'disabled',
+        'form',
+        'getRootNode',
+        'highlightedValue',
+        'id',
+        'ids',
+        'inputBehavior',
+        'inputValue',
+        'invalid',
+        'isItemDisabled',
+        'items',
+        'itemToString',
+        'itemToValue',
+        'loop',
+        'multiple',
+        'name',
+        'onFocusOutside',
+        'onHighlightChange',
+        'onInputValueChange',
+        'onInteractOutside',
+        'onOpenChange',
+        'onOpenChange',
+        'onPointerDownOutside',
+        'onValueChange',
+        'openOnClick',
+        'placeholder',
+        'positioning',
+        'readOnly',
+        'selectionBehavior',
+        'selectOnBlur',
+        'translations',
+        'value',
+    ]);
+    const api = useCombobox(useComboboxProps);
+    const apiPresence = usePresence(mergeProps(presenceProps, () => ({ present: api().isOpen })));
+    const mergedProps = mergeProps(() => api().rootProps, localProps);
+    const getChildren = () => runIfFn(localProps.children, api);
+    return (<ComboboxProvider value={api}>
+      <PresenceProvider value={apiPresence}>
+        <ark.div {...mergedProps}>{getChildren()}</ark.div>
+      </PresenceProvider>
+    </ComboboxProvider>);
+};

package/source/combobox/combobox.jsx

@@ -1,57 +1,14 @@
-import { mergeProps } from '@zag-js/solid';
-import { createSplitProps } from '../create-split-props';
-import { ark } from '../factory';
-import { PresenceProvider, splitPresenceProps, usePresence, } from '../presence';
-import { runIfFn } from '../run-if-fn';
-import { ComboboxProvider } from './combobox-context';
-import { useCombobox } from './use-combobox';
-export const Combobox = (props) => {
-    const [presenceProps, comboboxProps] = splitPresenceProps(props);
-    const [useComboboxProps, localProps] = createSplitProps()(comboboxProps, [
-        'allowCustomValue',
-        'autoFocus',
-        'closeOnSelect',
-        'dir',
-        'disabled',
-        'form',
-        'getRootNode',
-        'highlightedValue',
-        'id',
-        'ids',
-        'inputBehavior',
-        'inputValue',
-        'invalid',
-        'isItemDisabled',
-        'items',
-        'itemToString',
-        'itemToValue',
-        'loop',
-        'multiple',
-        'name',
-        'onFocusOutside',
-        'onHighlightChange',
-        'onInputValueChange',
-        'onInteractOutside',
-        'onOpenChange',
-        'onOpenChange',
-        'onPointerDownOutside',
-        'onValueChange',
-        'openOnClick',
-        'placeholder',
-        'positioning',
-        'readOnly',
-        'selectionBehavior',
-        'selectOnBlur',
-        'translations',
-        'value',
-    ]);
-    const api = useCombobox(useComboboxProps);
-    const apiPresence = usePresence(mergeProps(presenceProps, () => ({ present: api().isOpen })));
-    const mergedProps = mergeProps(() => api().rootProps, localProps);
-    const getChildren = () => runIfFn(localProps.children, api);
-    return (<ComboboxProvider value={api}>
-      <PresenceProvider value={apiPresence}>
-        <ark.div {...mergedProps}>{getChildren()}</ark.div>
-      </PresenceProvider>
-    </ComboboxProvider>);
-};
+import { ComboboxClearTrigger as ClearTrigger } from './combobox-clear-trigger';
+import { ComboboxContent as Content } from './combobox-content';
+import { ComboboxControl as Control } from './combobox-control';
+import { ComboboxInput as Input } from './combobox-input';
+import { ComboboxItem as Item } from './combobox-item';
+import { ComboboxItemGroup as ItemGroup } from './combobox-item-group';
+import { ComboboxItemGroupLabel as ItemGroupLabel } from './combobox-item-group-label';
+import { ComboboxItemIndicator as ItemIndicator } from './combobox-item-indicator';
+import { ComboboxItemText as ItemText } from './combobox-item-text';
+import { ComboboxLabel as Label } from './combobox-label';
+import { ComboboxPositioner as Positioner } from './combobox-positioner';
+import { ComboboxRoot as Root } from './combobox-root';
+import { ComboboxTrigger as Trigger } from './combobox-trigger';
+export { ClearTrigger, Content, Control, Input, Item, ItemGroup, ItemGroupLabel, ItemIndicator, ItemText, Label, Positioner, Root, Trigger, };

package/source/combobox/index.js

@@ -1,4 +1,3 @@
-import { Combobox as ComboboxRoot } from './combobox';
 import { ComboboxClearTrigger } from './combobox-clear-trigger';
 import { ComboboxContent } from './combobox-content';
 import { useComboboxContext } from './combobox-context';
@@ -11,20 +10,7 @@ import { ComboboxItemIndicator } from './combobox-item-indicator';
 import { ComboboxItemText } from './combobox-item-text';
 import { ComboboxLabel } from './combobox-label';
 import { ComboboxPositioner } from './combobox-positioner';
+import { ComboboxRoot } from './combobox-root';
 import { ComboboxTrigger } from './combobox-trigger';
-const Combobox = Object.assign(ComboboxRoot, {
-    Root: ComboboxRoot,
-    ClearTrigger: ComboboxClearTrigger,
-    Content: ComboboxContent,
-    Control: ComboboxControl,
-    Input: ComboboxInput,
-    Item: ComboboxItem,
-    ItemGroup: ComboboxItemGroup,
-    ItemGroupLabel: ComboboxItemGroupLabel,
-    ItemIndicator: ComboboxItemIndicator,
-    ItemText: ComboboxItemText,
-    Label: ComboboxLabel,
-    Positioner: ComboboxPositioner,
-    Trigger: ComboboxTrigger,
-});
-export { Combobox, ComboboxClearTrigger, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxItemGroup, ComboboxItemGroupLabel, ComboboxItemIndicator, ComboboxItemText, ComboboxLabel, ComboboxPositioner, ComboboxTrigger, useComboboxContext, };
+export * as Combobox from './combobox';
+export { ComboboxClearTrigger, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxItemGroup, ComboboxItemGroupLabel, ComboboxItemIndicator, ComboboxItemText, ComboboxLabel, ComboboxPositioner, ComboboxRoot, ComboboxTrigger, useComboboxContext, };

package/source/date-picker/date-picker-root.jsx

@@ -0,0 +1,52 @@
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props';
+import { ark } from '../factory';
+import { PresenceProvider, splitPresenceProps, usePresence, } from '../presence';
+import { runIfFn } from '../run-if-fn';
+import { DatePickerProvider } from './date-picker-context';
+import { useDatePicker } from './use-date-picker';
+export const DatePickerRoot = (props) => {
+    const [presenceProps, datePickerProps] = splitPresenceProps(props);
+    const [useDatePickerProps, localProps] = createSplitProps()(datePickerProps, [
+        'closeOnSelect',
+        'dir',
+        'disabled',
+        'fixedWeeks',
+        'focusedValue',
+        'format',
+        'getRootNode',
+        'id',
+        'ids',
+        'isDateUnavailable',
+        'isDateUnavailable',
+        'locale',
+        'max',
+        'min',
+        'modal',
+        'name',
+        'numOfMonths',
+        'onFocusChange',
+        'onOpenChange',
+        'onValueChange',
+        'onViewChange',
+        'open',
+        'parse',
+        'positioning',
+        'readOnly',
+        'selectionMode',
+        'startOfWeek',
+        'timeZone',
+        'translations',
+        'value',
+        'view',
+    ]);
+    const api = useDatePicker(useDatePickerProps);
+    const apiPresence = usePresence(mergeProps(presenceProps, () => ({ present: api().isOpen })));
+    const mergedProps = mergeProps(() => api().rootProps, localProps);
+    const getChildren = () => runIfFn(localProps.children, api);
+    return (<DatePickerProvider value={api}>
+      <PresenceProvider value={apiPresence}>
+        <ark.div {...mergedProps}>{getChildren()}</ark.div>
+      </PresenceProvider>
+    </DatePickerProvider>);
+};

package/source/date-picker/date-picker.jsx

@@ -1,52 +1,24 @@
-import { mergeProps } from '@zag-js/solid';
-import { createSplitProps } from '../create-split-props';
-import { ark } from '../factory';
-import { PresenceProvider, splitPresenceProps, usePresence, } from '../presence';
-import { runIfFn } from '../run-if-fn';
-import { DatePickerProvider } from './date-picker-context';
-import { useDatePicker } from './use-date-picker';
-export const DatePicker = (props) => {
-    const [presenceProps, datePickerProps] = splitPresenceProps(props);
-    const [useDatePickerProps, localProps] = createSplitProps()(datePickerProps, [
-        'closeOnSelect',
-        'dir',
-        'disabled',
-        'fixedWeeks',
-        'focusedValue',
-        'format',
-        'getRootNode',
-        'id',
-        'ids',
-        'isDateUnavailable',
-        'isDateUnavailable',
-        'locale',
-        'max',
-        'min',
-        'modal',
-        'name',
-        'numOfMonths',
-        'onFocusChange',
-        'onOpenChange',
-        'onValueChange',
-        'onViewChange',
-        'open',
-        'parse',
-        'positioning',
-        'readOnly',
-        'selectionMode',
-        'startOfWeek',
-        'timeZone',
-        'translations',
-        'value',
-        'view',
-    ]);
-    const api = useDatePicker(useDatePickerProps);
-    const apiPresence = usePresence(mergeProps(presenceProps, () => ({ present: api().isOpen })));
-    const mergedProps = mergeProps(() => api().rootProps, localProps);
-    const getChildren = () => runIfFn(localProps.children, api);
-    return (<DatePickerProvider value={api}>
-      <PresenceProvider value={apiPresence}>
-        <ark.div {...mergedProps}>{getChildren()}</ark.div>
-      </PresenceProvider>
-    </DatePickerProvider>);
-};
+import { DatePickerClearTrigger as ClearTrigger } from './date-picker-clear-trigger';
+import { DatePickerContent as Content } from './date-picker-content';
+import { DatePickerControl as Control } from './date-picker-control';
+import { DatePickerInput as Input } from './date-picker-input';
+import { DatePickerLabel as Label } from './date-picker-label';
+import { DatePickerMonthSelect as MonthSelect } from './date-picker-month-select';
+import { DatePickerNextTrigger as NextTrigger } from './date-picker-next-trigger';
+import { DatePickerPositioner as Positioner } from './date-picker-positioner';
+import { DatePickerPrevTrigger as PrevTrigger } from './date-picker-prev-trigger';
+import { DatePickerRangeText as RangeText } from './date-picker-range-text';
+import { DatePickerRoot as Root } from './date-picker-root';
+import { DatePickerTable as Table } from './date-picker-table';
+import { DatePickerTableBody as TableBody } from './date-picker-table-body';
+import { DatePickerTableCell as TableCell } from './date-picker-table-cell';
+import { DatePickerTableCellTrigger as TableCellTrigger } from './date-picker-table-cell-trigger';
+import { DatePickerTableHead as TableHead } from './date-picker-table-head';
+import { DatePickerTableHeader as TableHeader } from './date-picker-table-header';
+import { DatePickerTableRow as TableRow } from './date-picker-table-row';
+import { DatePickerTrigger as Trigger } from './date-picker-trigger';
+import { DatePickerView as View } from './date-picker-view';
+import { DatePickerViewControl as ViewControl } from './date-picker-view-control';
+import { DatePickerViewTrigger as ViewTrigger } from './date-picker-view-trigger';
+import { DatePickerYearSelect as YearSelect } from './date-picker-year-select';
+export { ClearTrigger, Content, Control, Input, Label, MonthSelect, NextTrigger, Positioner, PrevTrigger, RangeText, Root, Table, TableBody, TableCell, TableCellTrigger, TableHead, TableHeader, TableRow, Trigger, View, ViewControl, ViewTrigger, YearSelect, };

package/source/date-picker/index.js

@@ -1,4 +1,3 @@
-import { DatePicker as DatePickerRoot } from './date-picker';
 import { DatePickerClearTrigger, } from './date-picker-clear-trigger';
 import { DatePickerContent } from './date-picker-content';
 import { useDatePickerContext } from './date-picker-context';
@@ -10,6 +9,7 @@ import { DatePickerNextTrigger } from './date-picker-next-trigger';
 import { DatePickerPositioner } from './date-picker-positioner';
 import { DatePickerPrevTrigger } from './date-picker-prev-trigger';
 import { DatePickerRangeText } from './date-picker-range-text';
+import { DatePickerRoot } from './date-picker-root';
 import { DatePickerTable } from './date-picker-table';
 import { DatePickerTableBody } from './date-picker-table-body';
 import { DatePickerTableCell } from './date-picker-table-cell';
@@ -25,29 +25,5 @@ import { useDatePickerViewContext } from './date-picker-view-context';
 import { DatePickerViewControl } from './date-picker-view-control';
 import { DatePickerViewTrigger } from './date-picker-view-trigger';
 import { DatePickerYearSelect } from './date-picker-year-select';
-const DatePicker = Object.assign(DatePickerRoot, {
-    Root: DatePickerRoot,
-    ClearTrigger: DatePickerClearTrigger,
-    Content: DatePickerContent,
-    Control: DatePickerControl,
-    Input: DatePickerInput,
-    Label: DatePickerLabel,
-    MonthSelect: DatePickerMonthSelect,
-    NextTrigger: DatePickerNextTrigger,
-    Positioner: DatePickerPositioner,
-    PrevTrigger: DatePickerPrevTrigger,
-    RangeText: DatePickerRangeText,
-    Table: DatePickerTable,
-    TableBody: DatePickerTableBody,
-    TableCell: DatePickerTableCell,
-    TableCellTrigger: DatePickerTableCellTrigger,
-    TableHead: DatePickerTableHead,
-    TableHeader: DatePickerTableHeader,
-    TableRow: DatePickerTableRow,
-    Trigger: DatePickerTrigger,
-    View: DatePickerView,
-    ViewControl: DatePickerViewControl,
-    ViewTrigger: DatePickerViewTrigger,
-    YearSelect: DatePickerYearSelect,
-});
-export { DatePicker, DatePickerClearTrigger, DatePickerContent, DatePickerControl, DatePickerInput, DatePickerLabel, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerPositioner, DatePickerPrevTrigger, DatePickerRangeText, DatePickerTable, DatePickerTableBody, DatePickerTableCell, DatePickerTableCellTrigger, DatePickerTableHead, DatePickerTableHeader, DatePickerTableRow, DatePickerTrigger, DatePickerView, DatePickerViewControl, DatePickerViewTrigger, DatePickerYearSelect, useDatePickerContext, useDatePickerTableCellContext, useDatePickerTableContext, useDatePickerViewContext, };
+export * as DatePicker from './date-picker';
+export { DatePickerClearTrigger, DatePickerContent, DatePickerControl, DatePickerInput, DatePickerLabel, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerPositioner, DatePickerPrevTrigger, DatePickerRangeText, DatePickerRoot, DatePickerTable, DatePickerTableBody, DatePickerTableCell, DatePickerTableCellTrigger, DatePickerTableHead, DatePickerTableHeader, DatePickerTableRow, DatePickerTrigger, DatePickerView, DatePickerViewControl, DatePickerViewTrigger, DatePickerYearSelect, useDatePickerContext, useDatePickerTableCellContext, useDatePickerTableContext, useDatePickerViewContext, };

package/source/dialog/dialog-root.jsx

@@ -0,0 +1,39 @@
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props';
+import { PresencePropsProvider, PresenceProvider, splitPresenceProps, usePresence, } from '../presence';
+import { runIfFn } from '../run-if-fn';
+import { DialogProvider } from './dialog-context';
+import { useDialog } from './use-dialog';
+export const DialogRoot = (props) => {
+    const [presenceProps, dialogProps] = splitPresenceProps(props);
+    const [useDialogProps, localProps] = createSplitProps()(dialogProps, [
+        'aria-label',
+        'closeOnEscapeKeyDown',
+        'closeOnInteractOutside',
+        'dir',
+        'finalFocusEl',
+        'getRootNode',
+        'id',
+        'ids',
+        'initialFocusEl',
+        'modal',
+        'onEscapeKeyDown',
+        'onFocusOutside',
+        'onInteractOutside',
+        'onOpenChange',
+        'onPointerDownOutside',
+        'open',
+        'preventScroll',
+        'restoreFocus',
+        'role',
+        'trapFocus',
+    ]);
+    const api = useDialog(useDialogProps);
+    const apiPresence = usePresence(mergeProps(presenceProps, () => ({ present: api().isOpen })));
+    const getChildren = () => runIfFn(localProps.children, api);
+    return (<DialogProvider value={api}>
+      <PresencePropsProvider value={presenceProps}>
+        <PresenceProvider value={apiPresence}>{getChildren()}</PresenceProvider>
+      </PresencePropsProvider>
+    </DialogProvider>);
+};

package/source/dialog/dialog-trigger.jsx

@@ -6,6 +6,5 @@ export const DialogTrigger = (props) => {
     const api = useDialogContext();
     const presenceApi = usePresenceContext();
     const mergedProps = mergeProps(() => api().triggerProps, () => ({ 'aria-controls': presenceApi().isUnmounted && null }), props);
-    // @ts-expect-error we want aria-controls to be null to remove them if the popover if lazy mounted
     return <ark.button {...mergedProps}/>;
 };

package/source/dialog/dialog.jsx

@@ -1,39 +1,9 @@
-import { mergeProps } from '@zag-js/solid';
-import { createSplitProps } from '../create-split-props';
-import { PresencePropsProvider, PresenceProvider, splitPresenceProps, usePresence, } from '../presence';
-import { runIfFn } from '../run-if-fn';
-import { DialogProvider } from './dialog-context';
-import { useDialog } from './use-dialog';
-export const Dialog = (props) => {
-    const [presenceProps, dialogProps] = splitPresenceProps(props);
-    const [useDialogProps, localProps] = createSplitProps()(dialogProps, [
-        'aria-label',
-        'closeOnEscapeKeyDown',
-        'closeOnInteractOutside',
-        'dir',
-        'finalFocusEl',
-        'getRootNode',
-        'id',
-        'ids',
-        'initialFocusEl',
-        'modal',
-        'onEscapeKeyDown',
-        'onFocusOutside',
-        'onInteractOutside',
-        'onOpenChange',
-        'onPointerDownOutside',
-        'open',
-        'preventScroll',
-        'restoreFocus',
-        'role',
-        'trapFocus',
-    ]);
-    const api = useDialog(useDialogProps);
-    const apiPresence = usePresence(mergeProps(presenceProps, () => ({ present: api().isOpen })));
-    const getChildren = () => runIfFn(localProps.children, api);
-    return (<DialogProvider value={api}>
-      <PresencePropsProvider value={presenceProps}>
-        <PresenceProvider value={apiPresence}>{getChildren()}</PresenceProvider>
-      </PresencePropsProvider>
-    </DialogProvider>);
-};
+import { DialogBackdrop as Backdrop } from './dialog-backdrop';
+import { DialogCloseTrigger as CloseTrigger } from './dialog-close-trigger';
+import { DialogContent as Content } from './dialog-content';
+import { DialogDescription as Description } from './dialog-description';
+import { DialogPositioner as Positioner } from './dialog-positioner';
+import { DialogRoot as Root } from './dialog-root';
+import { DialogTitle as Title } from './dialog-title';
+import { DialogTrigger as Trigger } from './dialog-trigger';
+export { Backdrop, CloseTrigger, Content, Description, Positioner, Root, Title, Trigger };

package/source/dialog/index.js

@@ -1,20 +1,11 @@
-import { Dialog as DialogRoot } from './dialog';
 import { DialogBackdrop } from './dialog-backdrop';
 import { DialogCloseTrigger } from './dialog-close-trigger';
 import { DialogContent } from './dialog-content';
 import { useDialogContext } from './dialog-context';
 import { DialogDescription } from './dialog-description';
 import { DialogPositioner } from './dialog-positioner';
+import { DialogRoot } from './dialog-root';
 import { DialogTitle } from './dialog-title';
 import { DialogTrigger } from './dialog-trigger';
-const Dialog = Object.assign(DialogRoot, {
-    Root: DialogRoot,
-    Backdrop: DialogBackdrop,
-    CloseTrigger: DialogCloseTrigger,
-    Positioner: DialogPositioner,
-    Content: DialogContent,
-    Description: DialogDescription,
-    Title: DialogTitle,
-    Trigger: DialogTrigger,
-});
-export { Dialog, DialogBackdrop, DialogCloseTrigger, DialogContent, DialogDescription, DialogPositioner, DialogTitle, DialogTrigger, useDialogContext, };
+export * as Dialog from './dialog';
+export { DialogBackdrop, DialogCloseTrigger, DialogContent, DialogDescription, DialogPositioner, DialogRoot, DialogTitle, DialogTrigger, useDialogContext, };

package/source/editable/editable-root.jsx

@@ -0,0 +1,42 @@
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props';
+import { ark } from '../factory';
+import { runIfFn } from '../run-if-fn';
+import { EditableProvider } from './editable-context';
+import { useEditable } from './use-editable';
+export const EditableRoot = (props) => {
+    const [useEditableProps, localProps] = createSplitProps()(props, [
+        'activationMode',
+        'autoResize',
+        'dir',
+        'disabled',
+        'finalFocusEl',
+        'form',
+        'getRootNode',
+        'id',
+        'ids',
+        'invalid',
+        'maxLength',
+        'name',
+        'onEdit',
+        'onFocusOutside',
+        'onInteractOutside',
+        'onPointerDownOutside',
+        'onValueChange',
+        'onValueCommit',
+        'onValueRevert',
+        'placeholder',
+        'readOnly',
+        'selectOnFocus',
+        'startWithEditView',
+        'submitMode',
+        'translations',
+        'value',
+    ]);
+    const api = useEditable(useEditableProps);
+    const mergedProps = mergeProps(() => api().rootProps, localProps);
+    const getChildren = () => runIfFn(localProps.children, api);
+    return (<EditableProvider value={api}>
+      <ark.div {...mergedProps}>{getChildren()}</ark.div>
+    </EditableProvider>);
+};

package/source/editable/editable.jsx

@@ -1,42 +1,10 @@
-import { mergeProps } from '@zag-js/solid';
-import { createSplitProps } from '../create-split-props';
-import { ark } from '../factory';
-import { runIfFn } from '../run-if-fn';
-import { EditableProvider } from './editable-context';
-import { useEditable } from './use-editable';
-export const Editable = (props) => {
-    const [useEditableProps, localProps] = createSplitProps()(props, [
-        'activationMode',
-        'autoResize',
-        'dir',
-        'disabled',
-        'finalFocusEl',
-        'form',
-        'getRootNode',
-        'id',
-        'ids',
-        'invalid',
-        'maxLength',
-        'name',
-        'onEdit',
-        'onFocusOutside',
-        'onInteractOutside',
-        'onPointerDownOutside',
-        'onValueChange',
-        'onValueCommit',
-        'onValueRevert',
-        'placeholder',
-        'readOnly',
-        'selectOnFocus',
-        'startWithEditView',
-        'submitMode',
-        'translations',
-        'value',
-    ]);
-    const api = useEditable(useEditableProps);
-    const mergedProps = mergeProps(() => api().rootProps, localProps);
-    const getChildren = () => runIfFn(localProps.children, api);
-    return (<EditableProvider value={api}>
-      <ark.div {...mergedProps}>{getChildren()}</ark.div>
-    </EditableProvider>);
-};
+import { EditableArea as Area } from './editable-area';
+import { EditableCancelTrigger as CancelTrigger } from './editable-cancel-trigger';
+import { EditableControl as Control } from './editable-control';
+import { EditableEditTrigger as EditTrigger } from './editable-edit-trigger';
+import { EditableInput as Input } from './editable-input';
+import { EditableLabel as Label } from './editable-label';
+import { EditablePreview as Preview } from './editable-preview';
+import { EditableRoot as Root } from './editable-root';
+import { EditableSubmitTrigger as SubmitTrigger } from './editable-submit-trigger';
+export { Area, CancelTrigger, Control, EditTrigger, Input, Label, Preview, Root, SubmitTrigger };

package/source/editable/index.js

@@ -1,4 +1,3 @@
-import { Editable as EditableRoot } from './editable';
 import { EditableArea } from './editable-area';
 import { EditableCancelTrigger } from './editable-cancel-trigger';
 import { useEditableContext } from './editable-context';
@@ -7,16 +6,7 @@ import { EditableEditTrigger } from './editable-edit-trigger';
 import { EditableInput } from './editable-input';
 import { EditableLabel } from './editable-label';
 import { EditablePreview } from './editable-preview';
+import { EditableRoot } from './editable-root';
 import { EditableSubmitTrigger } from './editable-submit-trigger';
-const Editable = Object.assign(EditableRoot, {
-    Root: EditableRoot,
-    Area: EditableArea,
-    CancelTrigger: EditableCancelTrigger,
-    Control: EditableControl,
-    EditTrigger: EditableEditTrigger,
-    Input: EditableInput,
-    Label: EditableLabel,
-    Preview: EditablePreview,
-    SubmitTrigger: EditableSubmitTrigger,
-});
-export { Editable, EditableArea, EditableCancelTrigger, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableSubmitTrigger, useEditableContext, };
+export * as Editable from './editable';
+export { EditableArea, EditableCancelTrigger, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableRoot, EditableSubmitTrigger, useEditableContext, };

package/source/environment/index.js

@@ -1,6 +1,3 @@
-import { Environment as EnvironmentRoot } from './environment';
+import { Environment } from './environment';
 import { useEnvironmentContext } from './environment-context';
-const Environment = Object.assign(EnvironmentRoot, {
-    Root: EnvironmentRoot,
-});
 export { Environment, useEnvironmentContext };

package/source/factory.jsx

@@ -1,35 +1,22 @@
-import { children, createEffect, splitProps, } from 'solid-js';
+import { splitProps } from 'solid-js';
 import { Dynamic } from 'solid-js/web';
-import { spread } from './spread';
-import { ssrSpread } from './ssr-spread';
-function withAsChild(Component) {
-    return function jsx(props) {
-        const [localProps, restProps] = splitProps(props, ['asChild', 'children']);
-        if (!localProps.asChild) {
-            return (<Dynamic component={Component} {...restProps}>
-          {localProps.children}
-        </Dynamic>);
-        }
-        const getChildren = children(() => ssrSpread(localProps.children, restProps));
-        createEffect(() => {
-            const children = getChildren();
-            if (children instanceof HTMLElement || children instanceof SVGElement) {
-                spread(children, restProps);
-            }
-        });
-        return getChildren;
+export const withAsProp = (Component) => {
+    const ArkComponent = (props) => {
+        const [localProps, otherProps] = splitProps(props, ['as']);
+        return <Dynamic component={localProps.as || Component} {...otherProps}/>;
     };
-}
+    return ArkComponent;
+};
 function jsxFactory() {
     const cache = new Map();
-    return new Proxy(withAsChild, {
+    return new Proxy(withAsProp, {
         apply(target, thisArg, argArray) {
-            return withAsChild(argArray[0]);
+            return withAsProp(argArray[0]);
         },
         get(_, element) {
             const asElement = element;
             if (!cache.has(asElement)) {
-                cache.set(asElement, withAsChild(asElement));
+                cache.set(asElement, withAsProp(asElement));
             }
             return cache.get(asElement);
         },