@ark-ui/solid 2.1.0 → 2.1.1

package/CHANGELOG.md

@@ -6,6 +6,12 @@ description: All notable changes to this project will be documented in this file
 
 ## [Unreleased]
 
+## [2.1.1] - 2024-02-16
+
+### Fixed
+
+- Resolved an issue where the `Clipboard` component was not exported correctly.
+
 ## [2.1.0] - 2024-02-14
 
 ### Added

package/cjs/index.js

@@ -9,6 +9,7 @@ var avatar$1 = require('@zag-js/avatar');
 var anatomy = require('@ark-ui/anatomy');
 var carousel$1 = require('@zag-js/carousel');
 var checkbox$1 = require('@zag-js/checkbox');
+var clipboard$1 = require('@zag-js/clipboard');
 var colorPicker$1 = require('@zag-js/color-picker');
 var combobox$1 = require('@zag-js/combobox');
 var datePicker$1 = require('@zag-js/date-picker');
@@ -16,6 +17,7 @@ var dialog$1 = require('@zag-js/dialog');
 var editable$1 = require('@zag-js/editable');
 var fileUpload$1 = require('@zag-js/file-upload');
 var hoverCard$1 = require('@zag-js/hover-card');
+var i18nUtils = require('@zag-js/i18n-utils');
 var menu$1 = require('@zag-js/menu');
 var numberInput$1 = require('@zag-js/number-input');
 var pagination$1 = require('@zag-js/pagination');
@@ -57,6 +59,7 @@ var accordion__namespace = /*#__PURE__*/_interopNamespaceDefault(accordion$1);
 var avatar__namespace = /*#__PURE__*/_interopNamespaceDefault(avatar$1);
 var carousel__namespace = /*#__PURE__*/_interopNamespaceDefault(carousel$1);
 var checkbox__namespace = /*#__PURE__*/_interopNamespaceDefault(checkbox$1);
+var clipboard__namespace = /*#__PURE__*/_interopNamespaceDefault(clipboard$1);
 var colorPicker__namespace = /*#__PURE__*/_interopNamespaceDefault(colorPicker$1);
 var combobox__namespace = /*#__PURE__*/_interopNamespaceDefault(combobox$1);
 var datePicker__namespace = /*#__PURE__*/_interopNamespaceDefault(datePicker$1);
@@ -535,6 +538,98 @@ var checkbox = /*#__PURE__*/Object.freeze({
   Root: CheckboxRoot
 });
 
