@cdx-ui/primitives 0.0.1-alpha.7 → 0.0.1-alpha.9

package/lib/commonjs/index.js

@@ -61,4 +61,16 @@ Object.keys(_select).forEach(function (key) {
     }
   });
 });
+var _switch = require("./switch");
+Object.keys(_switch).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _switch[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _switch[key];
+    }
+  });
+});
 //# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_button","require","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get","_checkbox","_input","_overlay","_select"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;;;;;;;;;;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAb,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAS,SAAA,GAAAb,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAW,SAAA,EAAAV,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAS,SAAA,CAAAT,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,SAAA,CAAAT,GAAA;IAAA;EAAA;AAAA;AACA,IAAAU,MAAA,GAAAd,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAY,MAAA,EAAAX,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAU,MAAA,CAAAV,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAE,MAAA,CAAAV,GAAA;IAAA;EAAA;AAAA;AACA,IAAAW,QAAA,GAAAf,OAAA;AACA,IAAAgB,OAAA,GAAAhB,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAc,OAAA,EAAAb,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAY,OAAA,CAAAZ,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAI,OAAA,CAAAZ,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
+{"version":3,"names":["_button","require","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get","_checkbox","_input","_overlay","_select","_switch"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;;;;;;;;;;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,OAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAL,OAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAb,OAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAS,SAAA,GAAAb,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAW,SAAA,EAAAV,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAS,SAAA,CAAAT,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,SAAA,CAAAT,GAAA;IAAA;EAAA;AAAA;AACA,IAAAU,MAAA,GAAAd,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAY,MAAA,EAAAX,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAU,MAAA,CAAAV,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAE,MAAA,CAAAV,GAAA;IAAA;EAAA;AAAA;AACA,IAAAW,QAAA,GAAAf,OAAA;AACA,IAAAgB,OAAA,GAAAhB,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAc,OAAA,EAAAb,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAY,OAAA,CAAAZ,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAI,OAAA,CAAAZ,GAAA;IAAA;EAAA;AAAA;AACA,IAAAa,OAAA,GAAAjB,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAe,OAAA,EAAAd,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAa,OAAA,CAAAb,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAK,OAAA,CAAAb,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/lib/commonjs/switch/createSwitchRoot.js

@@ -0,0 +1,73 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createSwitchRoot = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _focus = require("@react-native-aria/focus");
+var _interactions = require("@react-native-aria/interactions");
+var _toggle = require("@react-stately/toggle");
+var _utils = require("@cdx-ui/utils");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const createSwitchRoot = BaseSwitch => /*#__PURE__*/(0, _react.forwardRef)(({
+  disabled,
+  isDisabled,
+  isChecked,
+  isInvalid,
+  defaultValue,
+  value,
+  onValueChange,
+  ...props
+}, ref) => {
+  const formControlContext = (0, _utils.useFormControlContext)();
+  const combinedProps = {
+    ...formControlContext,
+    ...props
+  };
+  const controlledValue = value ?? isChecked;
+  const state = (0, _toggle.useToggleState)({
+    defaultSelected: defaultValue ?? false,
+    isSelected: controlledValue,
+    onChange: onValueChange
+  });
+  const checked = controlledValue ?? state.isSelected;
+  const _ref = _react.default.useRef(null);
+  const {
+    isHovered
+  } = (0, _interactions.useHover)({}, _ref);
+  const {
+    isFocusVisible,
+    focusProps
+  } = (0, _focus.useFocusRing)();
+  const mergedRef = (0, _utils.mergeRefs)(ref, _ref);
+  const isDisabledResolved = disabled || isDisabled || combinedProps.isDisabled;
+  const isInvalidResolved = isInvalid || combinedProps.isInvalid;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(BaseSwitch, {
+    states: {
+      hover: isHovered,
+      disabled: isDisabledResolved,
+      invalid: isInvalidResolved,
+      checked,
+      focusVisible: isFocusVisible
+    },
+    dataSet: {
+      hover: isHovered ? 'true' : 'false',
+      disabled: isDisabledResolved ? 'true' : 'false',
+      invalid: isInvalidResolved ? 'true' : 'false',
+      checked: checked ? 'true' : 'false',
+      'focus-visible': isFocusVisible ? 'true' : 'false'
+    },
+    disabled: isDisabledResolved,
+    ...focusProps,
+    onValueChange: val => {
+      state.setSelected(val);
+    },
+    value: checked,
+    ...combinedProps,
+    ref: mergedRef
+  });
+});
+exports.createSwitchRoot = createSwitchRoot;
+//# sourceMappingURL=createSwitchRoot.js.map

package/lib/commonjs/switch/createSwitchRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_focus","_interactions","_toggle","_utils","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","createSwitchRoot","BaseSwitch","forwardRef","disabled","isDisabled","isChecked","isInvalid","defaultValue","value","onValueChange","props","ref","formControlContext","useFormControlContext","combinedProps","controlledValue","state","useToggleState","defaultSelected","isSelected","onChange","checked","_ref","React","useRef","isHovered","useHover","isFocusVisible","focusProps","useFocusRing","mergedRef","mergeRefs","isDisabledResolved","isInvalidResolved","jsx","states","hover","invalid","focusVisible","dataSet","val","setSelected","exports"],"sourceRoot":"../../../src","sources":["switch/createSwitchRoot.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/switch/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createSwitch = createSwitch;
+var _createSwitchRoot = require("./createSwitchRoot");
+function createSwitch({
+  Root
+}) {
+  const Switch = (0, _createSwitchRoot.createSwitchRoot)(Root);
+  Switch.displayName = 'Switch';
+  return Switch;
+}
+//# sourceMappingURL=index.js.map

package/lib/commonjs/switch/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_createSwitchRoot","require","createSwitch","Root","Switch","createSwitchRoot","displayName"],"sourceRoot":"../../../src","sources":["switch/index.ts"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,OAAA;AAKO,SAASC,YAAYA,CAAiB;EAC3CC;AAGF,CAAC,EAA8B;EAC7B,MAAMC,MAAM,GAAG,IAAAC,kCAAgB,EAACF,IAAI,CAAC;EAErCC,MAAM,CAACE,WAAW,GAAG,QAAQ;EAC7B,OAAOF,MAAM;AACf","ignoreList":[]}

package/lib/commonjs/switch/types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

package/lib/commonjs/switch/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../src","sources":["switch/types.ts"],"mappings":"","ignoreList":[]}

package/lib/module/index.js

@@ -5,4 +5,5 @@ export * from './checkbox';
 export * from './input';
 export { OverlayInsetsProvider } from './overlay';
 export * from './select';
+export * from './switch';
 //# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["OverlayInsetsProvider"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,SAAS;AACvB,SAA0BA,qBAAqB,QAAQ,WAAW;AAClE,cAAc,UAAU","ignoreList":[]}
+{"version":3,"names":["OverlayInsetsProvider"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,cAAc,UAAU;AACxB,cAAc,YAAY;AAC1B,cAAc,SAAS;AACvB,SAA0BA,qBAAqB,QAAQ,WAAW;AAClE,cAAc,UAAU;AACxB,cAAc,UAAU","ignoreList":[]}

package/lib/module/switch/createSwitchRoot.js

@@ -0,0 +1,67 @@
+"use strict";
+
+import React, { forwardRef } from 'react';
+import { useFocusRing } from '@react-native-aria/focus';
+import { useHover } from '@react-native-aria/interactions';
+import { useToggleState } from '@react-stately/toggle';
+import { useFormControlContext, mergeRefs } from '@cdx-ui/utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const createSwitchRoot = BaseSwitch => /*#__PURE__*/forwardRef(({
+  disabled,
+  isDisabled,
+  isChecked,
+  isInvalid,
+  defaultValue,
+  value,
+  onValueChange,
+  ...props
+}, ref) => {
+  const formControlContext = useFormControlContext();
+  const combinedProps = {
+    ...formControlContext,
+    ...props
+  };
+  const controlledValue = value ?? isChecked;
+  const state = useToggleState({
+    defaultSelected: defaultValue ?? false,
+    isSelected: controlledValue,
+    onChange: onValueChange
+  });
+  const checked = controlledValue ?? state.isSelected;
+  const _ref = React.useRef(null);
+  const {
+    isHovered
+  } = useHover({}, _ref);
+  const {
+    isFocusVisible,
+    focusProps
+  } = useFocusRing();
+  const mergedRef = mergeRefs(ref, _ref);
+  const isDisabledResolved = disabled || isDisabled || combinedProps.isDisabled;
+  const isInvalidResolved = isInvalid || combinedProps.isInvalid;
+  return /*#__PURE__*/_jsx(BaseSwitch, {
+    states: {
+      hover: isHovered,
+      disabled: isDisabledResolved,
+      invalid: isInvalidResolved,
+      checked,
+      focusVisible: isFocusVisible
+    },
+    dataSet: {
+      hover: isHovered ? 'true' : 'false',
+      disabled: isDisabledResolved ? 'true' : 'false',
+      invalid: isInvalidResolved ? 'true' : 'false',
+      checked: checked ? 'true' : 'false',
+      'focus-visible': isFocusVisible ? 'true' : 'false'
+    },
+    disabled: isDisabledResolved,
+    ...focusProps,
+    onValueChange: val => {
+      state.setSelected(val);
+    },
+    value: checked,
+    ...combinedProps,
+    ref: mergedRef
+  });
+});
+//# sourceMappingURL=createSwitchRoot.js.map

