@cdx-ui/primitives 0.1.5 → 0.1.6

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 (64) hide show
  1. package/lib/commonjs/index.js +12 -0
  2. package/lib/commonjs/index.js.map +1 -1
  3. package/lib/commonjs/toggle-button/ToggleButtonGroup.js +185 -0
  4. package/lib/commonjs/toggle-button/ToggleButtonGroup.js.map +1 -0
  5. package/lib/commonjs/toggle-button/ToggleButtonRoot.js +131 -0
  6. package/lib/commonjs/toggle-button/ToggleButtonRoot.js.map +1 -0
  7. package/lib/commonjs/toggle-button/ToggleButtonRoot.web.js +180 -0
  8. package/lib/commonjs/toggle-button/ToggleButtonRoot.web.js.map +1 -0
  9. package/lib/commonjs/toggle-button/context.js +27 -0
  10. package/lib/commonjs/toggle-button/context.js.map +1 -0
  11. package/lib/commonjs/toggle-button/index.js +45 -0
  12. package/lib/commonjs/toggle-button/index.js.map +1 -0
  13. package/lib/commonjs/toggle-button/toggleState.js +23 -0
  14. package/lib/commonjs/toggle-button/toggleState.js.map +1 -0
  15. package/lib/commonjs/toggle-button/types.js +6 -0
  16. package/lib/commonjs/toggle-button/types.js.map +1 -0
  17. package/lib/commonjs/toggle-button/useToggleButtonGroupNavigation.js +80 -0
  18. package/lib/commonjs/toggle-button/useToggleButtonGroupNavigation.js.map +1 -0
  19. package/lib/module/index.js +1 -0
  20. package/lib/module/index.js.map +1 -1
  21. package/lib/module/toggle-button/ToggleButtonGroup.js +181 -0
  22. package/lib/module/toggle-button/ToggleButtonGroup.js.map +1 -0
  23. package/lib/module/toggle-button/ToggleButtonRoot.js +127 -0
  24. package/lib/module/toggle-button/ToggleButtonRoot.js.map +1 -0
  25. package/lib/module/toggle-button/ToggleButtonRoot.web.js +176 -0
  26. package/lib/module/toggle-button/ToggleButtonRoot.web.js.map +1 -0
  27. package/lib/module/toggle-button/context.js +18 -0
  28. package/lib/module/toggle-button/context.js.map +1 -0
  29. package/lib/module/toggle-button/index.js +6 -0
  30. package/lib/module/toggle-button/index.js.map +1 -0
  31. package/lib/module/toggle-button/toggleState.js +19 -0
  32. package/lib/module/toggle-button/toggleState.js.map +1 -0
  33. package/lib/module/toggle-button/types.js +4 -0
  34. package/lib/module/toggle-button/types.js.map +1 -0
  35. package/lib/module/toggle-button/useToggleButtonGroupNavigation.js +75 -0
  36. package/lib/module/toggle-button/useToggleButtonGroupNavigation.js.map +1 -0
  37. package/lib/typescript/index.d.ts +1 -0
  38. package/lib/typescript/index.d.ts.map +1 -1
  39. package/lib/typescript/toggle-button/ToggleButtonGroup.d.ts +5 -0
  40. package/lib/typescript/toggle-button/ToggleButtonGroup.d.ts.map +1 -0
  41. package/lib/typescript/toggle-button/ToggleButtonRoot.d.ts +5 -0
  42. package/lib/typescript/toggle-button/ToggleButtonRoot.d.ts.map +1 -0
  43. package/lib/typescript/toggle-button/ToggleButtonRoot.web.d.ts +5 -0
  44. package/lib/typescript/toggle-button/ToggleButtonRoot.web.d.ts.map +1 -0
  45. package/lib/typescript/toggle-button/context.d.ts +27 -0
  46. package/lib/typescript/toggle-button/context.d.ts.map +1 -0
  47. package/lib/typescript/toggle-button/index.d.ts +5 -0
  48. package/lib/typescript/toggle-button/index.d.ts.map +1 -0
  49. package/lib/typescript/toggle-button/toggleState.d.ts +14 -0
  50. package/lib/typescript/toggle-button/toggleState.d.ts.map +1 -0
  51. package/lib/typescript/toggle-button/types.d.ts +87 -0
  52. package/lib/typescript/toggle-button/types.d.ts.map +1 -0
  53. package/lib/typescript/toggle-button/useToggleButtonGroupNavigation.d.ts +19 -0
  54. package/lib/typescript/toggle-button/useToggleButtonGroupNavigation.d.ts.map +1 -0
  55. package/package.json +3 -3
  56. package/src/index.ts +1 -0
  57. package/src/toggle-button/ToggleButtonGroup.tsx +260 -0
  58. package/src/toggle-button/ToggleButtonRoot.tsx +151 -0
  59. package/src/toggle-button/ToggleButtonRoot.web.tsx +225 -0
  60. package/src/toggle-button/context.tsx +30 -0
  61. package/src/toggle-button/index.ts +16 -0
  62. package/src/toggle-button/toggleState.ts +19 -0
  63. package/src/toggle-button/types.ts +94 -0
  64. package/src/toggle-button/useToggleButtonGroupNavigation.ts +112 -0
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.ToggleButtonProvider = exports.ToggleButtonGroupContextProvider = void 0;
7
+ exports.useOptionalToggleButtonGroupContext = useOptionalToggleButtonGroupContext;
8
+ exports.useToggleButtonContext = void 0;
9
+ exports.useToggleButtonGroupContext = useToggleButtonGroupContext;
10
+ var _react = require("react");
11
+ var _utils = require("@cdx-ui/utils");
12
+ const [ToggleButtonProvider, useToggleButtonContext] = (0, _utils.createContext)('ToggleButtonContext');
13
+ exports.useToggleButtonContext = useToggleButtonContext;
14
+ exports.ToggleButtonProvider = ToggleButtonProvider;
15
+ const ToggleButtonGroupContext = /*#__PURE__*/(0, _react.createContext)(null);
16
+ const ToggleButtonGroupContextProvider = exports.ToggleButtonGroupContextProvider = ToggleButtonGroupContext.Provider;
17
+ function useToggleButtonGroupContext() {
18
+ const ctx = (0, _react.useContext)(ToggleButtonGroupContext);
19
+ if (!ctx) {
20
+ throw new Error('ToggleButton must be used within ToggleButtonGroup');
21
+ }
22
+ return ctx;
23
+ }
24
+ function useOptionalToggleButtonGroupContext() {
25
+ return (0, _react.useContext)(ToggleButtonGroupContext);
26
+ }
27
+ //# sourceMappingURL=context.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","require","_utils","ToggleButtonProvider","useToggleButtonContext","createContext","exports","ToggleButtonGroupContext","createReactContext","ToggleButtonGroupContextProvider","Provider","useToggleButtonGroupContext","ctx","useContext","Error","useOptionalToggleButtonGroupContext"],"sourceRoot":"../../../src","sources":["toggle-button/context.tsx"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAGO,MAAM,CAACE,oBAAoB,EAAEC,sBAAsB,CAAC,GAAG,IAAAC,oBAAa,EASxE,qBAAqB,CAAC;AAACC,OAAA,CAAAF,sBAAA,GAAAA,sBAAA;AAAAE,OAAA,CAAAH,oBAAA,GAAAA,oBAAA;AAE1B,MAAMI,wBAAwB,gBAAG,IAAAC,oBAAkB,EAAwC,IAAI,CAAC;AAEzF,MAAMC,gCAAgC,GAAAH,OAAA,CAAAG,gCAAA,GAAGF,wBAAwB,CAACG,QAAQ;AAE1E,SAASC,2BAA2BA,CAAA,EAAmC;EAC5E,MAAMC,GAAG,GAAG,IAAAC,iBAAU,EAACN,wBAAwB,CAAC;EAChD,IAAI,CAACK,GAAG,EAAE;IACR,MAAM,IAAIE,KAAK,CAAC,oDAAoD,CAAC;EACvE;EACA,OAAOF,GAAG;AACZ;AAEO,SAASG,mCAAmCA,CAAA,EAA0C;EAC3F,OAAO,IAAAF,iBAAU,EAACN,wBAAwB,CAAC;AAC7C","ignoreList":[]}
@@ -0,0 +1,45 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "ToggleButtonGroup", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _ToggleButtonGroup.ToggleButtonGroup;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "ToggleButtonProvider", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _context.ToggleButtonProvider;
16
+ }
17
+ });
18
+ Object.defineProperty(exports, "ToggleButtonRoot", {
19
+ enumerable: true,
20
+ get: function () {
21
+ return _ToggleButtonRoot.ToggleButtonRoot;
22
+ }
23
+ });
24
+ Object.defineProperty(exports, "useOptionalToggleButtonGroupContext", {
25
+ enumerable: true,
26
+ get: function () {
27
+ return _context.useOptionalToggleButtonGroupContext;
28
+ }
29
+ });
30
+ Object.defineProperty(exports, "useToggleButtonContext", {
31
+ enumerable: true,
32
+ get: function () {
33
+ return _context.useToggleButtonContext;
34
+ }
35
+ });
36
+ Object.defineProperty(exports, "useToggleButtonGroupContext", {
37
+ enumerable: true,
38
+ get: function () {
39
+ return _context.useToggleButtonGroupContext;
40
+ }
41
+ });
42
+ var _ToggleButtonRoot = require("./ToggleButtonRoot");
43
+ var _ToggleButtonGroup = require("./ToggleButtonGroup");
44
+ var _context = require("./context");
45
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_ToggleButtonRoot","require","_ToggleButtonGroup","_context"],"sourceRoot":"../../../src","sources":["toggle-button/index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,iBAAA,GAAAC,OAAA;AACA,IAAAC,kBAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA","ignoreList":[]}
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.getToggleState = getToggleState;
7
+ // Keyed `selected:active:hover`. Press outranks hover so each combination maps to exactly one
8
+ // value, letting the styled layer use single-condition selectors that also work on native.
9
+ const TOGGLE_STATES = {
10
+ 'false:false:false': 'idle',
11
+ 'false:false:true': 'hover',
12
+ 'false:true:false': 'active',
13
+ 'false:true:true': 'active',
14
+ 'true:false:false': 'selected',
15
+ 'true:false:true': 'selected-hover',
16
+ 'true:true:false': 'selected-active',
17
+ 'true:true:true': 'selected-active'
18
+ };
19
+ function getToggleState(selected, active, hover) {
20
+ const key = [selected, active, hover].map(flag => flag ? 'true' : 'false').join(':');
21
+ return TOGGLE_STATES[key];
22
+ }
23
+ //# sourceMappingURL=toggleState.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["TOGGLE_STATES","getToggleState","selected","active","hover","key","map","flag","join"],"sourceRoot":"../../../src","sources":["toggle-button/toggleState.ts"],"mappings":";;;;;;AAAA;AACA;AACA,MAAMA,aAAa,GAAG;EACpB,mBAAmB,EAAE,MAAM;EAC3B,kBAAkB,EAAE,OAAO;EAC3B,kBAAkB,EAAE,QAAQ;EAC5B,iBAAiB,EAAE,QAAQ;EAC3B,kBAAkB,EAAE,UAAU;EAC9B,iBAAiB,EAAE,gBAAgB;EACnC,iBAAiB,EAAE,iBAAiB;EACpC,gBAAgB,EAAE;AACpB,CAAU;AAIH,SAASC,cAAcA,CAACC,QAAiB,EAAEC,MAAe,EAAEC,KAAc,EAAe;EAC9F,MAAMC,GAAG,GAAG,CAACH,QAAQ,EAAEC,MAAM,EAAEC,KAAK,CAAC,CAACE,GAAG,CAAEC,IAAI,IAAMA,IAAI,GAAG,MAAM,GAAG,OAAQ,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC;EACxF,OAAOR,aAAa,CAACK,GAAG,CAA+B;AACzD","ignoreList":[]}
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":[],"sourceRoot":"../../../src","sources":["toggle-button/types.ts"],"mappings":"","ignoreList":[]}
@@ -0,0 +1,80 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.getRovingFocusValue = getRovingFocusValue;
7
+ exports.useToggleButtonGroupNavigation = useToggleButtonGroupNavigation;
8
+ var _react = require("react");
9
+ function isEnabledItemValue(value, enabledItems) {
10
+ return value != null && enabledItems.some(([itemValue]) => itemValue === value);
11
+ }
12
+
13
+ /** Resolves which item value should hold the roving tab stop / keyboard focus anchor. */
14
+ function getRovingFocusValue(focusedValue, anchorValue, enabledItems) {
15
+ const defaultFocusValue = isEnabledItemValue(anchorValue, enabledItems) ? anchorValue : enabledItems[0]?.[0];
16
+ const resolvedFocusedValue = isEnabledItemValue(focusedValue, enabledItems) ? focusedValue : undefined;
17
+ return resolvedFocusedValue ?? defaultFocusValue;
18
+ }
19
+ function useToggleButtonGroupNavigation({
20
+ type,
21
+ orientation,
22
+ getItems,
23
+ focusedValue,
24
+ setFocusedValue,
25
+ anchorValue,
26
+ selectOnFocus
27
+ }) {
28
+ const selectOnFocusRef = (0, _react.useRef)(selectOnFocus);
29
+ selectOnFocusRef.current = selectOnFocus;
30
+ const getEnabledItems = (0, _react.useCallback)(() => getItems().filter(([, entry]) => !entry.disabled), [getItems]);
31
+ const moveFocus = (0, _react.useCallback)(([targetValue, targetEntry], shouldSelect) => {
32
+ setFocusedValue(targetValue);
33
+ targetEntry.node?.focus?.();
34
+ if (shouldSelect) {
35
+ selectOnFocusRef.current?.(targetValue);
36
+ }
37
+ }, [setFocusedValue]);
38
+ const handleKeyDown = (0, _react.useCallback)(e => {
39
+ const enabledItems = getEnabledItems();
40
+ if (enabledItems.length === 0) {
41
+ return;
42
+ }
43
+ const currentValue = getRovingFocusValue(focusedValue, anchorValue, enabledItems);
44
+ const idx = enabledItems.findIndex(([value]) => value === currentValue);
45
+ const shouldSelectOnFocus = type === 'single';
46
+ const nextKeys = orientation === 'vertical' ? ['ArrowDown'] : ['ArrowRight', 'ArrowDown'];
47
+ const prevKeys = orientation === 'vertical' ? ['ArrowUp'] : ['ArrowLeft', 'ArrowUp'];
48
+ if (nextKeys.includes(e.key)) {
49
+ e.preventDefault();
50
+ moveFocus(enabledItems[idx < enabledItems.length - 1 ? idx + 1 : 0], shouldSelectOnFocus);
51
+ return;
52
+ }
53
+ if (prevKeys.includes(e.key)) {
54
+ e.preventDefault();
55
+ moveFocus(enabledItems[idx > 0 ? idx - 1 : enabledItems.length - 1], shouldSelectOnFocus);
56
+ return;
57
+ }
58
+ switch (e.key) {
59
+ case 'Home':
60
+ {
61
+ e.preventDefault();
62
+ moveFocus(enabledItems[0], shouldSelectOnFocus);
63
+ break;
64
+ }
65
+ case 'End':
66
+ {
67
+ e.preventDefault();
68
+ const last = enabledItems.at(-1);
69
+ if (last) {
70
+ moveFocus(last, shouldSelectOnFocus);
71
+ }
72
+ break;
73
+ }
74
+ }
75
+ }, [anchorValue, focusedValue, getEnabledItems, moveFocus, orientation, type]);
76
+ return {
77
+ handleKeyDown
78
+ };
79
+ }
80
+ //# sourceMappingURL=useToggleButtonGroupNavigation.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_react","require","isEnabledItemValue","value","enabledItems","some","itemValue","getRovingFocusValue","focusedValue","anchorValue","defaultFocusValue","resolvedFocusedValue","undefined","useToggleButtonGroupNavigation","type","orientation","getItems","setFocusedValue","selectOnFocus","selectOnFocusRef","useRef","current","getEnabledItems","useCallback","filter","entry","disabled","moveFocus","targetValue","targetEntry","shouldSelect","node","focus","handleKeyDown","e","length","currentValue","idx","findIndex","shouldSelectOnFocus","nextKeys","prevKeys","includes","key","preventDefault","last","at"],"sourceRoot":"../../../src","sources":["toggle-button/useToggleButtonGroupNavigation.ts"],"mappings":"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","ignoreList":[]}
@@ -30,6 +30,7 @@ export * from './select';
30
30
  export * from './switch';