+const [ClipboardProvider, useClipboardContext] = createContext({
+  hookName: 'useClipboardContext',
+  providerName: '<ClipboardProvider />'
+});
+
+const ClipboardControl = props => {
+  const api = useClipboardContext();
+  const mergedProps = solid.mergeProps(() => api().controlProps, props);
+  return web.createComponent(ark.div, mergedProps);
+};
+
+const ClipboardIndicator = props => {
+  const [indicatorProps, localProps] = createSplitProps()(props, ['copied']);
+  const api = useClipboardContext();
+  const mergedProps = solid.mergeProps(api().getIndicatorProps({
+    copied: api().isCopied
+  }), localProps);
+  const getChildren = solidJs.children(() => localProps.children);
+  return web.createComponent(ark.div, web.mergeProps(mergedProps, {
+    get children() {
+      return web.createComponent(solidJs.Show, {
+        get when() {
+          return api().isCopied;
+        },
+        get fallback() {
+          return getChildren();
+        },
+        get children() {
+          return indicatorProps.copied;
+        }
+      });
+    }
+  }));
+};
+
+const ClipboardInput = props => {
+  const api = useClipboardContext();
+  const mergedProps = solid.mergeProps(() => api().inputProps, props);
+  return web.createComponent(ark.input, mergedProps);
+};
+
+const ClipboardLabel = props => {
+  const api = useClipboardContext();
+  const mergedProps = solid.mergeProps(() => api().labelProps, props);
+  return web.createComponent(ark.label, mergedProps);
+};
+
+const useClipboard = props => {
+  const getRootNode = useEnvironmentContext();
+  const context = solid.mergeProps({
+    id: solidJs.createUniqueId(),
+    getRootNode
+  }, props);
+  const [state, send] = solid.useMachine(clipboard__namespace.machine(context), {
+    context
+  });
+  return solidJs.createMemo(() => clipboard__namespace.connect(state, send, solid.normalizeProps));
+};
+
+const ClipboardRoot = props => {
+  const [useClipboardProps, localProps] = createSplitProps()(props, ['getRootNode', 'id', 'ids', 'value', 'timeout', 'onCopyStatusChange']);
+  const api = useClipboard(useClipboardProps);
+  const mergedProps = solid.mergeProps(() => api().rootProps, localProps);
+  const getChildren = () => runIfFn(localProps.children, api);
+  return web.createComponent(ClipboardProvider, {
+    value: api,
+    get children() {
+      return web.createComponent(ark.div, web.mergeProps(mergedProps, {
+        get children() {
+          return getChildren();
+        }
+      }));
+    }
+  });
+};
+
+const ClipboardTrigger = props => {
+  const api = useClipboardContext();
+  const mergedProps = solid.mergeProps(() => api().triggerProps, props);
+  return web.createComponent(ark.button, mergedProps);
+};
+
+var clipboard = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Control: ClipboardControl,
+  Indicator: ClipboardIndicator,
+  Input: ClipboardInput,
+  Label: ClipboardLabel,
+  Root: ClipboardRoot,
+  Trigger: ClipboardTrigger
+});
+
 const [ColorPickerAreaProvider, useColorPickerAreaContext] = createContext({
   hookName: 'useColorPickerAreaContext',
   providerName: '<ColorPickerAreaProvider />'
@@ -1818,6 +1913,42 @@ var hoverCard = /*#__PURE__*/Object.freeze({
   Trigger: HoverCardTrigger
 });
 
+const [LocaleContextProvider, useLocaleContext] = createContext({
+  hookName: 'useEnvironmentContext',
+  providerName: '<EnvironmentProvider />',
+  strict: false,
+  defaultValue: () => ({
+    dir: 'ltr',
+    locale: 'en-US'
+  })
+});
+
+const LocaleProvider = props => {
+  const [localeProps, restProps] = solidJs.splitProps(props, ['locale', 'defaultLocale']);
+  const [locale, setLocale] = solidJs.createSignal(localeProps.defaultLocale || localeProps.locale || 'en-US');
+  const getRootNode = useEnvironmentContext();
+  solidJs.createEffect(() => {
+    const cleanup = i18nUtils.trackLocale({
+      locale: localeProps.locale,
+      getRootNode,
+      onLocaleChange(locale) {
+        setLocale(locale.locale);
+      }
+    });
+    solidJs.onCleanup(cleanup);
+  });
+  const context = solidJs.createMemo(() => ({
+    locale: locale(),
+    dir: i18nUtils.isRTL(locale()) ? 'rtl' : 'ltr'
+  }));
+  return web.createComponent(LocaleContextProvider, {
+    value: context,
+    get children() {
+      return restProps.children;
+    }
+  });
+};
+
 const [MenuProvider, useMenuContext] = createContext({
   hookName: 'useMenuContext',
   providerName: '<MenuProvider />',
@@ -3803,6 +3934,13 @@ exports.CheckboxControl = CheckboxControl;
 exports.CheckboxIndicator = CheckboxIndicator;
 exports.CheckboxLabel = CheckboxLabel;
 exports.CheckboxRoot = CheckboxRoot;
+exports.Clipboard = clipboard;
+exports.ClipboardControl = ClipboardControl;
+exports.ClipboardIndicator = ClipboardIndicator;
+exports.ClipboardInput = ClipboardInput;
+exports.ClipboardLabel = ClipboardLabel;
+exports.ClipboardRoot = ClipboardRoot;
+exports.ClipboardTrigger = ClipboardTrigger;
 exports.ColorPicker = colorPicker;
 exports.ColorPickerArea = ColorPickerArea;
 exports.ColorPickerAreaBackground = ColorPickerAreaBackground;
@@ -3905,6 +4043,7 @@ exports.HoverCardContent = HoverCardContent;
 exports.HoverCardPositioner = HoverCardPositioner;
 exports.HoverCardRoot = HoverCardRoot;
 exports.HoverCardTrigger = HoverCardTrigger;
+exports.LocaleProvider = LocaleProvider;
 exports.Menu = menu;
 exports.MenuArrow = MenuArrow;
 exports.MenuArrowTip = MenuArrowTip;
@@ -4070,6 +4209,7 @@ exports.useAccordionItemContext = useAccordionItemContext;
 exports.useAvatarContext = useAvatarContext;
 exports.useCarouselContext = useCarouselContext;
 exports.useCheckboxContext = useCheckboxContext;
+exports.useClipboardContext = useClipboardContext;
 exports.useColorPickerAreaContext = useColorPickerAreaContext;
 exports.useColorPickerChannelSliderContext = useColorPickerChannelSliderContext;
 exports.useColorPickerContext = useColorPickerContext;
@@ -4083,6 +4223,7 @@ exports.useEditableContext = useEditableContext;
 exports.useEnvironmentContext = useEnvironmentContext;
 exports.useFileUploadContext = useFileUploadContext;
 exports.useHoverCardContext = useHoverCardContext;
+exports.useLocaleContext = useLocaleContext;
 exports.useMenuContext = useMenuContext;
 exports.useNumberInputContext = useNumberInputContext;
 exports.usePaginationContext = usePaginationContext;