package/lib/module/switch/createSwitchRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","forwardRef","useFocusRing","useHover","useToggleState","useFormControlContext","mergeRefs","jsx","_jsx","createSwitchRoot","BaseSwitch","disabled","isDisabled","isChecked","isInvalid","defaultValue","value","onValueChange","props","ref","formControlContext","combinedProps","controlledValue","state","defaultSelected","isSelected","onChange","checked","_ref","useRef","isHovered","isFocusVisible","focusProps","mergedRef","isDisabledResolved","isInvalidResolved","states","hover","invalid","focusVisible","dataSet","val","setSelected"],"sourceRoot":"../../../src","sources":["switch/createSwitchRoot.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,YAAY,QAAQ,0BAA0B;AACvD,SAASC,QAAQ,QAAQ,iCAAiC;AAC1D,SAASC,cAAc,QAAQ,uBAAuB;AACtD,SAASC,qBAAqB,EAAEC,SAAS,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAKjE,OAAO,MAAMC,gBAAgB,GAAoBC,UAAkC,iBACjFT,UAAU,CACR,CACE;EACEU,QAAQ;EACRC,UAAU;EACVC,SAAS;EACTC,SAAS;EACTC,YAAY;EACZC,KAAK;EACLC,aAAa;EACb,GAAGC;AACS,CAAC,EACfC,GAA0B,KACvB;EACH,MAAMC,kBAAkB,GAAGf,qBAAqB,CAAC,CAAC;EAClD,MAAMgB,aAAa,GAAG;IAAE,GAAGD,kBAAkB;IAAE,GAAGF;EAAM,CAAC;EACzD,MAAMI,eAAe,GAAGN,KAAK,IAAIH,SAAS;EAC1C,MAAMU,KAAK,GAAGnB,cAAc,CAAC;IAC3BoB,eAAe,EAAET,YAAY,IAAI,KAAK;IACtCU,UAAU,EAAEH,eAAe;IAC3BI,QAAQ,EAAET;EACZ,CAAC,CAAC;EAEF,MAAMU,OAAO,GAAGL,eAAe,IAAIC,KAAK,CAACE,UAAU;EAEnD,MAAMG,IAAI,GAAG5B,KAAK,CAAC6B,MAAM,CAAC,IAAI,CAAC;EAC/B,MAAM;IAAEC;EAAU,CAAC,GAAG3B,QAAQ,CAAC,CAAC,CAAC,EAAEyB,IAAI,CAAC;EACxC,MAAM;IAAEG,cAAc;IAAEC;EAAW,CAAC,GAAG9B,YAAY,CAAC,CAAC;EAErD,MAAM+B,SAAS,GAAG3B,SAAS,CAACa,GAAG,EAAkBS,IAAI,CAAC;EAEtD,MAAMM,kBAAkB,GAAGvB,QAAQ,IAAIC,UAAU,IAAIS,aAAa,CAACT,UAAU;EAC7E,MAAMuB,iBAAiB,GAAGrB,SAAS,IAAIO,aAAa,CAACP,SAAS;EAE9D,oBACEN,IAAA,CAACE,UAAU;IACT0B,MAAM,EAAE;MACNC,KAAK,EAAEP,SAAS;MAChBnB,QAAQ,EAAEuB,kBAAkB;MAC5BI,OAAO,EAAEH,iBAAiB;MAC1BR,OAAO;MACPY,YAAY,EAAER;IAChB,CAAE;IACFS,OAAO,EAAE;MACPH,KAAK,EAAEP,SAAS,GAAG,MAAM,GAAG,OAAO;MACnCnB,QAAQ,EAAEuB,kBAAkB,GAAG,MAAM,GAAG,OAAO;MAC/CI,OAAO,EAAEH,iBAAiB,GAAG,MAAM,GAAG,OAAO;MAC7CR,OAAO,EAAEA,OAAO,GAAG,MAAM,GAAG,OAAO;MACnC,eAAe,EAAEI,cAAc,GAAG,MAAM,GAAG;IAC7C,CAAE;IACFpB,QAAQ,EAAEuB,kBAAmB;IAAA,GACzBF,UAAU;IACdf,aAAa,EAAGwB,GAAY,IAAK;MAC/BlB,KAAK,CAACmB,WAAW,CAACD,GAAG,CAAC;IACxB,CAAE;IACFzB,KAAK,EAAEW,OAAQ;IAAA,GACVN,aAAa;IAClBF,GAAG,EAAEc;EAA0B,CAChC,CAAC;AAEN,CACF,CAAC","ignoreList":[]}

