fluid-primitives 0.19.1 → 1.0.0-beta.1

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.
Files changed (67) hide show
  1. package/README.md +9 -0
  2. package/dist/Client-HrMIqv7d.js +1934 -0
  3. package/dist/accordion.d.ts +2 -2
  4. package/dist/accordion.js +25 -29
  5. package/dist/button.d.ts +52 -0
  6. package/dist/button.js +135 -0
  7. package/dist/checkbox-group.d.ts +6 -5
  8. package/dist/checkbox-group.js +36 -20
  9. package/dist/{checkbox-group.registry-CGwuF7SF.js → checkbox-group.registry-D8P8A4LY.js} +13 -8
  10. package/dist/checkbox.d.ts +18 -4
  11. package/dist/checkbox.js +30 -27
  12. package/dist/client.d.ts +2 -2
  13. package/dist/client.js +2 -2
  14. package/dist/clipboard.d.ts +12 -5
  15. package/dist/clipboard.js +14 -16
  16. package/dist/collapsible.d.ts +3 -3
  17. package/dist/collapsible.js +13 -17
  18. package/dist/combobox.d.ts +37 -0
  19. package/dist/combobox.js +151 -0
  20. package/dist/date-picker.d.ts +67 -0
  21. package/dist/date-picker.js +289 -0
  22. package/dist/dialog.d.ts +3 -3
  23. package/dist/dialog.js +11 -12
  24. package/dist/field-array.d.ts +97 -0
  25. package/dist/field-array.js +223 -0
  26. package/dist/field.d.ts +30 -54
  27. package/dist/field.js +589 -175
  28. package/dist/fieldset.d.ts +15 -0
  29. package/dist/fieldset.js +27 -0
  30. package/dist/file-upload.d.ts +85 -0
  31. package/dist/file-upload.js +255 -0
  32. package/dist/form.d.ts +2 -83
  33. package/dist/form.fields-B58TZukv.js +329 -0
  34. package/dist/form.js +263 -276
  35. package/dist/index-B06gIN_k.d.ts +1358 -0
  36. package/dist/input.d.ts +96 -0
  37. package/dist/input.js +233 -0
  38. package/dist/menu.d.ts +55 -0
  39. package/dist/menu.js +144 -0
  40. package/dist/navigation-menu.d.ts +3 -3
  41. package/dist/navigation-menu.js +29 -43
  42. package/dist/number-input.d.ts +13 -4
  43. package/dist/number-input.js +30 -31
  44. package/dist/popover.d.ts +11 -3
  45. package/dist/popover.js +17 -18
  46. package/dist/radio-group.d.ts +4 -4
  47. package/dist/radio-group.js +35 -42
  48. package/dist/scroll-area.d.ts +3 -3
  49. package/dist/scroll-area.js +10 -9
  50. package/dist/select.d.ts +13 -51
  51. package/dist/select.js +62 -55
  52. package/dist/slider.d.ts +27 -0
  53. package/dist/slider.js +71 -0
  54. package/dist/switch.d.ts +4 -4
  55. package/dist/switch.js +24 -33
  56. package/dist/tabs.d.ts +3 -3
  57. package/dist/tabs.js +12 -15
  58. package/dist/textarea.d.ts +101 -0
  59. package/dist/textarea.js +231 -0
  60. package/dist/tooltip.d.ts +11 -3
  61. package/dist/tooltip.js +11 -10
  62. package/package.json +79 -24
  63. package/dist/Client-C51NSHxg.js +0 -248
  64. package/dist/field.dom-CJQXpQbZ.js +0 -11
  65. package/dist/form.registry-Cb8Pvoe8.d.ts +0 -7
  66. package/dist/form.registry-CmpTny_s.js +0 -51
  67. package/dist/index-B8JCdyld.d.ts +0 -118
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fluid-primitives",
3
- "version": "0.19.1",
3
+ "version": "1.0.0-beta.1",
4
4
  "description": "Client-side library for Fluid Primitives.",
5
5
  "type": "module",
