@ark-ui/solid 0.6.0 → 0.7.0

package/segment-group/segment-label.cjs

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const factory = require('../factory.cjs');
+const segmentContext = require('./segment-context.cjs');
+const segmentGroupContext = require('./segment-group-context.cjs');
+const segmentGroup_anatomy = require('./segment-group.anatomy.cjs');
+
+const SegmentLabel = props => {
+  const api = segmentGroupContext.useSegmentGroupContext();
+  const segmentParams = segmentContext.useSegmentContext();
+  const labelProps = solid.mergeProps(() => api().getRadioLabelProps(segmentParams), props);
+  return web.createComponent(factory.ark.span, web.mergeProps(labelProps, () => segmentGroup_anatomy.parts.radioLabel.attrs));
+};
+
+exports.SegmentLabel = SegmentLabel;

package/segment-group/segment-label.d.ts

@@ -0,0 +1,4 @@
+import type { JSX } from 'solid-js';
+import { type HTMLArkProps } from '../factory';
+export type SegmentLabelProps = HTMLArkProps<'span'>;
+export declare const SegmentLabel: (props: SegmentLabelProps) => JSX.Element;

package/segment-group/segment-label.mjs

@@ -0,0 +1,15 @@
+import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
+import { useSegmentContext } from './segment-context.mjs';
+import { useSegmentGroupContext } from './segment-group-context.mjs';
+import { parts } from './segment-group.anatomy.mjs';
+
+const SegmentLabel = props => {
+  const api = useSegmentGroupContext();
+  const segmentParams = useSegmentContext();
+  const labelProps = mergeProps(() => api().getRadioLabelProps(segmentParams), props);
+  return createComponent(ark.span, mergeProps$1(labelProps, () => parts.radioLabel.attrs));
+};
+
+export { SegmentLabel };

package/segment-group/segment.cjs

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const segmentContext = require('./segment-context.cjs');
+const segmentGroupContext = require('./segment-group-context.cjs');
+const segmentGroup_anatomy = require('./segment-group.anatomy.cjs');
+
+const Segment = props => {
+  const [contextProps, restProps] = createSplitProps.createSplitProps()(props, ['value', 'disabled', 'invalid', 'readOnly']);
+  const api = segmentGroupContext.useSegmentGroupContext();
+  const rootProps = solid.mergeProps(() => api().getRadioProps(contextProps), restProps);
+  return web.createComponent(segmentContext.SegmentProvider, {
+    value: contextProps,
+    get children() {
+      return web.createComponent(factory.ark.label, web.mergeProps(rootProps, () => segmentGroup_anatomy.parts.radio.attrs));
+    }
+  });
+};
+
+exports.Segment = Segment;

package/segment-group/segment.d.ts

@@ -0,0 +1,6 @@
+import type { JSX } from 'solid-js';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type SegmentContext } from './segment-context';
+export type SegmentProps = Assign<HTMLArkProps<'label'>, SegmentContext>;
+export declare const Segment: (props: SegmentProps) => JSX.Element;

package/segment-group/segment.mjs

@@ -0,0 +1,21 @@
+import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { SegmentProvider } from './segment-context.mjs';
+import { useSegmentGroupContext } from './segment-group-context.mjs';
+import { parts } from './segment-group.anatomy.mjs';
+
+const Segment = props => {
+  const [contextProps, restProps] = createSplitProps()(props, ['value', 'disabled', 'invalid', 'readOnly']);
+  const api = useSegmentGroupContext();
+  const rootProps = mergeProps(() => api().getRadioProps(contextProps), restProps);
+  return createComponent(SegmentProvider, {
+    value: contextProps,
+    get children() {
+      return createComponent(ark.label, mergeProps$1(rootProps, () => parts.radio.attrs));
+    }
+  });
+};
+
+export { Segment };

package/segment-group/use-segment-group.cjs

@@ -0,0 +1,41 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const radio = require('@zag-js/radio-group');
+const solid = require('@zag-js/solid');
+const solidJs = require('solid-js');
+const environmentContext = require('../environment/environment-context.cjs');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const radio__namespace = /*#__PURE__*/_interopNamespaceDefault(radio);
+
+const useSegmentGroup = props => {
+  const getRootNode = environmentContext.useEnvironmentContext();
+  const context = solid.mergeProps({
+    id: solidJs.createUniqueId(),
+    getRootNode
+  }, props);
+  const [state, send] = solid.useMachine(radio__namespace.machine(context), {
+    context
+  });
+  return solidJs.createMemo(() => radio__namespace.connect(state, send, solid.normalizeProps));
+};
+
+exports.useSegmentGroup = useSegmentGroup;

package/segment-group/use-segment-group.d.ts

@@ -0,0 +1,30 @@
+import type { RadioProps, InputProps } from '@zag-js/radio-group/dist/radio-group.types';
+import type { Accessor, JSX } from 'solid-js';
+import * as segment from '@zag-js/radio-group';
+import { type Optional } from '../types';
+export type UseSegmentGroupProps = Optional<segment.Context, 'id'>;
+export type UseSegmentGroupReturn = ReturnType<typeof useSegmentGroup>;
+export declare const useSegmentGroup: (props: UseSegmentGroupProps) => Accessor<{
+    value: string | null;
+    setValue(value: string): void;
+    clearValue(): void;
+    focus: () => void;
+    blur(): void;
+    getRadioState: <T_1 extends RadioProps>(props: T_1) => {
+        isInteractive: boolean;
+        isReadOnly: boolean | undefined;
+        isInvalid: boolean | undefined;
+        isDisabled: boolean | undefined;
+        isChecked: boolean;
+        isFocused: boolean;
+        isHovered: boolean;
+        isActive: boolean;
+    };
+    rootProps: JSX.HTMLAttributes<any>;
+    labelProps: JSX.HTMLAttributes<any>;
+    getRadioProps(props: RadioProps): JSX.LabelHTMLAttributes<HTMLLabelElement>;
+    getRadioLabelProps(props: RadioProps): JSX.HTMLAttributes<any>;
+    getRadioControlProps(props: RadioProps): JSX.HTMLAttributes<any>;
+    getRadioInputProps(props: InputProps): JSX.InputHTMLAttributes<HTMLInputElement>;
+    indicatorProps: JSX.HTMLAttributes<any>;
+}>;

package/segment-group/use-segment-group.mjs

@@ -0,0 +1,18 @@
+import * as radio from '@zag-js/radio-group';
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import { createUniqueId, createMemo } from 'solid-js';
+import { useEnvironmentContext } from '../environment/environment-context.mjs';
+
+const useSegmentGroup = props => {
+  const getRootNode = useEnvironmentContext();
+  const context = mergeProps({
+    id: createUniqueId(),
+    getRootNode
+  }, props);
+  const [state, send] = useMachine(radio.machine(context), {
+    context
+  });
+  return createMemo(() => radio.connect(state, send, normalizeProps));
+};
+
+export { useSegmentGroup };