package/lib/module/switch/index.js

@@ -0,0 +1,11 @@
+"use strict";
+
+import { createSwitchRoot } from './createSwitchRoot';
+export function createSwitch({
+  Root
+}) {
+  const Switch = createSwitchRoot(Root);
+  Switch.displayName = 'Switch';
+  return Switch;
+}
+//# sourceMappingURL=index.js.map

package/lib/module/switch/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createSwitchRoot","createSwitch","Root","Switch","displayName"],"sourceRoot":"../../../src","sources":["switch/index.ts"],"mappings":";;AACA,SAASA,gBAAgB,QAAQ,oBAAoB;AAKrD,OAAO,SAASC,YAAYA,CAAiB;EAC3CC;AAGF,CAAC,EAA8B;EAC7B,MAAMC,MAAM,GAAGH,gBAAgB,CAACE,IAAI,CAAC;EAErCC,MAAM,CAACC,WAAW,GAAG,QAAQ;EAC7B,OAAOD,MAAM;AACf","ignoreList":[]}

package/lib/module/switch/types.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=types.js.map

package/lib/module/switch/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../src","sources":["switch/types.ts"],"mappings":"","ignoreList":[]}

package/lib/typescript/index.d.ts

@@ -3,5 +3,6 @@ export * from './checkbox';
 export * from './input';
 export { type EdgeInsets, OverlayInsetsProvider } from './overlay';
 export * from './select';