31
31
  export * from './tabs';
32
32
  export * from './tile';
33
+ export * from './toggle-button';
33
34
  export * from './toast';
34
35
  export * from './tooltip';
35
36
  export * from './portal';
@@ -1 +1 @@
1
- {"version":3,"names":["MODAL_OVERLAY_Z_INDEX","NOTIFICATION_OVERLAY_Z_INDEX","OVERLAY_PLACEMENTS","getAnchoredOverlayPosition","OverlayContainer","OverlayInsetsProvider","OverlayStackProvider","useAnchorPosition","useAnchoredOverlay","useDismissOverlay","useEscapeKey","useOverlayStackRegistration","useOverlayPosition","FormControlContext","useFormControlContext","dataAttributes","mergeDataAttributes","domDataAttributes","mergeDomDataAttributes","mapViewPropsToDom","assignRef","createPortalFn","Slot"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,uBAAuB;AACrC,cAAc,SAAS;AACvB,cAAc,aAAa;AAC3B,cAAc,cAAc;AAC5B,cAAc,YAAY;AAC1B,cAAc,kBAAkB;AAChC,cAAc,kBAAkB;AAChC,cAAc,eAAe;AAC7B,cAAc,qBAAqB;AACnC,cAAc,gBAAgB;AAC9B,cAAc,mBAAmB;AACjC,cAAc,kBAAkB;AAChC,cAAc,oBAAoB;AAClC,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,QAAQ;AACtB,SACEA,qBAAqB,EACrBC,4BAA4B,EAC5BC,kBAAkB,EAElBC,0BAA0B,EAC1BC,gBAAgB,EAChBC,qBAAqB,EACrBC,oBAAoB,EACpBC,iBAAiB,EACjBC,kBAAkB,EAClBC,iBAAiB,EACjBC,YAAY,EACZC,2BAA2B,EAC3BC,kBAAkB,QAmBb,WAAW;AAClB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,gBAAgB;AAC9B,cAAc,SAAS;AACvB,cAAc,aAAa;AAC3B,cAAc,UAAU;AAExB,SAASC,kBAAkB,EAAEC,qBAAqB,QAAQ,eAAe;AACzE,SAASC,cAAc,EAAEC,mBAAmB,QAAQ,wBAAwB;AAC5E,SACEC,iBAAiB,EACjBC,sBAAsB,QAEjB,2BAA2B;AAClC,SAASC,iBAAiB,QAAuC,2BAA2B;AAC5F,SAASC,SAAS,QAAQ,mBAAmB;AAC7C,SAASC,cAAc,QAAQ,sBAAsB;AACrD,SAASC,IAAI,QAAQ,QAAQ","ignoreList":[]}
1
+ {"version":3,"names":["MODAL_OVERLAY_Z_INDEX","NOTIFICATION_OVERLAY_Z_INDEX","OVERLAY_PLACEMENTS","getAnchoredOverlayPosition","OverlayContainer","OverlayInsetsProvider","OverlayStackProvider","useAnchorPosition","useAnchoredOverlay","useDismissOverlay","useEscapeKey","useOverlayStackRegistration","useOverlayPosition","FormControlContext","useFormControlContext","dataAttributes","mergeDataAttributes","domDataAttributes","mergeDomDataAttributes","mapViewPropsToDom","assignRef","createPortalFn","Slot"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,uBAAuB;AACrC,cAAc,SAAS;AACvB,cAAc,aAAa;AAC3B,cAAc,cAAc;AAC5B,cAAc,YAAY;AAC1B,cAAc,kBAAkB;AAChC,cAAc,kBAAkB;AAChC,cAAc,eAAe;AAC7B,cAAc,qBAAqB;AACnC,cAAc,gBAAgB;AAC9B,cAAc,mBAAmB;AACjC,cAAc,kBAAkB;AAChC,cAAc,oBAAoB;AAClC,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,QAAQ;AACtB,SACEA,qBAAqB,EACrBC,4BAA4B,EAC5BC,kBAAkB,EAElBC,0BAA0B,EAC1BC,gBAAgB,EAChBC,qBAAqB,EACrBC,oBAAoB,EACpBC,iBAAiB,EACjBC,kBAAkB,EAClBC,iBAAiB,EACjBC,YAAY,EACZC,2BAA2B,EAC3BC,kBAAkB,QAmBb,WAAW;AAClB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,iBAAiB;AAC/B,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,gBAAgB;AAC9B,cAAc,SAAS;AACvB,cAAc,aAAa;AAC3B,cAAc,UAAU;AAExB,SAASC,kBAAkB,EAAEC,qBAAqB,QAAQ,eAAe;AACzE,SAASC,cAAc,EAAEC,mBAAmB,QAAQ,wBAAwB;AAC5E,SACEC,iBAAiB,EACjBC,sBAAsB,QAEjB,2BAA2B;AAClC,SAASC,iBAAiB,QAAuC,2BAA2B;AAC5F,SAASC,SAAS,QAAQ,mBAAmB;AAC7C,SAASC,cAAc,QAAQ,sBAAsB;AACrD,SAASC,IAAI,QAAQ,QAAQ","ignoreList":[]}
@@ -0,0 +1,181 @@
1
+ "use strict";
2
+
3
+ import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';
4
+ import { Platform, View } from 'react-native';
5
+ import { composeEventHandlers, useControllableState } from '@cdx-ui/utils';
6
+ import { Slot } from '../slot';
7
+ import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
8
+ import { ToggleButtonGroupContextProvider } from './context';
9
+ import { useToggleButtonGroupNavigation } from './useToggleButtonGroupNavigation';
10
+ import { jsx as _jsx } from "react/jsx-runtime";
11
+ // Map insertion order drifts when an item re-registers (e.g. its disabled state changes)
12
+ // or mounts conditionally, so navigation order is derived from document position instead.
13
+ function getItemsInRenderedOrder(items) {
14
+ const entries = Array.from(items.entries());
15
+ if (Platform.OS !== 'web' || typeof Node === 'undefined') {
16
+ return entries;
17
+ }
18
+ return entries.sort(([, first], [, second]) => {
19
+ const firstNode = first.node;
20
+ const secondNode = second.node;
21
+ if (!firstNode?.compareDocumentPosition || !secondNode) {
22
+ return 0;
23
+ }
24
+ const position = firstNode.compareDocumentPosition(secondNode);
25
+ if (position & Node.DOCUMENT_POSITION_FOLLOWING) {
26
+ return -1;
27
+ }
28
+ if (position & Node.DOCUMENT_POSITION_PRECEDING) {
29
+ return 1;
30
+ }
31
+ return 0;
32
+ });
33
+ }
34
+ function getAnchorValue(type, state) {
35
+ if (type === 'single') {
36
+ return typeof state === 'string' ? state : undefined;
37
+ }
38
+ if (Array.isArray(state) && state.length > 0) {
39
+ return state[0];
40
+ }
41
+ return undefined;
42
+ }
43
+ export const ToggleButtonGroup = /*#__PURE__*/forwardRef((props, ref) => {
44
+ const {
45
+ asChild = false,
46
+ children,
47
+ className,
48
+ style,
49
+ type: typeProp = 'single',
50
+ value: valueProp,
51
+ defaultValue,
52
+ onValueChange,
53
+ isDisabled = false,
54
+ orientation = 'horizontal',
55
+ 'aria-label': ariaLabel,
56
+ 'aria-labelledby': ariaLabelledBy,
57
+ ...rest
58
+ } = props;
59
+ const type = typeProp;
60
+ const defaultProp = defaultValue !== undefined ? defaultValue : type === 'multiple' ? [] : undefined;
61
+ const [state, setState] = useControllableState({
62
+ prop: valueProp,
63
+ defaultProp,
64
+ onChange: next => {
65
+ if (next !== undefined) {
66
+ onValueChange?.(next);
67
+ }
68
+ }
69
+ });
70
+ const [focusedValue, setFocusedValue] = useState(undefined);
71
+ const [registrationEpoch, setRegistrationEpoch] = useState(0);
72
+ const itemsRef = useRef(new Map());
73
+
74
+ // Single-select: if the parent changes `value`, drop a stale roving tab stop so
75
+ // arrow keys follow the selected item. Multiple-select keeps focus on the last
76
+ // pressed/focused item even when it is no longer selected.
77
+ useEffect(() => {
78
+ if (type !== 'single') {
79
+ return;
80
+ }
81
+ const selectedId = typeof state === 'string' ? state : undefined;
82
+ setFocusedValue(prev => prev !== undefined && prev !== selectedId ? undefined : prev);
83
+ }, [type, state]);
84
+ const getItems = useCallback(() => getItemsInRenderedOrder(itemsRef.current), [registrationEpoch]);
85
+ const registerItem = useCallback((itemValue, entry) => {
86
+ itemsRef.current.set(itemValue, entry);
87
+ setRegistrationEpoch(epoch => epoch + 1);
88
+ }, []);
89
+ const unregisterItem = useCallback(itemValue => {
90
+ itemsRef.current.delete(itemValue);
91
+ setRegistrationEpoch(epoch => epoch + 1);
92
+ }, []);
93
+ const isSelected = useCallback(buttonValue => {
94
+ if (type === 'single') {
95
+ return state === buttonValue;
96
+ }
97
+ return Array.isArray(state) && state.includes(buttonValue);
98
+ }, [type, state]);
99
+ const toggleValue = useCallback(buttonValue => {
100
+ if (isDisabled) {
101
+ return;
102
+ }
103
+ if (type === 'single') {
104
+ if (state === buttonValue) {
105
+ return;
106
+ }
107
+ setState(buttonValue);
108
+ return;
109
+ }
110
+ const arr = Array.isArray(state) ? [...state] : [];
111
+ const idx = arr.indexOf(buttonValue);
112
+ if (idx >= 0) {
113
+ arr.splice(idx, 1);
114
+ setState(arr);
115
+ } else {
116
+ arr.push(buttonValue);
117
+ setState(arr);
118
+ }
119
+ }, [isDisabled, type, state, setState]);
120
+ const anchorValue = getAnchorValue(type, state);
121
+ const {
122
+ handleKeyDown
123
+ } = useToggleButtonGroupNavigation({
124
+ type,
125
+ orientation,
126
+ getItems,
127
+ focusedValue,
128
+ setFocusedValue,
129
+ anchorValue,
130
+ selectOnFocus: type === 'single' ? toggleValue : undefined
131
+ });
132
+ const webProps = Platform.OS === 'web' ? {
133
+ onKeyDown: composeEventHandlers(rest.onKeyDown, handleKeyDown)
134
+ } : {};
135
+ const contextValue = useMemo(() => ({
136
+ type,
137
+ orientation,
138
+ value: state,
139
+ toggleValue,
140
+ isSelected,
141
+ isGroupDisabled: isDisabled,
142
+ focusedValue,
143
+ setFocusedValue,
144
+ registerItem,
145
+ unregisterItem,
146
+ getItems
147
+ }), [type, orientation, state, toggleValue, isSelected, isDisabled, focusedValue, registerItem, unregisterItem, getItems]);
148
+
149
+ // `AccessibilityRole` has no `group` member, so multiple-select relies on the `role` prop,
150
+ // which RN resolves natively and ranks above `accessibilityRole`.
151
+ const role = rest.role ?? (type === 'single' ? 'radiogroup' : 'group');
152
+ const Comp = asChild ? Slot : View;
153
+ return /*#__PURE__*/_jsx(ToggleButtonGroupContextProvider, {
154
+ value: contextValue,
155
+ children: /*#__PURE__*/_jsx(Comp, {
156
+ ref: ref,
157
+ ...rest,
158
+ role: role,
159
+ ...(type === 'single' ? {
160
+ accessibilityRole: 'radiogroup'
161
+ } : {}),
162
+ ...(ariaLabel ? {
163
+ 'aria-label': ariaLabel,
164
+ accessibilityLabel: ariaLabel
165
+ } : {}),
166
+ ...(ariaLabelledBy ? {
167
+ 'aria-labelledby': ariaLabelledBy
168
+ } : {}),
169
+ className: className,
170
+ style: style,
171
+ ...mergeDataAttributes(rest, dataAttributes({
172
+ orientation,
173
+ disabled: isDisabled
174
+ })),
175
+ ...webProps,
176
+ children: children
177
+ })
178
+ });
179
+ });
180
+ ToggleButtonGroup.displayName = 'ToggleButtonGroup';
181
+ //# sourceMappingURL=ToggleButtonGroup.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["forwardRef","useCallback","useEffect","useMemo","useRef","useState","Platform","View","composeEventHandlers","useControllableState","Slot","dataAttributes","mergeDataAttributes","ToggleButtonGroupContextProvider","useToggleButtonGroupNavigation","jsx","_jsx","getItemsInRenderedOrder","items","entries","Array","from","OS","Node","sort","first","second","firstNode","node","secondNode","compareDocumentPosition","position","DOCUMENT_POSITION_FOLLOWING","DOCUMENT_POSITION_PRECEDING","getAnchorValue","type","state","undefined","isArray","length","ToggleButtonGroup","props","ref","asChild","children","className","style","typeProp","value","valueProp","defaultValue","onValueChange","isDisabled","orientation","ariaLabel","ariaLabelledBy","rest","defaultProp","setState","prop","onChange","next","focusedValue","setFocusedValue","registrationEpoch","setRegistrationEpoch","itemsRef","Map","selectedId","prev","getItems","current","registerItem","itemValue","entry","set","epoch","unregisterItem","delete","isSelected","buttonValue","includes","toggleValue","arr","idx","indexOf","splice","push","anchorValue","handleKeyDown","selectOnFocus","webProps","onKeyDown","contextValue","isGroupDisabled","role","Comp","accessibilityRole","accessibilityLabel","disabled","displayName"],"sourceRoot":"../../../src","sources":["toggle-button/ToggleButtonGroup.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,127 @@
1
+ "use strict";
2
+
3
+ import { forwardRef, useMemo } from 'react';
4
+ import { Pressable } from 'react-native';
5
+ import { composeEventHandlers, useControllableState } from '@cdx-ui/utils';
6
+ import { useFocus, useFocusRing } from '@react-native-aria/focus';
7
+ import { useHover, usePress } from '@react-native-aria/interactions';
8
+ import { Slot } from '../slot';
9
+ import { dataAttributes, mergeDataAttributes } from '../utils/dataAttributes';
10
+ import { ToggleButtonProvider, useOptionalToggleButtonGroupContext } from './context';
11
+ import { getToggleState } from './toggleState';
12
+ import { jsx as _jsx } from "react/jsx-runtime";
13
+ export const ToggleButtonRoot = /*#__PURE__*/forwardRef(({
14
+ asChild = false,
15
+ value,
16
+ isSelected: controlledSelected,
17
+ defaultSelected,
18
+ onSelectedChange,
19
+ isDisabled: isDisabledProp = false,
20
+ children,
21
+ onPress,
22
+ onFocus,
23
+ onBlur,
24
+ style,
25
+ ...rest
26
+ }, ref) => {
27
+ const group = useOptionalToggleButtonGroupContext();
28
+ const [standaloneSelected = false, setStandaloneSelected] = useControllableState({
29
+ prop: controlledSelected,
30
+ defaultProp: defaultSelected ?? false,
31
+ onChange: next => {
32
+ onSelectedChange?.(next);
33
+ }
34
+ });
35
+ const isSelected = group ? group.isSelected(value) : standaloneSelected;
36
+ const isDisabled = (group?.isGroupDisabled ?? false) || isDisabledProp;
37
+ const {
38
+ focusProps,
39
+ isFocused
40
+ } = useFocus();
41
+ const {
42
+ isFocusVisible,
43
+ focusProps: focusRingProps
44
+ } = useFocusRing();
45
+ const {
46
+ pressProps,
47
+ isPressed
48
+ } = usePress({
49
+ isDisabled
50
+ });
51
+ const {
52
+ hoverProps,
53
+ isHovered
54
+ } = useHover();
55
+ const selectionType = group ? group.type : 'standalone';
56
+ const role = selectionType === 'single' ? 'radio' : 'button';
57
+ const accessibilityState = useMemo(() => ({
58
+ disabled: isDisabled,
59
+ ...(selectionType === 'single' ? {
60
+ checked: isSelected,
61
+ selected: isSelected
62
+ } : {
63
+ selected: isSelected
64
+ })
65
+ }), [isDisabled, isSelected, selectionType]);
66
+ const ariaProps = selectionType === 'single' ? {
67
+ 'aria-checked': isSelected
68
+ } : {
69
+ 'aria-pressed': isSelected
70
+ };
71
+ const toggleButtonContext = useMemo(() => ({
72
+ value,
73
+ isSelected,
74
+ isDisabled,
75
+ selectionType,
76
+ hover: isHovered,
77
+ active: isPressed,
78
+ focus: isFocused,
79
+ focusVisible: isFocusVisible
80
+ }), [value, isSelected, isDisabled, selectionType, isHovered, isPressed, isFocused, isFocusVisible]);
81
+ const composedOnPress = composeEventHandlers(onPress, () => {
82
+ if (isDisabled) {
83
+ return;
84
+ }
85
+ if (group) {
86
+ group.toggleValue(value);
87
+ } else {
88
+ setStandaloneSelected(!standaloneSelected);
89
+ }
90
+ });
91
+ const Comp = asChild ? Slot : Pressable;
92
+ return /*#__PURE__*/_jsx(ToggleButtonProvider, {
93
+ value: toggleButtonContext,
94
+ children: /*#__PURE__*/_jsx(Comp, {
95
+ ref: ref,
96
+ accessibilityRole: role,
97
+ role: role,
98
+ accessibilityState: accessibilityState,
99
+ ...ariaProps,
100
+ ...(isDisabled ? {
101
+ 'aria-disabled': true
102
+ } : {}),
103
+ disabled: isDisabled,
104
+ ...rest,
105
+ ...mergeDataAttributes(rest, dataAttributes({
106
+ selected: isSelected,
107
+ disabled: isDisabled,
108
+ active: isPressed,
109
+ hover: isHovered,
110
+ focus: isFocused,
111
+ focusVisible: isFocusVisible,
112
+ toggleState: getToggleState(isSelected, isPressed, isHovered)
113
+ })),
114
+ style: style,
115
+ onPress: isDisabled ? undefined : composedOnPress,
116
+ onPressIn: composeEventHandlers(rest.onPressIn, pressProps.onPressIn),
117
+ onPressOut: composeEventHandlers(rest.onPressOut, pressProps.onPressOut),
118
+ onHoverIn: composeEventHandlers(rest.onHoverIn, hoverProps.onHoverIn),
119
+ onHoverOut: composeEventHandlers(rest.onHoverOut, hoverProps.onHoverOut),
120
+ onFocus: composeEventHandlers(composeEventHandlers(onFocus, focusProps.onFocus), focusRingProps.onFocus),
121
+ onBlur: composeEventHandlers(composeEventHandlers(onBlur, focusProps.onBlur), focusRingProps.onBlur),
122
+ children: children
123
+ })
124
+ });
125
+ });
126
+ ToggleButtonRoot.displayName = 'ToggleButtonRoot';
127
+ //# sourceMappingURL=ToggleButtonRoot.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["forwardRef","useMemo","Pressable","composeEventHandlers","useControllableState","useFocus","useFocusRing","useHover","usePress","Slot","dataAttributes","mergeDataAttributes","ToggleButtonProvider","useOptionalToggleButtonGroupContext","getToggleState","jsx","_jsx","ToggleButtonRoot","asChild","value","isSelected","controlledSelected","defaultSelected","onSelectedChange","isDisabled","isDisabledProp","children","onPress","onFocus","onBlur","style","rest","ref","group","standaloneSelected","setStandaloneSelected","prop","defaultProp","onChange","next","isGroupDisabled","focusProps","isFocused","isFocusVisible","focusRingProps","pressProps","isPressed","hoverProps","isHovered","selectionType","type","role","accessibilityState","disabled","checked","selected","ariaProps","toggleButtonContext","hover","active","focus","focusVisible","composedOnPress","toggleValue","Comp","accessibilityRole","toggleState","undefined","onPressIn","onPressOut","onHoverIn","onHoverOut","displayName"],"sourceRoot":"../../../src","sources":["toggle-button/ToggleButtonRoot.tsx"],"mappings":"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","ignoreList":[]}