6
6
  "license": "MIT",
@@ -23,6 +23,10 @@
23
23
  "import": "./dist/accordion.js",
24
24
  "types": "./dist/accordion.d.ts"
25
25
  },
26
+ "./button": {
27
+ "import": "./dist/button.js",
28
+ "types": "./dist/button.d.ts"
29
+ },
26
30
  "./checkbox": {
27
31
  "import": "./dist/checkbox.js",
28
32
  "types": "./dist/checkbox.d.ts"
@@ -39,18 +43,46 @@
39
43
  "import": "./dist/clipboard.js",
40
44
  "types": "./dist/clipboard.d.ts"
41
45
  },
46
+ "./combobox": {
47
+ "import": "./dist/combobox.js",
48
+ "types": "./dist/combobox.d.ts"
49
+ },
42
50
  "./collapsible": {
43
51
  "import": "./dist/collapsible.js",
44
52
  "types": "./dist/collapsible.d.ts"
45
53
  },
54
+ "./date-picker": {
55
+ "import": "./dist/date-picker.js",
56
+ "types": "./dist/date-picker.d.ts"
57
+ },
46
58
  "./field": {
47
59
  "import": "./dist/field.js",
48
60
  "types": "./dist/field.d.ts"
49
61
  },
62
+ "./field-array": {
63
+ "import": "./dist/field-array.js",
64
+ "types": "./dist/field-array.d.ts"
65
+ },
66
+ "./fieldset": {
67
+ "import": "./dist/fieldset.js",
68
+ "types": "./dist/fieldset.d.ts"
69
+ },
70
+ "./file-upload": {
71
+ "import": "./dist/file-upload.js",
72
+ "types": "./dist/file-upload.d.ts"
73
+ },
50
74
  "./form": {
51
75
  "import": "./dist/form.js",
52
76
  "types": "./dist/form.d.ts"
53
77
  },
78
+ "./textarea": {
79
+ "import": "./dist/textarea.js",
80
+ "types": "./dist/textarea.d.ts"
81
+ },
82
+ "./input": {
83
+ "import": "./dist/input.js",
84
+ "types": "./dist/input.d.ts"
85
+ },
54
86
  "./popover": {
55
87
  "import": "./dist/popover.js",
56
88
  "types": "./dist/popover.d.ts"
@@ -67,6 +99,10 @@
67
99
  "import": "./dist/select.js",
68
100
  "types": "./dist/select.d.ts"
69
101
  },
102
+ "./slider": {
103
+ "import": "./dist/slider.js",
104
+ "types": "./dist/slider.d.ts"
105
+ },
70
106
  "./switch": {
71
107
  "import": "./dist/switch.js",
72
108
  "types": "./dist/switch.d.ts"
@@ -86,13 +122,19 @@
86
122
  "./navigation-menu": {
87
123
  "import": "./dist/navigation-menu.js",
88
124
  "types": "./dist/navigation-menu.d.ts"
125
+ },
126
+ "./menu": {
127
+ "import": "./dist/menu.js",
128
+ "types": "./dist/menu.d.ts"
89
129
  }
90
130
  },
91
131
  "scripts": {
92
132
  "build": "tsdown",
93
133
  "dev": "tsdown --watch",
94
134
  "version": "node scripts/version.js",
95
- "bump-zag": "node scripts/bump-zag.js"
135
+ "bump-zag": "node scripts/bump-zag.js",
136
+ "test": "vitest run",
137
+ "types": "tsc --noEmit -p tsconfig.check.json"
96
138
  },
97
139
  "peerDependencies": {
98
140
  "zod": "^4.0.0"
@@ -104,33 +146,46 @@
104
146
  },
105
147
  "devDependencies": {
106
148
  "@types/node": "^22.15.17",
149
+ "jsdom": "^30.1.2",
107
150
  "tsdown": "^0.21.7",
108
151
  "typescript": "^5.8.3",
109
152
  "valibot": "^1.1.0",
153
+ "vitest": "^5.0.3",
110
154
  "zod": "^4.3.6"
111
155
  },