+export * from './switch';
 export type { InteractionState } from './types';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,OAAO,EAAE,KAAK,UAAU,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAC;AACnE,cAAc,UAAU,CAAC;AACzB,YAAY,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,OAAO,EAAE,KAAK,UAAU,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAC;AACnE,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,YAAY,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC"}

package/lib/typescript/switch/createSwitchRoot.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const createSwitchRoot: <T, R = unknown>(BaseSwitch: React.ComponentType<T>) => React.ForwardRefExoticComponent<import("./types").IInterfaceSwitchProps & React.RefAttributes<R>>;
+//# sourceMappingURL=createSwitchRoot.d.ts.map

package/lib/typescript/switch/createSwitchRoot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createSwitchRoot.d.ts","sourceRoot":"","sources":["../../../src/switch/createSwitchRoot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAS1C,eAAO,MAAM,gBAAgB,GAAI,CAAC,EAAE,CAAC,GAAG,OAAO,EAAE,YAAY,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,sGA8DhF,CAAC"}

package/lib/typescript/switch/index.d.ts

@@ -0,0 +1,7 @@
+import type React from 'react';
+import type { ISwitchComponentType } from './types';
+export type { ISwitchProps, ISwitchComponentType, IInterfaceSwitchProps } from './types';
+export declare function createSwitch<T, R = unknown>({ Root, }: {
+    Root: React.ComponentType<T>;
+}): ISwitchComponentType<T, R>;
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/switch/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/switch/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAEpD,YAAY,EAAE,YAAY,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAEzF,wBAAgB,YAAY,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,EAAE,EAC3C,IAAI,GACL,EAAE;IACD,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;CAC9B,GAAG,oBAAoB,CAAC,CAAC,EAAE,CAAC,CAAC,CAK7B"}

