@ark-ui/solid
Version:
A collection of unstyled, accessible UI components for Solid, utilizing state machines for seamless interaction.
108 lines (102 loc) • 3.87 kB
JavaScript
import { useFieldContext } from './GBGTOFYC.js';
import { createSplitProps } from './ZMHI4GDJ.js';
import { ark } from './EPLBB4QN.js';
import { useEnvironmentContext } from './5QLLQM7E.js';
import { useLocaleContext } from './RVOPDSQY.js';
import { runIfFn } from './DT73WLR4.js';
import { createContext } from './THN5C4U6.js';
import { __export } from './ESLJRKWD.js';
import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
import * as zagSwitch from '@zag-js/switch';
import { createUniqueId, createMemo } from 'solid-js';
// src/components/switch/use-switch-context.ts
var [SwitchProvider, useSwitchContext] = createContext({
hookName: "useSwitchContext",
providerName: "<SwitchProvider />"
});
// src/components/switch/switch-context.tsx
var SwitchContext = (props) => props.children(useSwitchContext());
var SwitchControl = (props) => {
const api = useSwitchContext();
const mergedProps = mergeProps(() => api().getControlProps(), props);
return createComponent(ark.span, mergedProps);
};
var SwitchHiddenInput = (props) => {
const api = useSwitchContext();
const mergedProps = mergeProps(() => api().getHiddenInputProps(), props);
const field = useFieldContext();
return createComponent(ark.input, mergeProps$1({
get ["aria-describedby"]() {
return field?.().ariaDescribedby;
}
}, mergedProps));
};
var SwitchLabel = (props) => {
const api = useSwitchContext();
const mergedProps = mergeProps(() => api().getLabelProps(), props);
return createComponent(ark.span, mergedProps);
};
var useSwitch = (props) => {
const id = createUniqueId();
const locale = useLocaleContext();
const environment = useEnvironmentContext();
const field = useFieldContext();
const machineProps = createMemo(() => ({
id,
ids: {
label: field?.().ids.label,
hiddenInput: field?.().ids.control
},
disabled: field?.().disabled,
readOnly: field?.().readOnly,
invalid: field?.().invalid,
required: field?.().required,
dir: locale().dir,
getRootNode: environment().getRootNode,
...runIfFn(props)
}));
const service = useMachine(zagSwitch.machine, machineProps);
return createMemo(() => zagSwitch.connect(service, normalizeProps));
};
// src/components/switch/switch-root.tsx
var SwitchRoot = (props) => {
const [switchProps, localProps] = createSplitProps()(props, ["checked", "defaultChecked", "disabled", "form", "id", "ids", "invalid", "label", "name", "onCheckedChange", "readOnly", "required", "value"]);
const api = useSwitch(switchProps);
const mergedProps = mergeProps(() => api().getRootProps(), localProps);
return createComponent(SwitchProvider, {
value: api,
get children() {
return createComponent(ark.label, mergedProps);
}
});
};
var SwitchRootProvider = (props) => {
const [{
value: api
}, localProps] = createSplitProps()(props, ["value"]);
const mergedProps = mergeProps(() => api().getRootProps(), localProps);
return createComponent(SwitchProvider, {
value: api,
get children() {
return createComponent(ark.label, mergedProps);
}
});
};
var SwitchThumb = (props) => {
const api = useSwitchContext();
const mergedProps = mergeProps(() => api().getThumbProps(), props);
return createComponent(ark.span, mergedProps);
};
// src/components/switch/switch.ts
var switch_exports = {};
__export(switch_exports, {
Context: () => SwitchContext,
Control: () => SwitchControl,
HiddenInput: () => SwitchHiddenInput,
Label: () => SwitchLabel,
Root: () => SwitchRoot,
RootProvider: () => SwitchRootProvider,
Thumb: () => SwitchThumb
});
export { SwitchContext, SwitchControl, SwitchHiddenInput, SwitchLabel, SwitchRoot, SwitchRootProvider, SwitchThumb, switch_exports, useSwitch, useSwitchContext };