112
156
  "dependencies": {
113
- "@zag-js/accordion": "^1.40.0",
114
- "@zag-js/anatomy": "^1.40.0",
115
- "@zag-js/checkbox": "^1.40.0",
116
- "@zag-js/clipboard": "^1.40.0",
117
- "@zag-js/collapsible": "^1.40.0",
118
- "@zag-js/collection": "^1.40.0",
119
- "@zag-js/core": "^1.40.0",
120
- "@zag-js/dialog": "^1.40.0",
121
- "@zag-js/dom-query": "^1.40.0",
122
- "@zag-js/navigation-menu": "^1.40.0",
123
- "@zag-js/number-input": "^1.40.0",
124
- "@zag-js/popover": "^1.40.0",
125
- "@zag-js/radio-group": "^1.40.0",
126
- "@zag-js/scroll-area": "^1.40.0",
127
- "@zag-js/select": "^1.40.0",
128
- "@zag-js/store": "^1.40.0",
129
- "@zag-js/switch": "^1.40.0",
130
- "@zag-js/tabs": "^1.40.0",
131
- "@zag-js/tooltip": "^1.40.0",
132
- "@zag-js/types": "^1.40.0",
133
- "@zag-js/utils": "^1.40.0",
134
- "@zag-js/vanilla": "^1.40.0"
157
+ "@internationalized/date": "^3.12.4",
158
+ "@zag-js/accordion": "^2.0.0-next.3",
159
+ "@zag-js/anatomy": "^2.0.0-next.3",
160
+ "@zag-js/async-list": "^2.0.0-next.3",
161
+ "@zag-js/checkbox": "^2.0.0-next.3",
162
+ "@zag-js/clipboard": "^2.0.0-next.3",
163
+ "@zag-js/collapsible": "^2.0.0-next.3",
164
+ "@zag-js/collection": "^2.0.0-next.3",
165
+ "@zag-js/combobox": "^2.0.0-next.3",
166
+ "@zag-js/core": "^2.0.0-next.3",
167
+ "@zag-js/date-picker": "^2.0.0-next.3",
168
+ "@zag-js/dialog": "^2.0.0-next.3",
169
+ "@zag-js/dom-query": "^2.0.0-next.3",
170
+ "@zag-js/fieldset": "^2.0.0-next.3",
171
+ "@zag-js/file-upload": "^2.0.0-next.3",
172
+ "@zag-js/file-utils": "^2.0.0-next.3",
173
+ "@zag-js/i18n-utils": "^2.0.0-next.3",
174
+ "@zag-js/live-region": "^2.0.0-next.3",
175
+ "@zag-js/menu": "^2.0.0-next.3",
176
+ "@zag-js/navigation-menu": "^2.0.0-next.3",
177
+ "@zag-js/number-input": "^2.0.0-next.3",
178
+ "@zag-js/popover": "^2.0.0-next.3",
179
+ "@zag-js/radio-group": "^2.0.0-next.3",
180
+ "@zag-js/scroll-area": "^2.0.0-next.3",
181
+ "@zag-js/select": "^2.0.0-next.3",
182
+ "@zag-js/slider": "^2.0.0-next.3",
183
+ "@zag-js/store": "^2.0.0-next.3",
184
+ "@zag-js/switch": "^2.0.0-next.3",
185
+ "@zag-js/tabs": "^2.0.0-next.3",
186
+ "@zag-js/tooltip": "^2.0.0-next.3",
187
+ "@zag-js/types": "^2.0.0-next.3",
188
+ "@zag-js/utils": "^2.0.0-next.3",
189
+ "@zag-js/vanilla": "^2.0.0-next.3"
135
190
  }
136
191
  }