package/lib/typescript/switch/types.d.ts

@@ -0,0 +1,38 @@
+import type React from 'react';
+export interface IInterfaceSwitchProps {
+    /**
+     * Callback invoked when the switch value changes.
+     */
+    onValueChange?: (value: boolean) => void;
+    /**
+     * If true, set the Switch to the checked state.
+     */
+    isChecked?: boolean;
+    /**
+     * The current value of the switch.
+     */
+    value?: boolean;
+    /**
+     * If true, the switch will be disabled.
+     */
+    isDisabled?: boolean;
+    /**
+     * If true, the switch will be disabled.
+     */
+    disabled?: boolean;
+    /**
+     * If true, the checkbox will be initially checked.
+     */
+    defaultValue?: boolean;
+    /**
+     * If true, set the switch to the invalid state.
+     */
+    isInvalid?: boolean;
+    /**
+     * If true, the switch will be hovered.
+     */
+    isHovered?: boolean;
+}
+export type ISwitchComponentType<T, R = unknown> = React.ForwardRefExoticComponent<React.PropsWithoutRef<T & IInterfaceSwitchProps> & React.RefAttributes<R>>;
+export type ISwitchProps = IInterfaceSwitchProps;
+//# sourceMappingURL=types.d.ts.map

package/lib/typescript/switch/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/switch/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,WAAW,qBAAqB;IACpC;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,oBAAoB,CAAC,CAAC,EAAE,CAAC,GAAG,OAAO,IAAI,KAAK,CAAC,yBAAyB,CAChF,KAAK,CAAC,eAAe,CAAC,CAAC,GAAG,qBAAqB,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAC1E,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,qBAAqB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cdx-ui/primitives",
-  "version": "0.0.1-alpha.7",
+  "version": "0.0.1-alpha.9",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
   "react-native": "src/index.ts",
@@ -52,7 +52,7 @@
     "@react-native-aria/interactions": "^0.2.16",
     "@react-stately/checkbox": "3.7.4",
     "@react-stately/toggle": "3.9.4",
