@sprawlify/solid 0.0.13 → 0.0.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunk-C4aQI7lE.jsx +18 -0
- package/dist/chunk-CKcAJnC7.js +18 -0
- package/dist/collapsible-Cg7zPadX.js +129 -0
- package/dist/collapsible-CjuC6xYl.jsx +117 -0
- package/dist/collection-BiyRTWsX.js +219 -0
- package/dist/collection-BlnS2UQy.jsx +219 -0
- package/dist/components/accordion/index.d.ts +69 -0
- package/dist/components/accordion/index.js +183 -0
- package/dist/components/accordion/index.jsx +157 -0
- package/dist/components/angle-slider/index.d.ts +74 -0
- package/dist/components/angle-slider/index.js +155 -0
- package/dist/components/angle-slider/index.jsx +144 -0
- package/dist/components/avatar/index.d.ts +49 -0
- package/dist/components/avatar/index.js +95 -0
- package/dist/components/avatar/index.jsx +88 -0
- package/dist/components/bottom-sheet/index.d.ts +80 -0
- package/dist/components/bottom-sheet/index.js +218 -0
- package/dist/components/bottom-sheet/index.jsx +177 -0
- package/dist/components/carousel/index.d.ts +98 -0
- package/dist/components/carousel/index.js +207 -0
- package/dist/components/carousel/index.jsx +192 -0
- package/dist/components/checkbox/index.d.ts +138 -0
- package/dist/components/checkbox/index.js +265 -0
- package/dist/components/checkbox/index.jsx +247 -0
- package/dist/components/client-only/index.d.ts +10 -0
- package/dist/components/client-only/index.js +24 -0
- package/dist/components/client-only/index.jsx +15 -0
- package/dist/components/clipboard/index.d.ts +72 -0
- package/dist/components/clipboard/index.js +149 -0
- package/dist/components/clipboard/index.jsx +132 -0
- package/dist/components/collapsible/index.d.ts +60 -0
- package/dist/components/collapsible/index.js +8 -0
- package/dist/components/collapsible/index.jsx +8 -0
- package/dist/components/collection/index.d.ts +3 -0
- package/dist/components/collection/index.js +4 -0
- package/dist/components/collection/index.jsx +4 -0
- package/dist/components/field/index.d.ts +201 -0
- package/dist/components/field/index.js +9 -0
- package/dist/components/field/index.jsx +9 -0
- package/dist/components/fieldset/index.d.ts +109 -0
- package/dist/components/fieldset/index.js +8 -0
- package/dist/components/fieldset/index.jsx +8 -0
- package/dist/components/presence/index.d.ts +5 -0
- package/dist/components/presence/index.js +8 -0
- package/dist/components/presence/index.jsx +8 -0
- package/dist/components/select/index.d.ts +134 -0
- package/dist/components/select/index.js +361 -0
- package/dist/components/select/index.jsx +310 -0
- package/dist/compose-refs-CzyOb8yH.jsx +20 -0
- package/dist/compose-refs-vsrTrt13.js +20 -0
- package/dist/create-context-PS2j4mEo.js +29 -0
- package/dist/create-context-h3cXiEld.jsx +29 -0
- package/dist/create-split-props-CQVsvhvg.jsx +41 -0
- package/dist/factory-B6RK6SH4.d.ts +14 -0
- package/dist/factory-CEdj72aS.js +47 -0
- package/dist/field-C_WuoXOj.js +287 -0
- package/dist/field-CphvciGc.jsx +259 -0
- package/dist/fieldset-BG-0ZqWT.jsx +167 -0
- package/dist/fieldset-D1BO0LmU.js +182 -0
- package/dist/index-B0YoIRC4.d.ts +14 -0
- package/dist/index-C3ATynHc.d.ts +23 -0
- package/dist/index-DXheKbqg.d.ts +76 -0
- package/dist/index-NWiNyxpL.d.ts +38 -0
- package/dist/index-vSwYtc2L.d.ts +38 -0
- package/dist/index.d.ts +40 -19
- package/dist/index.js +5 -415
- package/dist/index.jsx +5 -415
- package/dist/presence-Bfjusgm3.js +79 -0
- package/dist/presence-arWh1hVd.jsx +66 -0
- package/dist/providers-CHqGPEsc.jsx +82 -0
- package/dist/providers-CQkAUunr.js +96 -0
- package/dist/render-strategy-COrlrUuR.js +12 -0
- package/dist/render-strategy-CZDG_yDi.jsx +12 -0
- package/dist/render-strategy-CtRkdWei.d.ts +9 -0
- package/dist/run-if-fn-DRWB51JE.jsx +421 -0
- package/dist/run-if-fn-eYlaegHy.js +421 -0
- package/dist/types-bQRbEioA.d.ts +9 -0
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/index.js +4 -0
- package/dist/utils/index.jsx +4 -0
- package/dist/utils-DYer-9SY.js +0 -0
- package/dist/utils-DrvO4Hk3.jsx +0 -0
- package/package.json +62 -2
|
@@ -0,0 +1,265 @@
|
|
|
1
|
+
import { t as __export } from "../../chunk-CKcAJnC7.js";
|
|
2
|
+
import { a as useMachine, i as mergeProps$2, r as normalizeProps, t as runIfFn } from "../../run-if-fn-eYlaegHy.js";
|
|
3
|
+
import { t as createContext$1 } from "../../create-context-PS2j4mEo.js";
|
|
4
|
+
import { i as useLocaleContext, o as useEnvironmentContext } from "../../providers-CQkAUunr.js";
|
|
5
|
+
import { n as createSplitProps, t as sprawlify } from "../../factory-CEdj72aS.js";
|
|
6
|
+
import "../../compose-refs-vsrTrt13.js";
|
|
7
|
+
import { u as useFieldsetContext } from "../../fieldset-D1BO0LmU.js";
|
|
8
|
+
import { m as useFieldContext } from "../../field-C_WuoXOj.js";
|
|
9
|
+
import { createMemo, createSignal, createUniqueId, untrack } from "solid-js";
|
|
10
|
+
import { createComponent, mergeProps as mergeProps$1 } from "solid-js/web";
|
|
11
|
+
import * as checkbox from "@sprawlify/primitives/machines/checkbox";
|
|
12
|
+
import { anatomy } from "@sprawlify/primitives/machines/checkbox";
|
|
13
|
+
|
|
14
|
+
//#region src/components/checkbox/use-checkbox-context.ts
|
|
15
|
+
const [CheckboxProvider, useCheckboxContext] = createContext$1({
|
|
16
|
+
hookName: "useCheckboxContext",
|
|
17
|
+
providerName: "<CheckboxProvider />"
|
|
18
|
+
});
|
|
19
|
+
|
|
20
|
+
//#endregion
|
|
21
|
+
//#region src/components/checkbox/checkbox-context.tsx
|
|
22
|
+
const CheckboxContext = (props) => props.children(useCheckboxContext());
|
|
23
|
+
|
|
24
|
+
//#endregion
|
|
25
|
+
//#region src/components/checkbox/checkbox-control.tsx
|
|
26
|
+
const CheckboxControl = (props) => {
|
|
27
|
+
const checkbox$1 = useCheckboxContext();
|
|
28
|
+
const mergedProps = mergeProps$2(() => checkbox$1().getControlProps(), props);
|
|
29
|
+
return createComponent(sprawlify.div, mergedProps);
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
//#endregion
|
|
33
|
+
//#region src/components/checkbox/checkbox-anatomy.ts
|
|
34
|
+
const checkboxAnatomy = anatomy.extendWith("group");
|
|
35
|
+
|
|
36
|
+
//#endregion
|
|
37
|
+
//#region src/utils/use-controllable-state.ts
|
|
38
|
+
function useControllableState(props) {
|
|
39
|
+
const [uncontrolledValue, setUncontrolledValue] = createSignal(runIfFn(props.defaultValue));
|
|
40
|
+
const controlled = createMemo(() => props.value?.() !== void 0);
|
|
41
|
+
const currentValue = createMemo(() => controlled() ? props.value?.() : uncontrolledValue());
|
|
42
|
+
const setValue = (next) => {
|
|
43
|
+
untrack(() => {
|
|
44
|
+
const nextValue = runIfFn(next, currentValue());
|
|
45
|
+
if (controlled()) return props.onChange?.(nextValue);
|
|
46
|
+
setUncontrolledValue(nextValue);
|
|
47
|
+
return props.onChange?.(nextValue);
|
|
48
|
+
});
|
|
49
|
+
};
|
|
50
|
+
return [currentValue, setValue];
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
//#endregion
|
|
54
|
+
//#region src/components/checkbox/use-checkbox-group.ts
|
|
55
|
+
function useCheckboxGroup(props = {}) {
|
|
56
|
+
const fieldset = useFieldsetContext();
|
|
57
|
+
const disabled = () => props.disabled ?? fieldset?.()?.disabled;
|
|
58
|
+
const invalid = () => props.invalid ?? fieldset?.()?.invalid;
|
|
59
|
+
const interactive = createMemo(() => !(disabled() || props.readOnly));
|
|
60
|
+
const [value, setValue] = useControllableState({
|
|
61
|
+
value: props.value,
|
|
62
|
+
defaultValue: props.defaultValue || [],
|
|
63
|
+
onChange: props.onValueChange
|
|
64
|
+
});
|
|
65
|
+
return createMemo(() => {
|
|
66
|
+
const isChecked = (val) => {
|
|
67
|
+
return value().some((v) => String(v) === String(val));
|
|
68
|
+
};
|
|
69
|
+
const toggleValue = (val) => {
|
|
70
|
+
isChecked(val) ? removeValue(val) : addValue(val);
|
|
71
|
+
};
|
|
72
|
+
const addValue = (val) => {
|
|
73
|
+
if (!interactive()) return;
|
|
74
|
+
if (isChecked(val)) return;
|
|
75
|
+
setValue(value().concat(val));
|
|
76
|
+
};
|
|
77
|
+
const removeValue = (val) => {
|
|
78
|
+
if (!interactive()) return;
|
|
79
|
+
setValue(value().filter((v) => String(v) !== String(val)));
|
|
80
|
+
};
|
|
81
|
+
const getItemProps = (itemProps) => {
|
|
82
|
+
return {
|
|
83
|
+
checked: itemProps.value != null ? isChecked(itemProps.value) : void 0,
|
|
84
|
+
onCheckedChange() {
|
|
85
|
+
if (itemProps.value != null) toggleValue(itemProps.value);
|
|
86
|
+
},
|
|
87
|
+
name: props.name,
|
|
88
|
+
disabled: disabled(),
|
|
89
|
+
readOnly: props.readOnly,
|
|
90
|
+
invalid: invalid()
|
|
91
|
+
};
|
|
92
|
+
};
|
|
93
|
+
return {
|
|
94
|
+
isChecked,
|
|
95
|
+
value,
|
|
96
|
+
name: props.name,
|
|
97
|
+
disabled: disabled(),
|
|
98
|
+
readOnly: props.readOnly,
|
|
99
|
+
invalid: invalid(),
|
|
100
|
+
setValue,
|
|
101
|
+
addValue,
|
|
102
|
+
toggleValue,
|
|
103
|
+
getItemProps
|
|
104
|
+
};
|
|
105
|
+
});
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
//#endregion
|
|
109
|
+
//#region src/components/checkbox/use-checkbox-group-context.tsx
|
|
110
|
+
const [CheckboxGroupContextProvider, useCheckboxGroupContext] = createContext$1({
|
|
111
|
+
hookName: "useCheckboxGroupContext",
|
|
112
|
+
providerName: "<CheckboxGroupProvider />",
|
|
113
|
+
strict: false
|
|
114
|
+
});
|
|
115
|
+
|
|
116
|
+
//#endregion
|
|
117
|
+
//#region src/components/checkbox/checkbox-group.tsx
|
|
118
|
+
const CheckboxGroup = (props) => {
|
|
119
|
+
const [checkboxGroupProps, localProps] = createSplitProps()(props, [
|
|
120
|
+
"defaultValue",
|
|
121
|
+
"value",
|
|
122
|
+
"onValueChange",
|
|
123
|
+
"disabled",
|
|
124
|
+
"invalid",
|
|
125
|
+
"readOnly",
|
|
126
|
+
"name"
|
|
127
|
+
]);
|
|
128
|
+
return createComponent(CheckboxGroupContextProvider, {
|
|
129
|
+
value: useCheckboxGroup(checkboxGroupProps),
|
|
130
|
+
get children() {
|
|
131
|
+
return createComponent(sprawlify.div, mergeProps$1({ role: "group" }, localProps, () => checkboxAnatomy.build().group.attrs));
|
|
132
|
+
}
|
|
133
|
+
});
|
|
134
|
+
};
|
|
135
|
+
|
|
136
|
+
//#endregion
|
|
137
|
+
//#region src/components/checkbox/checkbox-group-provider.tsx
|
|
138
|
+
const CheckboxGroupProvider = (props) => {
|
|
139
|
+
const [localProps, restProps] = createSplitProps()(props, ["value"]);
|
|
140
|
+
return createComponent(CheckboxGroupContextProvider, {
|
|
141
|
+
get value() {
|
|
142
|
+
return localProps.value;
|
|
143
|
+
},
|
|
144
|
+
get children() {
|
|
145
|
+
return createComponent(sprawlify.div, mergeProps$1({ role: "group" }, restProps, () => checkboxAnatomy.build().group.attrs));
|
|
146
|
+
}
|
|
147
|
+
});
|
|
148
|
+
};
|
|
149
|
+
|
|
150
|
+
//#endregion
|
|
151
|
+
//#region src/components/checkbox/checkbox-hidden-input.tsx
|
|
152
|
+
const CheckboxHiddenInput = (props) => {
|
|
153
|
+
const checkbox$1 = useCheckboxContext();
|
|
154
|
+
const mergedProps = mergeProps$2(() => checkbox$1().getHiddenInputProps(), props);
|
|
155
|
+
const field = useFieldContext();
|
|
156
|
+
return createComponent(sprawlify.input, mergeProps$1({ get ["aria-describedby"]() {
|
|
157
|
+
return field?.().ariaDescribedby;
|
|
158
|
+
} }, mergedProps));
|
|
159
|
+
};
|
|
160
|
+
|
|
161
|
+
//#endregion
|
|
162
|
+
//#region src/components/checkbox/checkbox-indicator.tsx
|
|
163
|
+
const CheckboxIndicator = (props) => {
|
|
164
|
+
const [indicatorProps, localProps] = createSplitProps()(props, ["indeterminate"]);
|
|
165
|
+
const checkbox$1 = useCheckboxContext();
|
|
166
|
+
const mergedProps = mergeProps$2(() => checkbox$1().getIndicatorProps(), localProps);
|
|
167
|
+
return createComponent(sprawlify.div, mergeProps$1(mergedProps, { get hidden() {
|
|
168
|
+
return !(indicatorProps.indeterminate ? checkbox$1().indeterminate : checkbox$1().checked);
|
|
169
|
+
} }));
|
|
170
|
+
};
|
|
171
|
+
|
|
172
|
+
//#endregion
|
|
173
|
+
//#region src/components/checkbox/checkbox-label.tsx
|
|
174
|
+
const CheckboxLabel = (props) => {
|
|
175
|
+
const checkbox$1 = useCheckboxContext();
|
|
176
|
+
const mergedProps = mergeProps$2(() => checkbox$1().getLabelProps(), props);
|
|
177
|
+
return createComponent(sprawlify.span, mergedProps);
|
|
178
|
+
};
|
|
179
|
+
|
|
180
|
+
//#endregion
|
|
181
|
+
//#region src/components/checkbox/use-checkbox.ts
|
|
182
|
+
const useCheckbox = (ownProps = {}) => {
|
|
183
|
+
const checkboxGroup = useCheckboxGroupContext();
|
|
184
|
+
const props = createMemo(() => {
|
|
185
|
+
const resolvedProps = runIfFn(ownProps);
|
|
186
|
+
return mergeProps$2(resolvedProps, checkboxGroup?.().getItemProps({ value: resolvedProps.value }) ?? {});
|
|
187
|
+
});
|
|
188
|
+
const id = createUniqueId();
|
|
189
|
+
const locale = useLocaleContext();
|
|
190
|
+
const environment = useEnvironmentContext();
|
|
191
|
+
const field = useFieldContext();
|
|
192
|
+
const machineProps = createMemo(() => ({
|
|
193
|
+
id,
|
|
194
|
+
ids: {
|
|
195
|
+
label: field?.().ids.label,
|
|
196
|
+
hiddenInput: field?.().ids.control
|
|
197
|
+
},
|
|
198
|
+
disabled: field?.().disabled,
|
|
199
|
+
readOnly: field?.().readOnly,
|
|
200
|
+
invalid: field?.().invalid,
|
|
201
|
+
required: field?.().required,
|
|
202
|
+
dir: locale().dir,
|
|
203
|
+
getRootNode: environment().getRootNode,
|
|
204
|
+
...props()
|
|
205
|
+
}));
|
|
206
|
+
const service = useMachine(checkbox.machine, machineProps);
|
|
207
|
+
return createMemo(() => checkbox.connect(service, normalizeProps));
|
|
208
|
+
};
|
|
209
|
+
|
|
210
|
+
//#endregion
|
|
211
|
+
//#region src/components/checkbox/checkbox-root.tsx
|
|
212
|
+
const CheckboxRoot = (props) => {
|
|
213
|
+
const [useCheckboxProps, labelprops] = createSplitProps()(props, [
|
|
214
|
+
"checked",
|
|
215
|
+
"defaultChecked",
|
|
216
|
+
"disabled",
|
|
217
|
+
"form",
|
|
218
|
+
"id",
|
|
219
|
+
"ids",
|
|
220
|
+
"invalid",
|
|
221
|
+
"name",
|
|
222
|
+
"onCheckedChange",
|
|
223
|
+
"readOnly",
|
|
224
|
+
"required",
|
|
225
|
+
"value"
|
|
226
|
+
]);
|
|
227
|
+
const checkbox$1 = useCheckbox(useCheckboxProps);
|
|
228
|
+
const mergedProps = mergeProps$2(() => checkbox$1().getRootProps(), labelprops);
|
|
229
|
+
return createComponent(CheckboxProvider, {
|
|
230
|
+
value: checkbox$1,
|
|
231
|
+
get children() {
|
|
232
|
+
return createComponent(sprawlify.label, mergedProps);
|
|
233
|
+
}
|
|
234
|
+
});
|
|
235
|
+
};
|
|
236
|
+
|
|
237
|
+
//#endregion
|
|
238
|
+
//#region src/components/checkbox/checkbox-root-provider.tsx
|
|
239
|
+
const CheckboxRootProvider = (props) => {
|
|
240
|
+
const [{ value: checkbox$1 }, labelprops] = createSplitProps()(props, ["value"]);
|
|
241
|
+
const mergedProps = mergeProps$2(() => checkbox$1().getRootProps(), labelprops);
|
|
242
|
+
return createComponent(CheckboxProvider, {
|
|
243
|
+
value: checkbox$1,
|
|
244
|
+
get children() {
|
|
245
|
+
return createComponent(sprawlify.label, mergedProps);
|
|
246
|
+
}
|
|
247
|
+
});
|
|
248
|
+
};
|
|
249
|
+
|
|
250
|
+
//#endregion
|
|
251
|
+
//#region src/components/checkbox/checkbox.ts
|
|
252
|
+
var checkbox_exports = /* @__PURE__ */ __export({
|
|
253
|
+
Context: () => CheckboxContext,
|
|
254
|
+
Control: () => CheckboxControl,
|
|
255
|
+
Group: () => CheckboxGroup,
|
|
256
|
+
GroupProvider: () => CheckboxGroupProvider,
|
|
257
|
+
HiddenInput: () => CheckboxHiddenInput,
|
|
258
|
+
Indicator: () => CheckboxIndicator,
|
|
259
|
+
Label: () => CheckboxLabel,
|
|
260
|
+
Root: () => CheckboxRoot,
|
|
261
|
+
RootProvider: () => CheckboxRootProvider
|
|
262
|
+
});
|
|
263
|
+
|
|
264
|
+
//#endregion
|
|
265
|
+
export { checkbox_exports as Checkbox, CheckboxContext, CheckboxControl, CheckboxGroup, CheckboxGroupProvider, CheckboxHiddenInput, CheckboxIndicator, CheckboxLabel, CheckboxRoot, CheckboxRootProvider, checkboxAnatomy, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext };
|
|
@@ -0,0 +1,247 @@
|
|
|
1
|
+
import { t as __export } from "../../chunk-C4aQI7lE.jsx";
|
|
2
|
+
import { a as useMachine, i as mergeProps$1, r as normalizeProps, t as runIfFn } from "../../run-if-fn-DRWB51JE.jsx";
|
|
3
|
+
import { t as createContext$1 } from "../../create-context-h3cXiEld.jsx";
|
|
4
|
+
import { i as useLocaleContext, o as useEnvironmentContext } from "../../providers-CHqGPEsc.jsx";
|
|
5
|
+
import { n as sprawlify, t as createSplitProps } from "../../create-split-props-CQVsvhvg.jsx";
|
|
6
|
+
import "../../compose-refs-CzyOb8yH.jsx";
|
|
7
|
+
import { u as useFieldsetContext } from "../../fieldset-BG-0ZqWT.jsx";
|
|
8
|
+
import { m as useFieldContext } from "../../field-CphvciGc.jsx";
|
|
9
|
+
import { createMemo, createSignal, createUniqueId, untrack } from "solid-js";
|
|
10
|
+
import * as checkbox from "@sprawlify/primitives/machines/checkbox";
|
|
11
|
+
import { anatomy } from "@sprawlify/primitives/machines/checkbox";
|
|
12
|
+
|
|
13
|
+
//#region src/components/checkbox/use-checkbox-context.ts
|
|
14
|
+
const [CheckboxProvider, useCheckboxContext] = createContext$1({
|
|
15
|
+
hookName: "useCheckboxContext",
|
|
16
|
+
providerName: "<CheckboxProvider />"
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
//#endregion
|
|
20
|
+
//#region src/components/checkbox/checkbox-context.tsx
|
|
21
|
+
const CheckboxContext = (props) => props.children(useCheckboxContext());
|
|
22
|
+
|
|
23
|
+
//#endregion
|
|
24
|
+
//#region src/components/checkbox/checkbox-control.tsx
|
|
25
|
+
const CheckboxControl = (props) => {
|
|
26
|
+
const checkbox$1 = useCheckboxContext();
|
|
27
|
+
const mergedProps = mergeProps$1(() => checkbox$1().getControlProps(), props);
|
|
28
|
+
return <sprawlify.div {...mergedProps} />;
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
//#endregion
|
|
32
|
+
//#region src/components/checkbox/checkbox-anatomy.ts
|
|
33
|
+
const checkboxAnatomy = anatomy.extendWith("group");
|
|
34
|
+
|
|
35
|
+
//#endregion
|
|
36
|
+
//#region src/utils/use-controllable-state.ts
|
|
37
|
+
function useControllableState(props) {
|
|
38
|
+
const [uncontrolledValue, setUncontrolledValue] = createSignal(runIfFn(props.defaultValue));
|
|
39
|
+
const controlled = createMemo(() => props.value?.() !== void 0);
|
|
40
|
+
const currentValue = createMemo(() => controlled() ? props.value?.() : uncontrolledValue());
|
|
41
|
+
const setValue = (next) => {
|
|
42
|
+
untrack(() => {
|
|
43
|
+
const nextValue = runIfFn(next, currentValue());
|
|
44
|
+
if (controlled()) return props.onChange?.(nextValue);
|
|
45
|
+
setUncontrolledValue(nextValue);
|
|
46
|
+
return props.onChange?.(nextValue);
|
|
47
|
+
});
|
|
48
|
+
};
|
|
49
|
+
return [currentValue, setValue];
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
//#endregion
|
|
53
|
+
//#region src/components/checkbox/use-checkbox-group.ts
|
|
54
|
+
function useCheckboxGroup(props = {}) {
|
|
55
|
+
const fieldset = useFieldsetContext();
|
|
56
|
+
const disabled = () => props.disabled ?? fieldset?.()?.disabled;
|
|
57
|
+
const invalid = () => props.invalid ?? fieldset?.()?.invalid;
|
|
58
|
+
const interactive = createMemo(() => !(disabled() || props.readOnly));
|
|
59
|
+
const [value, setValue] = useControllableState({
|
|
60
|
+
value: props.value,
|
|
61
|
+
defaultValue: props.defaultValue || [],
|
|
62
|
+
onChange: props.onValueChange
|
|
63
|
+
});
|
|
64
|
+
return createMemo(() => {
|
|
65
|
+
const isChecked = (val) => {
|
|
66
|
+
return value().some((v) => String(v) === String(val));
|
|
67
|
+
};
|
|
68
|
+
const toggleValue = (val) => {
|
|
69
|
+
isChecked(val) ? removeValue(val) : addValue(val);
|
|
70
|
+
};
|
|
71
|
+
const addValue = (val) => {
|
|
72
|
+
if (!interactive()) return;
|
|
73
|
+
if (isChecked(val)) return;
|
|
74
|
+
setValue(value().concat(val));
|
|
75
|
+
};
|
|
76
|
+
const removeValue = (val) => {
|
|
77
|
+
if (!interactive()) return;
|
|
78
|
+
setValue(value().filter((v) => String(v) !== String(val)));
|
|
79
|
+
};
|
|
80
|
+
const getItemProps = (itemProps) => {
|
|
81
|
+
return {
|
|
82
|
+
checked: itemProps.value != null ? isChecked(itemProps.value) : void 0,
|
|
83
|
+
onCheckedChange() {
|
|
84
|
+
if (itemProps.value != null) toggleValue(itemProps.value);
|
|
85
|
+
},
|
|
86
|
+
name: props.name,
|
|
87
|
+
disabled: disabled(),
|
|
88
|
+
readOnly: props.readOnly,
|
|
89
|
+
invalid: invalid()
|
|
90
|
+
};
|
|
91
|
+
};
|
|
92
|
+
return {
|
|
93
|
+
isChecked,
|
|
94
|
+
value,
|
|
95
|
+
name: props.name,
|
|
96
|
+
disabled: disabled(),
|
|
97
|
+
readOnly: props.readOnly,
|
|
98
|
+
invalid: invalid(),
|
|
99
|
+
setValue,
|
|
100
|
+
addValue,
|
|
101
|
+
toggleValue,
|
|
102
|
+
getItemProps
|
|
103
|
+
};
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
//#endregion
|
|
108
|
+
//#region src/components/checkbox/use-checkbox-group-context.tsx
|
|
109
|
+
const [CheckboxGroupContextProvider, useCheckboxGroupContext] = createContext$1({
|
|
110
|
+
hookName: "useCheckboxGroupContext",
|
|
111
|
+
providerName: "<CheckboxGroupProvider />",
|
|
112
|
+
strict: false
|
|
113
|
+
});
|
|
114
|
+
|
|
115
|
+
//#endregion
|
|
116
|
+
//#region src/components/checkbox/checkbox-group.tsx
|
|
117
|
+
const CheckboxGroup = (props) => {
|
|
118
|
+
const [checkboxGroupProps, localProps] = createSplitProps()(props, [
|
|
119
|
+
"defaultValue",
|
|
120
|
+
"value",
|
|
121
|
+
"onValueChange",
|
|
122
|
+
"disabled",
|
|
123
|
+
"invalid",
|
|
124
|
+
"readOnly",
|
|
125
|
+
"name"
|
|
126
|
+
]);
|
|
127
|
+
const checkboxGroup = useCheckboxGroup(checkboxGroupProps);
|
|
128
|
+
return <CheckboxGroupContextProvider value={checkboxGroup}>
|
|
129
|
+
<sprawlify.div role="group" {...localProps} {...checkboxAnatomy.build().group.attrs} />
|
|
130
|
+
</CheckboxGroupContextProvider>;
|
|
131
|
+
};
|
|
132
|
+
|
|
133
|
+
//#endregion
|
|
134
|
+
//#region src/components/checkbox/checkbox-group-provider.tsx
|
|
135
|
+
const CheckboxGroupProvider = (props) => {
|
|
136
|
+
const [localProps, restProps] = createSplitProps()(props, ["value"]);
|
|
137
|
+
return <CheckboxGroupContextProvider value={localProps.value}>
|
|
138
|
+
<sprawlify.div role="group" {...restProps} {...checkboxAnatomy.build().group.attrs} />
|
|
139
|
+
</CheckboxGroupContextProvider>;
|
|
140
|
+
};
|
|
141
|
+
|
|
142
|
+
//#endregion
|
|
143
|
+
//#region src/components/checkbox/checkbox-hidden-input.tsx
|
|
144
|
+
const CheckboxHiddenInput = (props) => {
|
|
145
|
+
const checkbox$1 = useCheckboxContext();
|
|
146
|
+
const mergedProps = mergeProps$1(() => checkbox$1().getHiddenInputProps(), props);
|
|
147
|
+
const field = useFieldContext();
|
|
148
|
+
return <sprawlify.input aria-describedby={field?.().ariaDescribedby} {...mergedProps} />;
|
|
149
|
+
};
|
|
150
|
+
|
|
151
|
+
//#endregion
|
|
152
|
+
//#region src/components/checkbox/checkbox-indicator.tsx
|
|
153
|
+
const CheckboxIndicator = (props) => {
|
|
154
|
+
const [indicatorProps, localProps] = createSplitProps()(props, ["indeterminate"]);
|
|
155
|
+
const checkbox$1 = useCheckboxContext();
|
|
156
|
+
const mergedProps = mergeProps$1(() => checkbox$1().getIndicatorProps(), localProps);
|
|
157
|
+
return <sprawlify.div {...mergedProps} hidden={!(indicatorProps.indeterminate ? checkbox$1().indeterminate : checkbox$1().checked)} />;
|
|
158
|
+
};
|
|
159
|
+
|
|
160
|
+
//#endregion
|
|
161
|
+
//#region src/components/checkbox/checkbox-label.tsx
|
|
162
|
+
const CheckboxLabel = (props) => {
|
|
163
|
+
const checkbox$1 = useCheckboxContext();
|
|
164
|
+
const mergedProps = mergeProps$1(() => checkbox$1().getLabelProps(), props);
|
|
165
|
+
return <sprawlify.span {...mergedProps} />;
|
|
166
|
+
};
|
|
167
|
+
|
|
168
|
+
//#endregion
|
|
169
|
+
//#region src/components/checkbox/use-checkbox.ts
|
|
170
|
+
const useCheckbox = (ownProps = {}) => {
|
|
171
|
+
const checkboxGroup = useCheckboxGroupContext();
|
|
172
|
+
const props = createMemo(() => {
|
|
173
|
+
const resolvedProps = runIfFn(ownProps);
|
|
174
|
+
return mergeProps$1(resolvedProps, checkboxGroup?.().getItemProps({ value: resolvedProps.value }) ?? {});
|
|
175
|
+
});
|
|
176
|
+
const id = createUniqueId();
|
|
177
|
+
const locale = useLocaleContext();
|
|
178
|
+
const environment = useEnvironmentContext();
|
|
179
|
+
const field = useFieldContext();
|
|
180
|
+
const machineProps = createMemo(() => ({
|
|
181
|
+
id,
|
|
182
|
+
ids: {
|
|
183
|
+
label: field?.().ids.label,
|
|
184
|
+
hiddenInput: field?.().ids.control
|
|
185
|
+
},
|
|
186
|
+
disabled: field?.().disabled,
|
|
187
|
+
readOnly: field?.().readOnly,
|
|
188
|
+
invalid: field?.().invalid,
|
|
189
|
+
required: field?.().required,
|
|
190
|
+
dir: locale().dir,
|
|
191
|
+
getRootNode: environment().getRootNode,
|
|
192
|
+
...props()
|
|
193
|
+
}));
|
|
194
|
+
const service = useMachine(checkbox.machine, machineProps);
|
|
195
|
+
return createMemo(() => checkbox.connect(service, normalizeProps));
|
|
196
|
+
};
|
|
197
|
+
|
|
198
|
+
//#endregion
|
|
199
|
+
//#region src/components/checkbox/checkbox-root.tsx
|
|
200
|
+
const CheckboxRoot = (props) => {
|
|
201
|
+
const [useCheckboxProps, labelprops] = createSplitProps()(props, [
|
|
202
|
+
"checked",
|
|
203
|
+
"defaultChecked",
|
|
204
|
+
"disabled",
|
|
205
|
+
"form",
|
|
206
|
+
"id",
|
|
207
|
+
"ids",
|
|
208
|
+
"invalid",
|
|
209
|
+
"name",
|
|
210
|
+
"onCheckedChange",
|
|
211
|
+
"readOnly",
|
|
212
|
+
"required",
|
|
213
|
+
"value"
|
|
214
|
+
]);
|
|
215
|
+
const checkbox$1 = useCheckbox(useCheckboxProps);
|
|
216
|
+
const mergedProps = mergeProps$1(() => checkbox$1().getRootProps(), labelprops);
|
|
217
|
+
return <CheckboxProvider value={checkbox$1}>
|
|
218
|
+
<sprawlify.label {...mergedProps} />
|
|
219
|
+
</CheckboxProvider>;
|
|
220
|
+
};
|
|
221
|
+
|
|
222
|
+
//#endregion
|
|
223
|
+
//#region src/components/checkbox/checkbox-root-provider.tsx
|
|
224
|
+
const CheckboxRootProvider = (props) => {
|
|
225
|
+
const [{ value: checkbox$1 }, labelprops] = createSplitProps()(props, ["value"]);
|
|
226
|
+
const mergedProps = mergeProps$1(() => checkbox$1().getRootProps(), labelprops);
|
|
227
|
+
return <CheckboxProvider value={checkbox$1}>
|
|
228
|
+
<sprawlify.label {...mergedProps} />
|
|
229
|
+
</CheckboxProvider>;
|
|
230
|
+
};
|
|
231
|
+
|
|
232
|
+
//#endregion
|
|
233
|
+
//#region src/components/checkbox/checkbox.ts
|
|
234
|
+
var checkbox_exports = /* @__PURE__ */ __export({
|
|
235
|
+
Context: () => CheckboxContext,
|
|
236
|
+
Control: () => CheckboxControl,
|
|
237
|
+
Group: () => CheckboxGroup,
|
|
238
|
+
GroupProvider: () => CheckboxGroupProvider,
|
|
239
|
+
HiddenInput: () => CheckboxHiddenInput,
|
|
240
|
+
Indicator: () => CheckboxIndicator,
|
|
241
|
+
Label: () => CheckboxLabel,
|
|
242
|
+
Root: () => CheckboxRoot,
|
|
243
|
+
RootProvider: () => CheckboxRootProvider
|
|
244
|
+
});
|
|
245
|
+
|
|
246
|
+
//#endregion
|
|
247
|
+
export { checkbox_exports as Checkbox, CheckboxContext, CheckboxControl, CheckboxGroup, CheckboxGroupProvider, CheckboxHiddenInput, CheckboxIndicator, CheckboxLabel, CheckboxRoot, CheckboxRootProvider, checkboxAnatomy, useCheckbox, useCheckboxContext, useCheckboxGroup, useCheckboxGroupContext };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { JSX } from "solid-js";
|
|
2
|
+
|
|
3
|
+
//#region src/components/client-only/client-only.d.ts
|
|
4
|
+
interface ClientOnlyProps {
|
|
5
|
+
children: JSX.Element;
|
|
6
|
+
fallback?: JSX.Element;
|
|
7
|
+
}
|
|
8
|
+
declare function ClientOnly(props: ClientOnlyProps): JSX.Element;
|
|
9
|
+
//#endregion
|
|
10
|
+
export { ClientOnly, type ClientOnlyProps };
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { Show, createSignal, onMount } from "solid-js";
|
|
2
|
+
import { createComponent } from "solid-js/web";
|
|
3
|
+
|
|
4
|
+
//#region src/components/client-only/client-only.tsx
|
|
5
|
+
function ClientOnly(props) {
|
|
6
|
+
const [isClient, setIsClient] = createSignal(false);
|
|
7
|
+
onMount(() => {
|
|
8
|
+
setIsClient(true);
|
|
9
|
+
});
|
|
10
|
+
return createComponent(Show, {
|
|
11
|
+
get when() {
|
|
12
|
+
return isClient();
|
|
13
|
+
},
|
|
14
|
+
get fallback() {
|
|
15
|
+
return props.fallback;
|
|
16
|
+
},
|
|
17
|
+
get children() {
|
|
18
|
+
return props.children;
|
|
19
|
+
}
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
//#endregion
|
|
24
|
+
export { ClientOnly };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { Show, createSignal, onMount } from "solid-js";
|
|
2
|
+
|
|
3
|
+
//#region src/components/client-only/client-only.tsx
|
|
4
|
+
function ClientOnly(props) {
|
|
5
|
+
const [isClient, setIsClient] = createSignal(false);
|
|
6
|
+
onMount(() => {
|
|
7
|
+
setIsClient(true);
|
|
8
|
+
});
|
|
9
|
+
return <Show when={isClient()} fallback={props.fallback}>
|
|
10
|
+
{props.children}
|
|
11
|
+
</Show>;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
//#endregion
|
|
15
|
+
export { ClientOnly };
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
import { n as PropTypes } from "../../index-C3ATynHc.js";
|
|
2
|
+
import { i as Optional, n as MaybeAccessor } from "../../types-bQRbEioA.js";
|
|
3
|
+
import { n as PolymorphicProps, t as HTMLProps } from "../../factory-B6RK6SH4.js";
|
|
4
|
+
import * as solid_js89 from "solid-js";
|
|
5
|
+
import { Accessor, JSX } from "solid-js";
|
|
6
|
+
import * as clipboard from "@sprawlify/primitives/machines/clipboard";
|
|
7
|
+
import { CopyStatusDetails, CopyStatusDetails as ClipboardCopyStatusDetails, anatomy as clipboardAnatomy } from "@sprawlify/primitives/machines/clipboard";
|
|
8
|
+
|
|
9
|
+
//#region src/components/clipboard/use-clipboard.d.ts
|
|
10
|
+
interface UseClipboardProps extends Optional<Omit<clipboard.Props, 'dir' | 'getRootNode'>, 'id'> {}
|
|
11
|
+
interface UseClipboardReturn extends Accessor<clipboard.Api<PropTypes>> {}
|
|
12
|
+
declare const useClipboard: (props?: MaybeAccessor<UseClipboardProps>) => UseClipboardReturn;
|
|
13
|
+
//#endregion
|
|
14
|
+
//#region src/components/clipboard/use-clipboard-context.d.ts
|
|
15
|
+
interface UseClipboardContext extends UseClipboardReturn {}
|
|
16
|
+
//#endregion
|
|
17
|
+
//#region src/components/clipboard/clipboard-context.d.ts
|
|
18
|
+
interface ClipboardContextProps {
|
|
19
|
+
children: (context: UseClipboardContext) => JSX.Element;
|
|
20
|
+
}
|
|
21
|
+
declare const ClipboardContext: (props: ClipboardContextProps) => JSX.Element;
|
|
22
|
+
//#endregion
|
|
23
|
+
//#region src/components/clipboard/clipboard-control.d.ts
|
|
24
|
+
interface ClipboardControlBaseProps extends PolymorphicProps<'div'> {}
|
|
25
|
+
interface ClipboardControlProps extends HTMLProps<'div'>, ClipboardControlBaseProps {}
|
|
26
|
+
declare const ClipboardControl: (props: ClipboardControlProps) => solid_js89.JSX.Element;
|
|
27
|
+
//#endregion
|
|
28
|
+
//#region src/components/clipboard/clipboard-indicator.d.ts
|
|
29
|
+
interface IndicatorProps {
|
|
30
|
+
copied?: JSX.Element;
|
|
31
|
+
}
|
|
32
|
+
interface ClipboardIndicatorBaseProps extends IndicatorProps, PolymorphicProps<'div'> {}
|
|
33
|
+
interface ClipboardIndicatorProps extends HTMLProps<'div'>, ClipboardIndicatorBaseProps {}
|
|
34
|
+
declare const ClipboardIndicator: (props: ClipboardIndicatorProps) => JSX.Element;
|
|
35
|
+
//#endregion
|
|
36
|
+
//#region src/components/clipboard/clipboard-input.d.ts
|
|
37
|
+
interface ClipboardInputBaseProps extends PolymorphicProps<'input'> {}
|
|
38
|
+
interface ClipboardInputProps extends HTMLProps<'input'>, ClipboardInputBaseProps {}
|
|
39
|
+
declare const ClipboardInput: (props: ClipboardInputProps) => solid_js89.JSX.Element;
|
|
40
|
+
//#endregion
|
|
41
|
+
//#region src/components/clipboard/clipboard-label.d.ts
|
|
42
|
+
interface ClipboardLabelBaseProps extends PolymorphicProps<'label'> {}
|
|
43
|
+
interface ClipboardLabelProps extends HTMLProps<'label'>, ClipboardLabelBaseProps {}
|
|
44
|
+
declare const ClipboardLabel: (props: ClipboardLabelProps) => solid_js89.JSX.Element;
|
|
45
|
+
//#endregion
|
|
46
|
+
//#region src/components/clipboard/clipboard-root.d.ts
|
|
47
|
+
interface ClipboardRootBaseProps extends UseClipboardProps, PolymorphicProps<'div'> {}
|
|
48
|
+
interface ClipboardRootProps extends HTMLProps<'div'>, ClipboardRootBaseProps {}
|
|
49
|
+
declare const ClipboardRoot: (props: ClipboardRootProps) => solid_js89.JSX.Element;
|
|
50
|
+
//#endregion
|
|
51
|
+
//#region src/components/clipboard/clipboard-root-provider.d.ts
|
|
52
|
+
interface RootProviderProps {
|
|
53
|
+
value: UseClipboardReturn;
|
|
54
|
+
}
|
|
55
|
+
interface ClipboardRootProviderBaseProps extends PolymorphicProps<'div'> {}
|
|
56
|
+
interface ClipboardRootProviderProps extends HTMLProps<'div'>, RootProviderProps, ClipboardRootProviderBaseProps {}
|
|
57
|
+
declare const ClipboardRootProvider: (props: ClipboardRootProviderProps) => solid_js89.JSX.Element;
|
|
58
|
+
//#endregion
|
|
59
|
+
//#region src/components/clipboard/clipboard-trigger.d.ts
|
|
60
|
+
interface ClipboardTriggerBaseProps extends PolymorphicProps<'button'> {}
|
|
61
|
+
interface ClipboardTriggerProps extends HTMLProps<'button'>, ClipboardTriggerBaseProps {}
|
|
62
|
+
declare const ClipboardTrigger: (props: ClipboardTriggerProps) => solid_js89.JSX.Element;
|
|
63
|
+
//#endregion
|
|
64
|
+
//#region src/components/clipboard/clipboard-value-text.d.ts
|
|
65
|
+
interface ClipboardValueTextBaseProps extends PolymorphicProps<'span'> {}
|
|
66
|
+
interface ClipboardValueTextProps extends HTMLProps<'span'>, ClipboardValueTextBaseProps {}
|
|
67
|
+
declare const ClipboardValueText: (props: ClipboardValueTextProps) => solid_js89.JSX.Element;
|
|
68
|
+
declare namespace clipboard_d_exports {
|
|
69
|
+
export { ClipboardContext as Context, ClipboardContextProps as ContextProps, ClipboardControl as Control, ClipboardControlBaseProps as ControlBaseProps, ClipboardControlProps as ControlProps, CopyStatusDetails, ClipboardIndicator as Indicator, ClipboardIndicatorBaseProps as IndicatorBaseProps, ClipboardIndicatorProps as IndicatorProps, ClipboardInput as Input, ClipboardInputBaseProps as InputBaseProps, ClipboardInputProps as InputProps, ClipboardLabel as Label, ClipboardLabelBaseProps as LabelBaseProps, ClipboardLabelProps as LabelProps, ClipboardRoot as Root, ClipboardRootBaseProps as RootBaseProps, ClipboardRootProps as RootProps, ClipboardRootProvider as RootProvider, ClipboardRootProviderBaseProps as RootProviderBaseProps, ClipboardRootProviderProps as RootProviderProps, ClipboardTrigger as Trigger, ClipboardTriggerBaseProps as TriggerBaseProps, ClipboardTriggerProps as TriggerProps, ClipboardValueText as ValueText, ClipboardValueTextBaseProps as ValueTextBaseProps, ClipboardValueTextProps as ValueTextProps };
|
|
70
|
+
}
|
|
71
|
+
//#endregion
|
|
72
|
+
export { clipboard_d_exports as Clipboard, ClipboardContext, type ClipboardContextProps, ClipboardControl, type ClipboardControlBaseProps, type ClipboardControlProps, type ClipboardCopyStatusDetails, ClipboardIndicator, type ClipboardIndicatorBaseProps, type ClipboardIndicatorProps, ClipboardInput, type ClipboardInputBaseProps, type ClipboardInputProps, ClipboardLabel, type ClipboardLabelBaseProps, type ClipboardLabelProps, ClipboardRoot, type ClipboardRootBaseProps, type ClipboardRootProps, ClipboardRootProvider, type ClipboardRootProviderBaseProps, type ClipboardRootProviderProps, ClipboardTrigger, type ClipboardTriggerBaseProps, type ClipboardTriggerProps, ClipboardValueText, type ClipboardValueTextBaseProps, type ClipboardValueTextProps, type UseClipboardContext, type UseClipboardProps, type UseClipboardReturn, clipboardAnatomy, useClipboard, useClipboardContext };
|