@@ -1,248 +0,0 @@
1
- import { ListCollection } from "@zag-js/collection";
2
- import { VanillaMachine, VanillaMachine as Machine, mergeProps, normalizeProps, spreadProps } from "@zag-js/vanilla";
3
- import { uuid } from "@zag-js/utils";
4
-
5
- //#region Resources/Private/Client/src/lib/component.ts
6
- var Component = class {
7
- document;
8
- machine;
9
- api;
10
- hydrator = null;
11
- userProps;
12
- static name;
13
- get doc() {
14
- return this.document;
15
- }
16
- constructor(props, userDocument = document) {
17
- this.document = userDocument;
18
- this.userProps = this.transformProps(props);
19
- this.hydrator = this.initHydrator(props);
20
- this.machine = this.initMachine(props);
21
- this.api = this.initApi();
22
- }
23
- initHydrator(props) {
24
- const id = props.id;
25
- if (!id) throw new Error("ComponentHydrator requires an id prop to initialize.");
26
- return new ComponentHydrator(this.getName(), id, props.ids, this.doc);
27
- }
28
- init() {
29
- this.render();
30
- this.machine.subscribe(() => {
31
- this.api = this.initApi();
32
- this.render();
33
- });
34
- this.machine.start();
35
- }
36
- getName() {
37
- return this.constructor.name;
38
- }
39
- /**
40
- * Override in consumer for example when a getter is used for collection
41
- * Needs to be used manually inside the initMachine method
42
- */
43
- transformProps(props) {
44
- return props;
45
- }
46
- updateProps(newProps) {
47
- this.machine.updateProps(newProps);
48
- }
49
- destroy() {
50
- this.machine.stop();
51
- this.hydrator?.destroy();
52
- }
53
- spreadProps(node, attrs) {
54
- spreadProps(node, attrs, this.machine.scope.id);
55
- }
56
- getElement(part, parent) {
57
- return this.hydrator?.getElement(part, parent) || null;
58
- }
59
- getElements(part, parent) {
60
- return this.hydrator?.getElements(part, parent) || [];
61
- }
62
- };
63
-
64
- //#endregion
65
- //#region Resources/Private/Primitives/Field/src/field.registry.ts
66
- const registry = /* @__PURE__ */ new WeakMap();
67
- function registerFieldMachine(field, service) {
68
- if (!field) return;
69
- registry.set(field, service);
70
- field.dispatchEvent(new CustomEvent("fluid-primitives:field:registered", { bubbles: true }));
71
- }
72
- function getFieldMachineFor(el) {
73
- if (!el) return;
74
- return registry.get(el);
75
- }
76
-
77
- //#endregion
78
- //#region Resources/Private/Client/src/lib/field-aware-component.ts
79
- const fieldProps = [
80
- "invalid",
81
- "disabled",
82
- "readOnly",
83
- "required"
84
- ];
85
- const fieldAccessors = {
86
- disabled: (s) => s.context.get("disabled"),
87
- readOnly: (s) => s.context.get("readOnly"),
88
- required: (s) => s.context.get("required"),
89
- invalid: (s) => s.context.get("invalid")
90
- };
91
- var FieldAwareComponent = class extends Component {
92
- subscribedToField = false;
93
- fieldMachine;
94
- closestField = null;
95
- getClosestField() {
96
- return this.closestField || this.getElement("root")?.closest("[data-scope=\"field\"][data-part=\"root\"]") || null;
97
- }
98
- withFieldProps(props) {
99
- this.closestField = this.getClosestField();
100
- if (!this.closestField) return props;
101
- this.fieldMachine = getFieldMachineFor(this.closestField);
102
- if (this.fieldMachine) return this.propsWithField(props, this.fieldMachine);
103
- else {
104
- const handler = () => {
105
- this.fieldMachine = getFieldMachineFor(this.closestField);
106
- this.updateProps(this.propsWithField(this.userProps, this.fieldMachine));
107
- this.closestField?.removeEventListener("fluid-primitives:field:registered", handler);
108
- };
109
- this.closestField.addEventListener("fluid-primitives:field:registered", handler);
110
- }
111
- return props;
112
- }
113
- subscribeToFieldService() {
114
- if (this.subscribedToField) return;
115
- this.closestField = this.getClosestField();
116
- if (!this.closestField) return;
117
- if (!this.fieldMachine) this.fieldMachine = getFieldMachineFor(this.closestField);
118
- if (this.fieldMachine) {
119
- this.fieldMachine.subscribe((snapshot) => {
120
- queueMicrotask(() => {
121
- let propsToUpdate = {};
122
- for (const prop of fieldProps) {
123
- const newValue = !!fieldAccessors[prop](snapshot);
124
- if (newValue !== !!this.machine.prop(prop)) propsToUpdate[prop] = newValue;
125
- }
126
- if (Object.keys(propsToUpdate).length > 0) this.updateProps(propsToUpdate);
127
- else this.machine.notify();
128
- });
129
- });
130
- this.subscribedToField = true;
131
- } else {
132
- const handler = () => {
133
- this.subscribeToFieldService();
134
- this.closestField.removeEventListener("fluid-primitives:field:registered", handler);
135
- };
136
- this.closestField.addEventListener("fluid-primitives:field:registered", handler);
137
- }
138
- }
139
- };
140
-
141
- //#endregion
142
- //#region Resources/Private/Client/src/lib/hydration.ts
143
- function getHydrationData(component, id) {
144
- const hydrationData = window.FluidPrimitives?.hydrationData;
145
- if (!hydrationData || typeof hydrationData !== "object") return null;
146
- if (!component) return hydrationData;
147
- if (!hydrationData[component]) return null;
148
- if (!id) return hydrationData[component];
149
- return hydrationData[component][id] || null;
150
- }
151
- function mount(componentName, callback) {
152
- const hydrationInstances = getHydrationData(componentName);
153
- if (!hydrationInstances) return;
154
- Object.keys(hydrationInstances).forEach((id) => {
155
- if (hydrationInstances[id].controlled) return;
156
- const instance = callback({
157
- ...hydrationInstances[id],
158
- createHydrator: () => new ComponentHydrator(componentName, id, hydrationInstances[id].props.ids)
159
- });
160
- if (!instance) return;
161
- if (!window.FluidPrimitives.uncontrolledInstances[componentName]) window.FluidPrimitives.uncontrolledInstances[componentName] = {};
162
- window.FluidPrimitives.uncontrolledInstances[componentName][id] = instance;
163
- });
164
- }
165
- function mountControlled(componentName, rootId, callback) {
166
- const hydrationData = getHydrationData(componentName, rootId);
167
- if (!hydrationData) return;
168
- return callback({
169
- ...hydrationData,
170
- createHydrator: () => new ComponentHydrator(componentName, rootId, hydrationData.props.ids)
171
- });
172
- }
173
- var ComponentHydrator = class {
174
- componentName;
175
- doc;
176
- rootId;
177
- ids;
178
- elementRefs = /* @__PURE__ */ new Map();
179
- constructor(componentName, rootId, ids = {}, doc = document) {
180
- this.componentName = componentName;
181
- this.doc = doc;
182
- if (!rootId) throw new Error(`Root ID is required for component hydration: ${componentName}`);
183
- this.rootId = rootId;
184
- this.ids = ids;
185
- }
186
- getElement(part, parent = this.doc) {
187
- if (this.elementRefs.has(part)) return this.elementRefs.get(part) || null;
188
- let element = null;
189
- if (this.ids[part]) element = parent.querySelector(`#${this.ids[part]}`);
190
- else element = parent.querySelector(`[data-hydrate-${this.componentName}="${this.rootId}"][data-part="${part}"][data-scope="${this.componentName}"]`);
191
- if (element) {
192
- if (parent === this.doc) this.elementRefs.set(part, element);
193
- element.removeAttribute(`data-hydrate-${this.componentName}`);
194
- element.__rootId = this.rootId;
195
- }
196
- return element;
197
- }
198
- getElements(part, parent = this.doc) {
199
- if (this.elementRefs.has(part)) return this.elementRefs.get(part);
200
- let elements = [];
201
- if (this.ids[part]) elements = Array.from(parent.querySelectorAll(`#${this.ids[part]}`));
202
- else elements = Array.from(parent.querySelectorAll(`[data-hydrate-${this.componentName}="${this.rootId}"][data-part="${part}"][data-scope="${this.componentName}"]`));
203
- if (parent === this.doc) this.elementRefs.set(part, elements);
204
- elements.forEach((el) => el.removeAttribute(`data-hydrate-${this.componentName}`));
205
- return elements;
206
- }
207
- generateRefAttributesString(part) {
208
- const id = this.ids[part] || `${this.rootId}-${part}`;
209
- return `data-scope="${this.componentName}" data-part="${part}" data-hydrate-${this.componentName}="${id}"`;
210
- }
211
- setRefAttributes(element, part) {
212
- this.generateRefAttributesString(part).split(" ").map((attr) => attr.trim()).forEach((attr) => {
213
- const [key, value] = attr.split("=");
214
- element.setAttribute(key, value.replace(/"/g, ""));
215
- });
216
- }
217
- destroy() {
218
- this.elementRefs.forEach((el) => {
219
- if (el instanceof Element) el.setAttribute(`data-hydrate-${this.componentName}`, this.rootId);
220
- else el.forEach((e) => e.setAttribute(`data-hydrate-${this.componentName}`, this.rootId));
221
- });
222
- this.elementRefs.clear();
223
- }
224
- };
225
- function getListCollectionFromHydrationData(hydrationCollection) {
226
- if (hydrationCollection instanceof ListCollection) return hydrationCollection;
227
- return new ListCollection({
228
- items: hydrationCollection.items,
229
- itemToValue: hydrationCollection.itemToValueKey ? (item) => item?.[hydrationCollection.itemToValueKey] : void 0,
230
- itemToString: hydrationCollection.itemToStringKey ? (item) => item?.[hydrationCollection.itemToStringKey] : void 0,
231
- isItemDisabled: hydrationCollection.isItemDisabledKey ? (item) => item?.[hydrationCollection.isItemDisabledKey] : void 0,
232
- groupBy: hydrationCollection.groupByKey ? (item) => {
233
- const key = hydrationCollection.groupByKey;
234
- if (!key) return void 0;
235
- if (key.includes(".")) return key.split(".").reduce((obj, k) => obj ? obj[k] : void 0, item);
236
- return item?.[key];
237
- } : void 0
238
- });
239
- }
240
-
241
- //#endregion
242
- //#region Resources/Private/Client/src/lib/uid.ts
243
- function uid(prefix = "f") {
244
- return "«" + prefix + uuid() + "»";
245
- }
246
-
247
- //#endregion
248
- export { Machine as a, getListCollectionFromHydrationData as c, FieldAwareComponent as d, registerFieldMachine as f, mergeProps as i, mount as l, spreadProps as n, ComponentHydrator as o, Component as p, normalizeProps as r, getHydrationData as s, uid as t, mountControlled as u };
@@ -1,11 +0,0 @@
1
- //#region Resources/Private/Primitives/Field/src/field.dom.ts
2
- const getRootId = (scope) => scope.ids?.root ?? `field:${scope.id}:root`;
3
- const getLabelId = (scope) => scope.ids?.label ?? `field:${scope.id}:label`;
4
- const getControlId = (scope) => scope.ids?.control ?? `field:${scope.id}:control`;
5
- const getErrorId = (scope) => scope.ids?.error ?? `field:${scope.id}:error`;
6
- const getDescriptionId = (scope) => scope.ids?.description ?? `field:${scope.id}:description`;
7
- const getRootEl = (scope) => scope.getById(getRootId(scope));
8
- const getDescriptionEl = (scope) => scope.getById(getDescriptionId(scope));
9
-
10
- //#endregion
11
- export { getLabelId as a, getErrorId as i, getDescriptionEl as n, getRootEl as o, getDescriptionId as r, getRootId as s, getControlId as t };
@@ -1,7 +0,0 @@
1
- import { a as Machine } from "./index-B8JCdyld.js";
2
-
3
- //#region Resources/Private/Primitives/Form/src/form.registry.d.ts
4
- type FormMachine = Machine<any>;
5
- type FieldMachine = Machine<any>;
6
- //#endregion
7
- export { FormMachine as n, FieldMachine as t };
@@ -1,51 +0,0 @@
1
- //#region Resources/Private/Primitives/Form/src/form.registry.ts
2
- const registry = /* @__PURE__ */ new WeakMap();
3
- function registerFormMachine(form, service) {
4
- if (!form) return;
5
- registry.set(form, {
6
- machine: service,
7
- fields: /* @__PURE__ */ new Map(),
8
- expectedFieldCount: form.querySelectorAll("[data-scope=\"field\"][data-part=\"root\"]").length || 0
9
- });
10
- form.dispatchEvent(new CustomEvent("fluid-primitives:form:registered", { bubbles: true }));
11
- }
12
- function registerFieldMachineForForm(el, fieldMachine) {
13
- if (!el) return;
14
- const form = resolveElToForm(el);
15
- if (!form) return;
16
- const handleEntry = (entry) => {
17
- entry.fields.set(fieldMachine.prop("name"), fieldMachine);
18
- if (entry.fields.size === entry.expectedFieldCount) entry.machine.notify();
19
- };
20
- const handler = () => {
21
- const entry = registry.get(form);
22
- if (!entry) return;
23
- handleEntry(entry);
24
- form.removeEventListener("fluid-primitives:form:registered", handler);
25
- };
26
- const entry = registry.get(form);
27
- if (entry) handleEntry(entry);
28
- else form.addEventListener("fluid-primitives:form:registered", handler);
29
- }
30
- function resolveElToForm(el) {
31
- if (!el) return null;
32
- if (el instanceof HTMLFormElement) return el;
33
- return el.closest("form");
34
- }
35
- function getFormMachineFor(el) {
36
- if (!el) return;
37
- const form = resolveElToForm(el);
38
- if (!form) return;
39
- return registry.get(form)?.machine;
40
- }
41
- function getFieldMachinesFor(el) {
42
- if (!el) return /* @__PURE__ */ new Map();
43
- const form = resolveElToForm(el);
44
- if (!form) return /* @__PURE__ */ new Map();
45
- const entry = registry.get(form);
46
- if (!entry) return /* @__PURE__ */ new Map();
47
- return entry.fields;
48
- }
49
-
50
- //#endregion
51
- export { registerFormMachine as i, getFormMachineFor as n, registerFieldMachineForForm as r, getFieldMachinesFor as t };
@@ -1,118 +0,0 @@
1
- import { ListCollection } from "@zag-js/collection";
2
- import { Attrs, VanillaMachine, VanillaMachine as Machine, mergeProps, normalizeProps, spreadProps } from "@zag-js/vanilla";
3
-
4
- //#region Resources/Private/Client/src/types.d.ts
5
- declare global {
6
- interface Window {
7
- FluidPrimitives: {
8
- hydrationData: {
9
- [componentName: string]: {
10
- [id: string]: ComponentHydrationData;
11
- };
12
- };
13
- globals?: FluidPrimitivesGlobals;
14
- uncontrolledInstances: {
15
- [componentName: string]: {
16
- [id: string]: Component<unknown, unknown>;
17
- };
18
- };
19
- };
20
- }
21
- }
22
- interface ComponentInterface<Api> {
23
- document: Document;
24
- machine: VanillaMachine<any>;
25
- api: Api;
26
- hydrator: ComponentHydrator | null;
27
- init(): void;
28
- destroy(): void;
29
- render(): void;
30
- }
31
- interface ComponentHydrationData {
32
- controlled: boolean;
33
- props: {
34
- id: string;
35
- ids: {
36
- [key: string]: string;
37
- };
38
- [key: string]: unknown;
39
- };
40
- }
41
- interface FluidPrimitivesGlobals {
42
- locale?: string;
43
- [key: string]: unknown;
44
- }
45
- //#endregion
46
- //#region Resources/Private/Client/src/lib/component.d.ts
47
- declare abstract class Component<Props, Api> implements ComponentInterface<Api> {
48
- document: Document;
49
- machine: Machine<any>;
50
- api: Api;
51
- hydrator: ComponentHydrator | null;
52
- userProps?: Partial<Props>;
53
- static name: string;
54
- get doc(): Document;
55
- constructor(props: Props, userDocument?: Document);
56
- abstract initMachine(props: Props): Machine<any>;
57
- abstract initApi(): Api;
58
- initHydrator(props: Props): ComponentHydrator;
59
- init(): void;
60
- getName(): string;
61
- /**
62
- * Override in consumer for example when a getter is used for collection
63
- * Needs to be used manually inside the initMachine method
64
- */
65
- transformProps(props: Partial<Props>): Partial<Props>;
66
- updateProps(newProps: Partial<Props>): void;
67
- destroy(): void;
68
- spreadProps(node: HTMLElement, attrs: Attrs): void;
69
- getElement<T extends HTMLElement>(part: string, parent?: HTMLElement | Document): T | null;
70
- getElements<T extends HTMLElement>(part: string, parent?: HTMLElement | Document): T[];
71
- abstract render(): void;
72
- }
73
- //#endregion
74
- //#region Resources/Private/Primitives/Field/src/field.registry.d.ts
75
- type FieldMachine = Machine<any>;
76
- //#endregion
77
- //#region Resources/Private/Client/src/lib/field-aware-component.d.ts
78
- declare abstract class FieldAwareComponent<Props, Api> extends Component<Props, Api> {
79
- protected subscribedToField: boolean;
80
- protected fieldMachine: FieldMachine | undefined;
81
- protected closestField: HTMLElement | null;
82
- protected abstract propsWithField(props: Partial<Props>, fieldMachine: FieldMachine): Props;
83
- protected getClosestField(): HTMLElement;
84
- protected withFieldProps(props: Props): Props;
85
- subscribeToFieldService(): void;
86
- }
87
- //#endregion
88
- //#region Resources/Private/Client/src/lib/hydration.d.ts
89
- declare function getHydrationData(component: string): Record<string, ComponentHydrationData> | null;
90
- declare function getHydrationData(component: string, id: string): ComponentHydrationData | null;
91
- declare function mount(componentName: string, callback: (data: ComponentHydrationData & {
92
- createHydrator: () => ComponentHydrator;
93
- }) => Component<unknown, unknown> | void): void;
94
- declare function mountControlled(componentName: string, rootId: string, callback: (data: ComponentHydrationData & {
95
- createHydrator: () => ComponentHydrator;
96
- }) => Component<unknown, unknown> | void): void | Component<unknown, unknown>;
97
- declare class ComponentHydrator {
98
- componentName: string;
99
- doc: Document;
100
- rootId: string;
101
- ids: {
102
- [key: string]: string;
103
- };
104
- elementRefs: Map<string, Element | Element[]>;
105
- constructor(componentName: string, rootId: string | undefined, ids?: {
106
- [key: string]: string;
107
- }, doc?: Document);
108
- getElement<T extends Element>(part: string, parent?: Element | Document): T | null;
109
- getElements<T extends Element>(part: string, parent?: Element | Document): T[];
110
- generateRefAttributesString(part: string): string;
111
- setRefAttributes(element: Element, part: string): void;
112
- destroy(): void;
113
- }
114
- //#endregion
115
- //#region Resources/Private/Client/src/lib/uid.d.ts
116
- declare function uid(prefix?: string): string;
117
- //#endregion
118
- export { Machine as a, mount as c, FieldMachine as d, Component as f, FluidPrimitivesGlobals as h, mergeProps as i, mountControlled as l, ComponentInterface as m, spreadProps as n, ComponentHydrator as o, ComponentHydrationData as p, normalizeProps as r, getHydrationData as s, uid as t, FieldAwareComponent as u };