@destyler/radio 0.0.7-beta.9 → 0.2.0-beta.5

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.
@@ -4,7 +4,7 @@ import { AnyEventObject, Machine, XSend, XState } from "@destyler/xstate";
4
4
  import { CommonProperties, DirectionProperty, NormalizeProps, PropTypes, RequiredBy } from "@destyler/types";
5
5
 
6
6
  //#region src/anatomy.d.ts
7
- declare const anatomy: _destyler_anatomy0.AnatomyInstance<"root" | "label" | "indicator" | "item" | "itemControl" | "itemText">;
7
+ declare const anatomy: _destyler_anatomy0.AnatomyInstance<"root" | "label" | "item" | "itemText" | "itemControl" | "indicator">;
8
8
  //#endregion
9
9
  //#region src/types.d.ts
10
10
  interface ValueChangeDetails {
@@ -26,8 +26,7 @@ const dom = createScope({
26
26
  getFirstEnabledInputEl: (ctx) => dom.getRootEl(ctx)?.querySelector("input:not(:disabled)"),
27
27
  getFirstEnabledAndCheckedInputEl: (ctx) => dom.getRootEl(ctx)?.querySelector("input:not(:disabled):checked"),
28
28
  getInputEls: (ctx) => {
29
- const ownerId = CSS.escape(dom.getRootId(ctx));
30
- const selector = `input[type=radio][data-ownedby='${ownerId}']:not([disabled])`;
29
+ const selector = `input[type=radio][data-ownedby='${CSS.escape(dom.getRootId(ctx))}']:not([disabled])`;
31
30
  return queryAll(dom.getRootEl(ctx), selector);
32
31
  },
33
32
  getActiveRadioEl: (ctx) => {
@@ -88,8 +87,7 @@ function connect(state, send, normalize) {
88
87
  firstEnabledAndCheckedInput.focus();
89
88
  return;
90
89
  }
91
- const firstEnabledInput = dom.getFirstEnabledInputEl(state.context);
92
- firstEnabledInput?.focus();
90
+ dom.getFirstEnabledInputEl(state.context)?.focus();
93
91
  };
94
92
  return {
95
93
  focus,
@@ -289,7 +287,6 @@ const set = { value: (ctx, value) => {
289
287
  invoke.change(ctx);
290
288
  } };
291
289
  function machine(userContext) {
292
- const ctx = compact(userContext);
293
290
  return createMachine({
294
291
  id: "radio",
295
292
  initial: "idle",
@@ -300,14 +297,14 @@ function machine(userContext) {
300
297
  hoveredValue: null,
301
298
  disabled: false,
302
299
  orientation: "vertical",
303
- ...ctx,
300
+ ...compact(userContext),
304
301
  indicatorRect: {},
305
302
  canIndicatorTransition: false,
306
303
  fieldsetDisabled: false,
307
304
  focusVisible: false,
308
305
  ssr: true
309
306
  },
310
- computed: { isDisabled: (ctx$1) => !!ctx$1.disabled || ctx$1.fieldsetDisabled },
307
+ computed: { isDisabled: (ctx) => !!ctx.disabled || ctx.fieldsetDisabled },
311
308
  entry: ["syncIndicatorRect", "syncSsr"],
312
309
  exit: ["cleanupObserver"],
313
310
  activities: ["trackFormControlState", "trackFocusVisible"],
@@ -329,10 +326,10 @@ function machine(userContext) {
329
326
  }, {
330
327
  guards: { isTrusted: (_ctx, evt) => !!evt.isTrusted },
331
328
  activities: {
332
- trackFormControlState(ctx$1, _evt, { send, initialContext }) {
333
- return trackFormControl(dom.getRootEl(ctx$1), {
329
+ trackFormControlState(ctx, _evt, { send, initialContext }) {
330
+ return trackFormControl(dom.getRootEl(ctx), {
334
331
  onFieldsetDisabledChange(disabled) {
335
- ctx$1.fieldsetDisabled = disabled;
332
+ ctx.fieldsetDisabled = disabled;
336
333
  },
337
334
  onFormReset() {
338
335
  send({
@@ -342,64 +339,62 @@ function machine(userContext) {
342
339
  }
343
340
  });
344
341
  },
345
- trackFocusVisible(ctx$1) {
346
- return trackFocusVisible({ root: dom.getRootNode(ctx$1) });
342
+ trackFocusVisible(ctx) {
343
+ return trackFocusVisible({ root: dom.getRootNode(ctx) });
347
344
  }
348
345
  },
349
346
  actions: {
350
- setValue(ctx$1, evt) {
351
- set.value(ctx$1, evt.value);
347
+ setValue(ctx, evt) {
348
+ set.value(ctx, evt.value);
352
349
  },
353
- setHovered(ctx$1, evt) {
354
- ctx$1.hoveredValue = evt.value;
350
+ setHovered(ctx, evt) {
351
+ ctx.hoveredValue = evt.value;
355
352
  },
356
- setActive(ctx$1, evt) {
357
- ctx$1.activeValue = evt.value;
353
+ setActive(ctx, evt) {
354
+ ctx.activeValue = evt.value;
358
355
  },
359
- setFocused(ctx$1, evt) {
360
- ctx$1.focusedValue = evt.value;
361
- ctx$1.focusVisible = evt.focusVisible;
356
+ setFocused(ctx, evt) {
357
+ ctx.focusedValue = evt.value;
358
+ ctx.focusVisible = evt.focusVisible;
362
359
  },
363
- syncInputElements(ctx$1) {
364
- const inputs = dom.getInputEls(ctx$1);
365
- inputs.forEach((input) => {
366
- input.checked = input.value === ctx$1.value;
360
+ syncInputElements(ctx) {
361
+ dom.getInputEls(ctx).forEach((input) => {
362
+ input.checked = input.value === ctx.value;
367
363
  });
368
364
  },
369
- setIndicatorTransition(ctx$1) {
370
- ctx$1.canIndicatorTransition = isString(ctx$1.value);
365
+ setIndicatorTransition(ctx) {
366
+ ctx.canIndicatorTransition = isString(ctx.value);
371
367
  },
372
- cleanupObserver(ctx$1) {
373
- ctx$1.indicatorCleanup?.();
368
+ cleanupObserver(ctx) {
369
+ ctx.indicatorCleanup?.();
374
370
  },
375
- syncSsr(ctx$1) {
376
- ctx$1.ssr = false;
371
+ syncSsr(ctx) {
372
+ ctx.ssr = false;
377
373
  },
378
- syncIndicatorRect(ctx$1) {
379
- ctx$1.indicatorCleanup?.();
380
- if (!dom.getIndicatorEl(ctx$1)) return;
381
- const value = ctx$1.value;
382
- const radioEl = dom.getActiveRadioEl(ctx$1);
374
+ syncIndicatorRect(ctx) {
375
+ ctx.indicatorCleanup?.();
376
+ if (!dom.getIndicatorEl(ctx)) return;
377
+ const value = ctx.value;
378
+ const radioEl = dom.getActiveRadioEl(ctx);
383
379
  if (value == null || !radioEl) {
384
- ctx$1.indicatorRect = {};
380
+ ctx.indicatorRect = {};
385
381
  return;
386
382
  }
387
- ctx$1.indicatorCleanup = trackElementRect(radioEl, {
383
+ ctx.indicatorCleanup = trackElementRect(radioEl, {
388
384
  getRect(el) {
389
385
  return dom.getOffsetRect(el);
390
386
  },
391
387
  onChange(rect) {
392
- ctx$1.indicatorRect = dom.resolveRect(rect);
388
+ ctx.indicatorRect = dom.resolveRect(rect);
393
389
  nextTick(() => {
394
- ctx$1.canIndicatorTransition = false;
390
+ ctx.canIndicatorTransition = false;
395
391
  });
396
392
  }
397
393
  });
398
394
  },
399
- dispatchChangeEvent(ctx$1) {
400
- const inputEls = dom.getInputEls(ctx$1);
401
- inputEls.forEach((inputEl) => {
402
- const checked = inputEl.value === ctx$1.value;
395
+ dispatchChangeEvent(ctx) {
396
+ dom.getInputEls(ctx).forEach((inputEl) => {
397
+ const checked = inputEl.value === ctx.value;
403
398
  if (checked === inputEl.checked) return;
404
399
  dispatchInputCheckedEvent(inputEl, { checked });
405
400
  });
package/package.json CHANGED
@@ -1,28 +1,37 @@
1
1
  {
2
2
  "name": "@destyler/radio",
3
3
  "type": "module",
4
- "version": "0.0.7-beta.9",
4
+ "version": "0.2.0-beta.5",
5
5
  "description": "A set of checkable buttons—known as radio buttons—where no more than one of the buttons can be checked at a time.",
6
6
  "author": "Elone Hoo <elonehoo@gmail.com>",
7
7
  "license": "MIT",
8
+ "homepage": "https://github.com/destyler/destyler",
9
+ "repository": {
10
+ "type": "git",
11
+ "url": "git+https://github.com/destyler/destyler.git",
12
+ "directory": "packages/components/radio"
13
+ },
8
14
  "exports": {
9
- ".": "./dist/index.js"
15
+ ".": "./dist/index.mjs"
10
16
  },
11
- "main": "dist/index.js",
12
- "module": "dist/index.js",
13
- "types": "dist/index.d.ts",
17
+ "main": "dist/index.mjs",
18
+ "module": "dist/index.mjs",
19
+ "types": "dist/index.d.mts",
14
20
  "files": [
15
21
  "*.d.ts",
16
22
  "dist"
17
23
  ],
18
24
  "dependencies": {
19
- "@destyler/anatomy": "0.0.7-beta.9",
20
- "@destyler/dom": "0.0.7-beta.9",
21
- "@destyler/element-rect": "0.0.7-beta.9",
22
- "@destyler/focus-visible": "0.0.7-beta.9",
23
- "@destyler/types": "0.0.7-beta.9",
24
- "@destyler/utils": "0.0.7-beta.9",
25
- "@destyler/xstate": "0.0.7-beta.9"
25
+ "@destyler/anatomy": "0.2.0-beta.5",
26
+ "@destyler/dom": "0.2.0-beta.5",
27
+ "@destyler/element-rect": "0.2.0-beta.5",
28
+ "@destyler/focus-visible": "0.2.0-beta.5",
29
+ "@destyler/utils": "0.2.0-beta.5",
30
+ "@destyler/types": "0.2.0-beta.5",
31
+ "@destyler/xstate": "0.2.0-beta.5"
32
+ },
33
+ "publishConfig": {
34
+ "access": "public"
26
35
  },
27
36
  "scripts": {
28
37
  "clear": "rimraf ./dist",