-    "@cdx-ui/utils": "0.0.1-alpha.7"
+    "@cdx-ui/utils": "0.0.1-alpha.9"
   },
   "devDependencies": {
     "@types/react": "*",

package/src/index.ts

@@ -3,4 +3,5 @@ export * from './checkbox';
 export * from './input';
 export { type EdgeInsets, OverlayInsetsProvider } from './overlay';
 export * from './select';
+export * from './switch';
 export type { InteractionState } from './types';

package/src/switch/createSwitchRoot.tsx

@@ -0,0 +1,72 @@
+import React, { forwardRef } from 'react';
+import { useFocusRing } from '@react-native-aria/focus';
+import { useHover } from '@react-native-aria/interactions';
+import { useToggleState } from '@react-stately/toggle';
+import { useFormControlContext, mergeRefs } from '@cdx-ui/utils';
+import type { ISwitchProps } from './types';
+
+type MergeableRef = Parameters<typeof mergeRefs>[0];
+
+export const createSwitchRoot = <T, R = unknown>(BaseSwitch: React.ComponentType<T>) =>
+  forwardRef<R, ISwitchProps>(
+    (
+      {
+        disabled,
+        isDisabled,
+        isChecked,
+        isInvalid,
+        defaultValue,
+        value,
+        onValueChange,
+        ...props
+      }: ISwitchProps,
+      ref: React.ForwardedRef<R>,
+    ) => {
+      const formControlContext = useFormControlContext();
+      const combinedProps = { ...formControlContext, ...props };
+      const controlledValue = value ?? isChecked;
+      const state = useToggleState({
+        defaultSelected: defaultValue ?? false,
+        isSelected: controlledValue,
+        onChange: onValueChange,
+      });
+
+      const checked = controlledValue ?? state.isSelected;
+
+      const _ref = React.useRef(null);
+      const { isHovered } = useHover({}, _ref);
+      const { isFocusVisible, focusProps } = useFocusRing();
+
+      const mergedRef = mergeRefs(ref as MergeableRef, _ref);
+
+      const isDisabledResolved = disabled || isDisabled || combinedProps.isDisabled;
+      const isInvalidResolved = isInvalid || combinedProps.isInvalid;
+
+      return (
+        <BaseSwitch
+          states={{
+            hover: isHovered,
+            disabled: isDisabledResolved,
+            invalid: isInvalidResolved,
+            checked,
+            focusVisible: isFocusVisible,
+          }}
+          dataSet={{
+            hover: isHovered ? 'true' : 'false',
+            disabled: isDisabledResolved ? 'true' : 'false',
+            invalid: isInvalidResolved ? 'true' : 'false',
+            checked: checked ? 'true' : 'false',
+            'focus-visible': isFocusVisible ? 'true' : 'false',
+          }}
+          disabled={isDisabledResolved}
+          {...focusProps}
+          onValueChange={(val: boolean) => {
+            state.setSelected(val);
+          }}
+          value={checked}
+          {...(combinedProps as T)}
+          ref={mergedRef as React.Ref<R>}
+        />
+      );
+    },
+  );

package/src/switch/index.ts

@@ -0,0 +1,16 @@
+import type React from 'react';
+import { createSwitchRoot } from './createSwitchRoot';
+import type { ISwitchComponentType } from './types';
+
+export type { ISwitchProps, ISwitchComponentType, IInterfaceSwitchProps } from './types';
+
+export function createSwitch<T, R = unknown>({
+  Root,
+}: {
+  Root: React.ComponentType<T>;
+}): ISwitchComponentType<T, R> {
+  const Switch = createSwitchRoot(Root);
+
+  Switch.displayName = 'Switch';
+  return Switch as ISwitchComponentType<T, R>;
+}

package/src/switch/types.ts

@@ -0,0 +1,42 @@
+import type React from 'react';
+
+export interface IInterfaceSwitchProps {
+  /**
+   * Callback invoked when the switch value changes.
+   */
+  onValueChange?: (value: boolean) => void;
+  /**
+   * If true, set the Switch to the checked state.
+   */
+  isChecked?: boolean;
+  /**
+   * The current value of the switch.
+   */
+  value?: boolean;
+  /**
+   * If true, the switch will be disabled.
+   */
+  isDisabled?: boolean;
+  /**
+   * If true, the switch will be disabled.
+   */
+  disabled?: boolean;
+  /**
+   * If true, the checkbox will be initially checked.
+   */
+  defaultValue?: boolean;
+  /**
+   * If true, set the switch to the invalid state.
+   */
+  isInvalid?: boolean;
+  /**
+   * If true, the switch will be hovered.
+   */
+  isHovered?: boolean;
+}
+
+export type ISwitchComponentType<T, R = unknown> = React.ForwardRefExoticComponent<
+  React.PropsWithoutRef<T & IInterfaceSwitchProps> & React.RefAttributes<R>
+>;
+
+export type ISwitchProps = IInterfaceSwitchProps;