@radix-ui/react-switch 0.1.6-rc.1 → 0.1.6-rc.4

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"mappings":"A;A;A;AAoBA,OAAA,wFAAgF,CAAC;AAMjF,4BAA4B,MAAM,wBAAwB,CAAC,OAAO,UAAU,MAAM,CAAC,CAAC;AACpF,4BAAsB,SAAQ,oBAAoB;IAChD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC;CAC1C;AAED,OAAA,MAAM,6FAsEL,CAAC;AAWF,0BAA0B,MAAM,wBAAwB,CAAC,OAAO,UAAU,IAAI,CAAC,CAAC;AAChF,iCAA2B,SAAQ,kBAAkB;CAAG;AAExD,OAAA,MAAM,qGAaL,CAAC;AAwDF,OAAA,MAAM,2FAAa,CAAC;AACpB,OAAA,MAAM,+FAAmB,CAAC","sources":["./packages/react/switch/src/packages/react/switch/src/Switch.tsx","./packages/react/switch/src/packages/react/switch/src/index.ts"],"sourcesContent":[null,null],"names":[],"version":3,"file":"index.d.ts.map"}
+{"mappings":";;;AAoBA,OAAA,wFAAgF,CAAC;AAMjF,4BAA4B,MAAM,wBAAwB,CAAC,OAAO,UAAU,MAAM,CAAC,CAAC;AACpF,4BAAsB,SAAQ,oBAAoB;IAChD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC;CAC1C;AAED,OAAA,MAAM,6FAsEL,CAAC;AAWF,0BAA0B,MAAM,wBAAwB,CAAC,OAAO,UAAU,IAAI,CAAC,CAAC;AAChF,iCAA2B,SAAQ,kBAAkB;CAAG;AAExD,OAAA,MAAM,qGAaL,CAAC;AAwDF,OAAA,MAAM,2FAAa,CAAC;AACpB,OAAA,MAAM,+FAAmB,CAAC","sources":["packages/react/switch/src/packages/react/switch/src/Switch.tsx","packages/react/switch/src/packages/react/switch/src/index.ts","packages/react/switch/src/index.ts"],"sourcesContent":[null,null,"export * from './Switch';\n"],"names":[],"version":3,"file":"index.d.ts.map"}

package/dist/index.js

@@ -1,2 +1,178 @@
-var e,t,r,a=require("@radix-ui/react-label").useLabelContext,c=require("@radix-ui/react-primitive").Primitive,i=require("@radix-ui/react-use-size").useSize,o=require("@radix-ui/react-use-previous").usePrevious,n=require("@radix-ui/react-use-controllable-state").useControllableState,s=require("@radix-ui/react-context").createContextScope,u=require("@radix-ui/react-compose-refs").useComposedRefs,d=require("@radix-ui/primitive").composeEventHandlers,l=(e={},t=require("react"),Object.keys(t).forEach((function(r){"default"!==r&&"__esModule"!==r&&Object.defineProperty(e,r,{enumerable:!0,get:function(){return t[r]}})})),e),p=(r=require("@babel/runtime/helpers/extends"))&&r.__esModule?r.default:r;const[b,h]=s("Switch");exports.createSwitchScope=h;const[f,m]=b("Switch"),x=/*#__PURE__*/l.forwardRef(((e,t)=>{const{__scopeSwitch:r,"aria-labelledby":i,name:o,checked:s,defaultChecked:b,required:h,disabled:m,value:x="on",onCheckedChange:k,...S}=e,[q,y]=l.useState(null),E=u(t,(e=>y(e))),C=a(q),_=i||C,g=l.useRef(!1),P=!q||Boolean(q.closest("form")),[R=!1,O]=n({prop:s,defaultProp:b,onChange:k});/*#__PURE__*/return l.createElement(f,{scope:r,checked:R,disabled:m},/*#__PURE__*/l.createElement(c.button,p({type:"button",role:"switch","aria-checked":R,"aria-labelledby":_,"aria-required":h,"data-state":w(R),"data-disabled":m?"":void 0,disabled:m,value:x},S,{ref:E,onClick:d(e.onClick,(e=>{O((e=>!e)),P&&(g.current=e.isPropagationStopped(),g.current||e.stopPropagation())}))})),P&&/*#__PURE__*/l.createElement(v,{control:q,bubbles:!g.current,name:o,value:x,checked:R,required:h,disabled:m,style:{transform:"translateX(-100%)"}}))}));exports.Switch=x;const k=/*#__PURE__*/l.forwardRef(((e,t)=>{const{__scopeSwitch:r,...a}=e,i=m("SwitchThumb",r);/*#__PURE__*/return l.createElement(c.span,p({"data-state":w(i.checked),"data-disabled":i.disabled?"":void 0},a,{ref:t}))}));exports.SwitchThumb=k;const v=e=>{const{control:t,checked:r,bubbles:a=!0,...c}=e,n=l.useRef(null),s=o(r),u=i(t);return l.useEffect((()=>{const e=n.current,t=window.HTMLInputElement.prototype,c=Object.getOwnPropertyDescriptor(t,"checked").set;if(s!==r&&c){const t=new Event("click",{bubbles:a});c.call(e,r),e.dispatchEvent(t)}}),[s,r,a]),/*#__PURE__*/l.createElement("input",p({type:"checkbox","aria-hidden":!0,defaultChecked:r},c,{tabIndex:-1,ref:n,style:{...e.style,...u,position:"absolute",pointerEvents:"none",opacity:0,margin:0}}))};function w(e){return e?"checked":"unchecked"}const S=x;exports.Root=S;const q=k;exports.Thumb=q;
+var $cWV9h$babelruntimehelpersextends = require("@babel/runtime/helpers/extends");
+var $cWV9h$react = require("react");
+var $cWV9h$radixuiprimitive = require("@radix-ui/primitive");
+var $cWV9h$radixuireactcomposerefs = require("@radix-ui/react-compose-refs");
+var $cWV9h$radixuireactcontext = require("@radix-ui/react-context");
+var $cWV9h$radixuireactusecontrollablestate = require("@radix-ui/react-use-controllable-state");
+var $cWV9h$radixuireactuseprevious = require("@radix-ui/react-use-previous");
+var $cWV9h$radixuireactusesize = require("@radix-ui/react-use-size");
+var $cWV9h$radixuireactprimitive = require("@radix-ui/react-primitive");
+var $cWV9h$radixuireactlabel = require("@radix-ui/react-label");
+
+function $parcel$exportWildcard(dest, source) {
+  Object.keys(source).forEach(function(key) {
+    if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
+      return;
+    }
+
+    Object.defineProperty(dest, key, {
+      enumerable: true,
+      get: function get() {
+        return source[key];
+      }
+    });
+  });
+
+  return dest;
+}
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+var $4465bdeb0ef4ccd7$exports = {};
+
+$parcel$export($4465bdeb0ef4ccd7$exports, "createSwitchScope", () => $4465bdeb0ef4ccd7$export$cf7f5f17f69cbd43);
+$parcel$export($4465bdeb0ef4ccd7$exports, "Switch", () => $4465bdeb0ef4ccd7$export$b5d5cf8927ab7262);
+$parcel$export($4465bdeb0ef4ccd7$exports, "SwitchThumb", () => $4465bdeb0ef4ccd7$export$4d07bf653ea69106);
+$parcel$export($4465bdeb0ef4ccd7$exports, "Root", () => $4465bdeb0ef4ccd7$export$be92b6f5f03c0fe9);
+$parcel$export($4465bdeb0ef4ccd7$exports, "Thumb", () => $4465bdeb0ef4ccd7$export$6521433ed15a34db);
+
+
+
+
+
+
+
+
+
+
+/* -------------------------------------------------------------------------------------------------
+ * Switch
+ * -----------------------------------------------------------------------------------------------*/ const $4465bdeb0ef4ccd7$var$SWITCH_NAME = 'Switch';
+const [$4465bdeb0ef4ccd7$var$createSwitchContext, $4465bdeb0ef4ccd7$export$cf7f5f17f69cbd43] = $cWV9h$radixuireactcontext.createContextScope($4465bdeb0ef4ccd7$var$SWITCH_NAME);
+const [$4465bdeb0ef4ccd7$var$SwitchProvider, $4465bdeb0ef4ccd7$var$useSwitchContext] = $4465bdeb0ef4ccd7$var$createSwitchContext($4465bdeb0ef4ccd7$var$SWITCH_NAME);
+const $4465bdeb0ef4ccd7$export$b5d5cf8927ab7262 = /*#__PURE__*/ $cWV9h$react.forwardRef((props, forwardedRef)=>{
+    const { __scopeSwitch: __scopeSwitch , 'aria-labelledby': ariaLabelledby , name: name , checked: checkedProp , defaultChecked: defaultChecked , required: required , disabled: disabled , value: value = 'on' , onCheckedChange: onCheckedChange , ...switchProps } = props;
+    const [button, setButton] = $cWV9h$react.useState(null);
+    const composedRefs = $cWV9h$radixuireactcomposerefs.useComposedRefs(forwardedRef, (node)=>setButton(node)
+    );
+    const labelId = $cWV9h$radixuireactlabel.useLabelContext(button);
+    const labelledBy = ariaLabelledby || labelId;
+    const hasConsumerStoppedPropagationRef = $cWV9h$react.useRef(false); // We set this to true by default so that events bubble to forms without JS (SSR)
+    const isFormControl = button ? Boolean(button.closest('form')) : true;
+    const [checked = false, setChecked] = $cWV9h$radixuireactusecontrollablestate.useControllableState({
+        prop: checkedProp,
+        defaultProp: defaultChecked,
+        onChange: onCheckedChange
+    });
+    return /*#__PURE__*/ $cWV9h$react.createElement($4465bdeb0ef4ccd7$var$SwitchProvider, {
+        scope: __scopeSwitch,
+        checked: checked,
+        disabled: disabled
+    }, /*#__PURE__*/ $cWV9h$react.createElement($cWV9h$radixuireactprimitive.Primitive.button, ($parcel$interopDefault($cWV9h$babelruntimehelpersextends))({
+        type: "button",
+        role: "switch",
+        "aria-checked": checked,
+        "aria-labelledby": labelledBy,
+        "aria-required": required,
+        "data-state": $4465bdeb0ef4ccd7$var$getState(checked),
+        "data-disabled": disabled ? '' : undefined,
+        disabled: disabled,
+        value: value
+    }, switchProps, {
+        ref: composedRefs,
+        onClick: $cWV9h$radixuiprimitive.composeEventHandlers(props.onClick, (event)=>{
+            setChecked((prevChecked)=>!prevChecked
+            );
+            if (isFormControl) {
+                hasConsumerStoppedPropagationRef.current = event.isPropagationStopped(); // if switch is in a form, stop propagation from the button so that we only propagate
+                // one click event (from the input). We propagate changes from an input so that native
+                // form validation works and form events reflect switch updates.
+                if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();
+            }
+        })
+    })), isFormControl && /*#__PURE__*/ $cWV9h$react.createElement($4465bdeb0ef4ccd7$var$BubbleInput, {
+        control: button,
+        bubbles: !hasConsumerStoppedPropagationRef.current,
+        name: name,
+        value: value,
+        checked: checked,
+        required: required,
+        disabled: disabled // We transform because the input is absolutely positioned but we have
+        ,
+        style: {
+            transform: 'translateX(-100%)'
+        }
+    }));
+});
+/*#__PURE__*/ Object.assign($4465bdeb0ef4ccd7$export$b5d5cf8927ab7262, {
+    displayName: $4465bdeb0ef4ccd7$var$SWITCH_NAME
+});
+/* -------------------------------------------------------------------------------------------------
+ * SwitchThumb
+ * -----------------------------------------------------------------------------------------------*/ const $4465bdeb0ef4ccd7$var$THUMB_NAME = 'SwitchThumb';
+const $4465bdeb0ef4ccd7$export$4d07bf653ea69106 = /*#__PURE__*/ $cWV9h$react.forwardRef((props, forwardedRef)=>{
+    const { __scopeSwitch: __scopeSwitch , ...thumbProps } = props;
+    const context = $4465bdeb0ef4ccd7$var$useSwitchContext($4465bdeb0ef4ccd7$var$THUMB_NAME, __scopeSwitch);
+    return /*#__PURE__*/ $cWV9h$react.createElement($cWV9h$radixuireactprimitive.Primitive.span, ($parcel$interopDefault($cWV9h$babelruntimehelpersextends))({
+        "data-state": $4465bdeb0ef4ccd7$var$getState(context.checked),
+        "data-disabled": context.disabled ? '' : undefined
+    }, thumbProps, {
+        ref: forwardedRef
+    }));
+});
+/*#__PURE__*/ Object.assign($4465bdeb0ef4ccd7$export$4d07bf653ea69106, {
+    displayName: $4465bdeb0ef4ccd7$var$THUMB_NAME
+});
+/* ---------------------------------------------------------------------------------------------- */ const $4465bdeb0ef4ccd7$var$BubbleInput = (props)=>{
+    const { control: control , checked: checked , bubbles: bubbles = true , ...inputProps } = props;
+    const ref = $cWV9h$react.useRef(null);
+    const prevChecked = $cWV9h$radixuireactuseprevious.usePrevious(checked);
+    const controlSize = $cWV9h$radixuireactusesize.useSize(control); // Bubble checked change to parents (e.g form change event)
+    $cWV9h$react.useEffect(()=>{
+        const input = ref.current;
+        const inputProto = window.HTMLInputElement.prototype;
+        const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked');
+        const setChecked = descriptor.set;
+        if (prevChecked !== checked && setChecked) {
+            const event = new Event('click', {
+                bubbles: bubbles
+            });
+            setChecked.call(input, checked);
+            input.dispatchEvent(event);
+        }
+    }, [
+        prevChecked,
+        checked,
+        bubbles
+    ]);
+    return /*#__PURE__*/ $cWV9h$react.createElement("input", ($parcel$interopDefault($cWV9h$babelruntimehelpersextends))({
+        type: "checkbox",
+        "aria-hidden": true,
+        defaultChecked: checked
+    }, inputProps, {
+        tabIndex: -1,
+        ref: ref,
+        style: {
+            ...props.style,
+            ...controlSize,
+            position: 'absolute',
+            pointerEvents: 'none',
+            opacity: 0,
+            margin: 0
+        }
+    }));
+};
+function $4465bdeb0ef4ccd7$var$getState(checked) {
+    return checked ? 'checked' : 'unchecked';
+}
+const $4465bdeb0ef4ccd7$export$be92b6f5f03c0fe9 = $4465bdeb0ef4ccd7$export$b5d5cf8927ab7262;
+const $4465bdeb0ef4ccd7$export$6521433ed15a34db = $4465bdeb0ef4ccd7$export$4d07bf653ea69106;
+
+
+$parcel$exportWildcard(module.exports, $4465bdeb0ef4ccd7$exports);
+
+
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["./node_modules/@parcel/scope-hoisting/lib/helpers.js","./packages/react/switch/src/Switch.tsx"],"sourcesContent":["function $parcel$interopDefault(a) {\n  return a && a.__esModule ? a.default : a;\n}\n\nfunction $parcel$defineInteropFlag(a) {\n  Object.defineProperty(a, '__esModule', {value: true});\n}\n\nfunction $parcel$reexport(e, n, v) {\n  Object.defineProperty(e, n, {get: v, enumerable: true});\n}\n\nfunction $parcel$exportWildcard(dest, source) {\n  Object.keys(source).forEach(function(key) {\n    if (key === 'default' || key === '__esModule') {\n      return;\n    }\n\n    Object.defineProperty(dest, key, {\n      enumerable: true,\n      get: function get() {\n        return source[key];\n      },\n    });\n  });\n\n  return dest;\n}\n\nfunction $parcel$missingModule(name) {\n  var err = new Error(\"Cannot find module '\" + name + \"'\");\n  err.code = 'MODULE_NOT_FOUND';\n  throw err;\n}\n\nvar $parcel$global =\n  typeof globalThis !== 'undefined'\n    ? globalThis\n    : typeof self !== 'undefined'\n    ? self\n    : typeof window !== 'undefined'\n    ? window\n    : typeof global !== 'undefined'\n    ? global\n    : {};\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { usePrevious } from '@radix-ui/react-use-previous';\nimport { useSize } from '@radix-ui/react-use-size';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { useLabelContext } from '@radix-ui/react-label';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Switch\n * -----------------------------------------------------------------------------------------------*/\n\nconst SWITCH_NAME = 'Switch';\n\ntype ScopedProps<P> = P & { __scopeSwitch?: Scope };\nconst [createSwitchContext, createSwitchScope] = createContextScope(SWITCH_NAME);\n\ntype SwitchContextValue = { checked: boolean; disabled?: boolean };\nconst [SwitchProvider, useSwitchContext] = createSwitchContext<SwitchContextValue>(SWITCH_NAME);\n\ntype SwitchElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = Radix.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface SwitchProps extends PrimitiveButtonProps {\n  checked?: boolean;\n  defaultChecked?: boolean;\n  required?: boolean;\n  onCheckedChange?(checked: boolean): void;\n}\n\nconst Switch = React.forwardRef<SwitchElement, SwitchProps>(\n  (props: ScopedProps<SwitchProps>, forwardedRef) => {\n    const {\n      __scopeSwitch,\n      'aria-labelledby': ariaLabelledby,\n      name,\n      checked: checkedProp,\n      defaultChecked,\n      required,\n      disabled,\n      value = 'on',\n      onCheckedChange,\n      ...switchProps\n    } = props;\n    const [button, setButton] = React.useState<HTMLButtonElement | null>(null);\n    const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));\n    const labelId = useLabelContext(button);\n    const labelledBy = ariaLabelledby || labelId;\n    const hasConsumerStoppedPropagationRef = React.useRef(false);\n    // We set this to true by default so that events bubble to forms without JS (SSR)\n    const isFormControl = button ? Boolean(button.closest('form')) : true;\n    const [checked = false, setChecked] = useControllableState({\n      prop: checkedProp,\n      defaultProp: defaultChecked,\n      onChange: onCheckedChange,\n    });\n\n    return (\n      <SwitchProvider scope={__scopeSwitch} checked={checked} disabled={disabled}>\n        <Primitive.button\n          type=\"button\"\n          role=\"switch\"\n          aria-checked={checked}\n          aria-labelledby={labelledBy}\n          aria-required={required}\n          data-state={getState(checked)}\n          data-disabled={disabled ? '' : undefined}\n          disabled={disabled}\n          value={value}\n          {...switchProps}\n          ref={composedRefs}\n          onClick={composeEventHandlers(props.onClick, (event) => {\n            setChecked((prevChecked) => !prevChecked);\n            if (isFormControl) {\n              hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();\n              // if switch is in a form, stop propagation from the button so that we only propagate\n              // one click event (from the input). We propagate changes from an input so that native\n              // form validation works and form events reflect switch updates.\n              if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();\n            }\n          })}\n        />\n        {isFormControl && (\n          <BubbleInput\n            control={button}\n            bubbles={!hasConsumerStoppedPropagationRef.current}\n            name={name}\n            value={value}\n            checked={checked}\n            required={required}\n            disabled={disabled}\n            // We transform because the input is absolutely positioned but we have\n            // rendered it **after** the button. This pulls it back to sit on top\n            // of the button.\n            style={{ transform: 'translateX(-100%)' }}\n          />\n        )}\n      </SwitchProvider>\n    );\n  }\n);\n\nSwitch.displayName = SWITCH_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * SwitchThumb\n * -----------------------------------------------------------------------------------------------*/\n\nconst THUMB_NAME = 'SwitchThumb';\n\ntype SwitchThumbElement = React.ElementRef<typeof Primitive.span>;\ntype PrimitiveSpanProps = Radix.ComponentPropsWithoutRef<typeof Primitive.span>;\ninterface SwitchThumbProps extends PrimitiveSpanProps {}\n\nconst SwitchThumb = React.forwardRef<SwitchThumbElement, SwitchThumbProps>(\n  (props: ScopedProps<SwitchThumbProps>, forwardedRef) => {\n    const { __scopeSwitch, ...thumbProps } = props;\n    const context = useSwitchContext(THUMB_NAME, __scopeSwitch);\n    return (\n      <Primitive.span\n        data-state={getState(context.checked)}\n        data-disabled={context.disabled ? '' : undefined}\n        {...thumbProps}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n\nSwitchThumb.displayName = THUMB_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype InputProps = Radix.ComponentPropsWithoutRef<'input'>;\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n  checked: boolean;\n  control: HTMLElement | null;\n  bubbles: boolean;\n}\n\nconst BubbleInput = (props: BubbleInputProps) => {\n  const { control, checked, bubbles = true, ...inputProps } = props;\n  const ref = React.useRef<HTMLInputElement>(null);\n  const prevChecked = usePrevious(checked);\n  const controlSize = useSize(control);\n\n  // Bubble checked change to parents (e.g form change event)\n  React.useEffect(() => {\n    const input = ref.current!;\n    const inputProto = window.HTMLInputElement.prototype;\n    const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked') as PropertyDescriptor;\n    const setChecked = descriptor.set;\n    if (prevChecked !== checked && setChecked) {\n      const event = new Event('click', { bubbles });\n      setChecked.call(input, checked);\n      input.dispatchEvent(event);\n    }\n  }, [prevChecked, checked, bubbles]);\n\n  return (\n    <input\n      type=\"checkbox\"\n      aria-hidden\n      defaultChecked={checked}\n      {...inputProps}\n      tabIndex={-1}\n      ref={ref}\n      style={{\n        ...props.style,\n        ...controlSize,\n        position: 'absolute',\n        pointerEvents: 'none',\n        opacity: 0,\n        margin: 0,\n      }}\n    />\n  );\n};\n\nfunction getState(checked: boolean) {\n  return checked ? 'checked' : 'unchecked';\n}\n\nconst Root = Switch;\nconst Thumb = SwitchThumb;\n\nexport {\n  createSwitchScope,\n  //\n  Switch,\n  SwitchThumb,\n  //\n  Root,\n  Thumb,\n};\nexport type { SwitchProps, SwitchThumbProps };\n"],"names":["dest","source","a","Object","keys","forEach","key","defineProperty","enumerable","get","__esModule","default","createSwitchContext","createSwitchScope","createContextScope","SwitchProvider","useSwitchContext","Switch","React","forwardRef","props","forwardedRef","__scopeSwitch","ariaLabelledby","name","checked","checkedProp","defaultChecked","required","disabled","value","onCheckedChange","switchProps","button","setButton","useState","composedRefs","useComposedRefs","node","labelId","useLabelContext","labelledBy","hasConsumerStoppedPropagationRef","useRef","isFormControl","Boolean","closest","setChecked","useControllableState","prop","defaultProp","onChange","_react","createElement","$e251e027f448086991ed2332fcb5c67f$var$SwitchProvider","scope","Primitive","_babelRuntimeHelpersExtends","type","role","getState","undefined","ref","onClick","composeEventHandlers","event","prevChecked","current","isPropagationStopped","stopPropagation","$e251e027f448086991ed2332fcb5c67f$var$BubbleInput","control","bubbles","style","transform","SwitchThumb","thumbProps","context","span","BubbleInput","inputProps","usePrevious","controlSize","useSize","useEffect","input","inputProto","window","HTMLInputElement","prototype","getOwnPropertyDescriptor","set","Event","call","dispatchEvent","tabIndex","position","pointerEvents","opacity","margin","Root","Thumb"],"version":3,"file":"index.js.map"}
+{"mappings":"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","sources":["packages/react/switch/src/index.ts","packages/react/switch/src/Switch.tsx"],"sourcesContent":["export * from './Switch';\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { usePrevious } from '@radix-ui/react-use-previous';\nimport { useSize } from '@radix-ui/react-use-size';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { useLabelContext } from '@radix-ui/react-label';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Switch\n * -----------------------------------------------------------------------------------------------*/\n\nconst SWITCH_NAME = 'Switch';\n\ntype ScopedProps<P> = P & { __scopeSwitch?: Scope };\nconst [createSwitchContext, createSwitchScope] = createContextScope(SWITCH_NAME);\n\ntype SwitchContextValue = { checked: boolean; disabled?: boolean };\nconst [SwitchProvider, useSwitchContext] = createSwitchContext<SwitchContextValue>(SWITCH_NAME);\n\ntype SwitchElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = Radix.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface SwitchProps extends PrimitiveButtonProps {\n  checked?: boolean;\n  defaultChecked?: boolean;\n  required?: boolean;\n  onCheckedChange?(checked: boolean): void;\n}\n\nconst Switch = React.forwardRef<SwitchElement, SwitchProps>(\n  (props: ScopedProps<SwitchProps>, forwardedRef) => {\n    const {\n      __scopeSwitch,\n      'aria-labelledby': ariaLabelledby,\n      name,\n      checked: checkedProp,\n      defaultChecked,\n      required,\n      disabled,\n      value = 'on',\n      onCheckedChange,\n      ...switchProps\n    } = props;\n    const [button, setButton] = React.useState<HTMLButtonElement | null>(null);\n    const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));\n    const labelId = useLabelContext(button);\n    const labelledBy = ariaLabelledby || labelId;\n    const hasConsumerStoppedPropagationRef = React.useRef(false);\n    // We set this to true by default so that events bubble to forms without JS (SSR)\n    const isFormControl = button ? Boolean(button.closest('form')) : true;\n    const [checked = false, setChecked] = useControllableState({\n      prop: checkedProp,\n      defaultProp: defaultChecked,\n      onChange: onCheckedChange,\n    });\n\n    return (\n      <SwitchProvider scope={__scopeSwitch} checked={checked} disabled={disabled}>\n        <Primitive.button\n          type=\"button\"\n          role=\"switch\"\n          aria-checked={checked}\n          aria-labelledby={labelledBy}\n          aria-required={required}\n          data-state={getState(checked)}\n          data-disabled={disabled ? '' : undefined}\n          disabled={disabled}\n          value={value}\n          {...switchProps}\n          ref={composedRefs}\n          onClick={composeEventHandlers(props.onClick, (event) => {\n            setChecked((prevChecked) => !prevChecked);\n            if (isFormControl) {\n              hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();\n              // if switch is in a form, stop propagation from the button so that we only propagate\n              // one click event (from the input). We propagate changes from an input so that native\n              // form validation works and form events reflect switch updates.\n              if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();\n            }\n          })}\n        />\n        {isFormControl && (\n          <BubbleInput\n            control={button}\n            bubbles={!hasConsumerStoppedPropagationRef.current}\n            name={name}\n            value={value}\n            checked={checked}\n            required={required}\n            disabled={disabled}\n            // We transform because the input is absolutely positioned but we have\n            // rendered it **after** the button. This pulls it back to sit on top\n            // of the button.\n            style={{ transform: 'translateX(-100%)' }}\n          />\n        )}\n      </SwitchProvider>\n    );\n  }\n);\n\nSwitch.displayName = SWITCH_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * SwitchThumb\n * -----------------------------------------------------------------------------------------------*/\n\nconst THUMB_NAME = 'SwitchThumb';\n\ntype SwitchThumbElement = React.ElementRef<typeof Primitive.span>;\ntype PrimitiveSpanProps = Radix.ComponentPropsWithoutRef<typeof Primitive.span>;\ninterface SwitchThumbProps extends PrimitiveSpanProps {}\n\nconst SwitchThumb = React.forwardRef<SwitchThumbElement, SwitchThumbProps>(\n  (props: ScopedProps<SwitchThumbProps>, forwardedRef) => {\n    const { __scopeSwitch, ...thumbProps } = props;\n    const context = useSwitchContext(THUMB_NAME, __scopeSwitch);\n    return (\n      <Primitive.span\n        data-state={getState(context.checked)}\n        data-disabled={context.disabled ? '' : undefined}\n        {...thumbProps}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n\nSwitchThumb.displayName = THUMB_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype InputProps = Radix.ComponentPropsWithoutRef<'input'>;\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n  checked: boolean;\n  control: HTMLElement | null;\n  bubbles: boolean;\n}\n\nconst BubbleInput = (props: BubbleInputProps) => {\n  const { control, checked, bubbles = true, ...inputProps } = props;\n  const ref = React.useRef<HTMLInputElement>(null);\n  const prevChecked = usePrevious(checked);\n  const controlSize = useSize(control);\n\n  // Bubble checked change to parents (e.g form change event)\n  React.useEffect(() => {\n    const input = ref.current!;\n    const inputProto = window.HTMLInputElement.prototype;\n    const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked') as PropertyDescriptor;\n    const setChecked = descriptor.set;\n    if (prevChecked !== checked && setChecked) {\n      const event = new Event('click', { bubbles });\n      setChecked.call(input, checked);\n      input.dispatchEvent(event);\n    }\n  }, [prevChecked, checked, bubbles]);\n\n  return (\n    <input\n      type=\"checkbox\"\n      aria-hidden\n      defaultChecked={checked}\n      {...inputProps}\n      tabIndex={-1}\n      ref={ref}\n      style={{\n        ...props.style,\n        ...controlSize,\n        position: 'absolute',\n        pointerEvents: 'none',\n        opacity: 0,\n        margin: 0,\n      }}\n    />\n  );\n};\n\nfunction getState(checked: boolean) {\n  return checked ? 'checked' : 'unchecked';\n}\n\nconst Root = Switch;\nconst Thumb = SwitchThumb;\n\nexport {\n  createSwitchScope,\n  //\n  Switch,\n  SwitchThumb,\n  //\n  Root,\n  Thumb,\n};\nexport type { SwitchProps, SwitchThumbProps };\n"],"names":["React","composeEventHandlers","useComposedRefs","createContextScope","useControllableState","usePrevious","useSize","Primitive","useLabelContext","SWITCH_NAME","createSwitchContext","createSwitchScope","SwitchProvider","useSwitchContext","Switch","forwardRef","props","forwardedRef","__scopeSwitch","ariaLabelledby","name","checked","checkedProp","defaultChecked","required","disabled","value","onCheckedChange","switchProps","button","setButton","useState","composedRefs","node","labelId","labelledBy","hasConsumerStoppedPropagationRef","useRef","isFormControl","Boolean","closest","setChecked","prop","defaultProp","onChange","getState","undefined","onClick","event","prevChecked","current","isPropagationStopped","stopPropagation","transform","THUMB_NAME","SwitchThumb","thumbProps","context","BubbleInput","control","bubbles","inputProps","ref","controlSize","useEffect","input","inputProto","window","HTMLInputElement","prototype","descriptor","Object","getOwnPropertyDescriptor","set","Event","call","dispatchEvent","style","position","pointerEvents","opacity","margin","Root","Thumb"],"version":3,"file":"index.js.map"}

package/dist/index.module.js

@@ -1,2 +1,159 @@
-import{useLabelContext as e}from"@radix-ui/react-label";import{Primitive as t}from"@radix-ui/react-primitive";import{useSize as r}from"@radix-ui/react-use-size";import{usePrevious as o}from"@radix-ui/react-use-previous";import{useControllableState as a}from"@radix-ui/react-use-controllable-state";import{createContextScope as c}from"@radix-ui/react-context";import{useComposedRefs as i}from"@radix-ui/react-compose-refs";import{composeEventHandlers as n}from"@radix-ui/primitive";import*as s from"react";import d from"@babel/runtime/helpers/esm/extends";const[l,u]=c("Switch");export{u as createSwitchScope};const[p,m]=l("Switch");export const Switch=/*#__PURE__*/s.forwardRef(((r,o)=>{const{__scopeSwitch:c,"aria-labelledby":l,name:u,checked:m,defaultChecked:f,required:x,disabled:k,value:w="on",onCheckedChange:v,...S}=r,[y,E]=s.useState(null),C=i(o,(e=>E(e))),g=e(y),R=l||g,T=s.useRef(!1),P=!y||Boolean(y.closest("form")),[_=!1,q]=a({prop:m,defaultProp:f,onChange:v});/*#__PURE__*/return s.createElement(p,{scope:c,checked:_,disabled:k},/*#__PURE__*/s.createElement(t.button,d({type:"button",role:"switch","aria-checked":_,"aria-labelledby":R,"aria-required":x,"data-state":h(_),"data-disabled":k?"":void 0,disabled:k,value:w},S,{ref:C,onClick:n(r.onClick,(e=>{q((e=>!e)),P&&(T.current=e.isPropagationStopped(),T.current||e.stopPropagation())}))})),P&&/*#__PURE__*/s.createElement(b,{control:y,bubbles:!T.current,name:u,value:w,checked:_,required:x,disabled:k,style:{transform:"translateX(-100%)"}}))}));/*#__PURE__*/export const SwitchThumb=/*#__PURE__*/s.forwardRef(((e,r)=>{const{__scopeSwitch:o,...a}=e,c=m("SwitchThumb",o);/*#__PURE__*/return s.createElement(t.span,d({"data-state":h(c.checked),"data-disabled":c.disabled?"":void 0},a,{ref:r}))}));/*#__PURE__*/const b=e=>{const{control:t,checked:a,bubbles:c=!0,...i}=e,n=s.useRef(null),l=o(a),u=r(t);return s.useEffect((()=>{const e=n.current,t=window.HTMLInputElement.prototype,r=Object.getOwnPropertyDescriptor(t,"checked").set;if(l!==a&&r){const t=new Event("click",{bubbles:c});r.call(e,a),e.dispatchEvent(t)}}),[l,a,c]),/*#__PURE__*/s.createElement("input",d({type:"checkbox","aria-hidden":!0,defaultChecked:a},i,{tabIndex:-1,ref:n,style:{...e.style,...u,position:"absolute",pointerEvents:"none",opacity:0,margin:0}}))};function h(e){return e?"checked":"unchecked"}export const Root=Switch;export const Thumb=SwitchThumb;
+import $irPIl$babelruntimehelpersesmextends from "@babel/runtime/helpers/esm/extends";
+import {forwardRef as $irPIl$forwardRef, useState as $irPIl$useState, useRef as $irPIl$useRef, createElement as $irPIl$createElement, useEffect as $irPIl$useEffect} from "react";
+import {composeEventHandlers as $irPIl$composeEventHandlers} from "@radix-ui/primitive";
+import {useComposedRefs as $irPIl$useComposedRefs} from "@radix-ui/react-compose-refs";
+import {createContextScope as $irPIl$createContextScope} from "@radix-ui/react-context";
+import {useControllableState as $irPIl$useControllableState} from "@radix-ui/react-use-controllable-state";
+import {usePrevious as $irPIl$usePrevious} from "@radix-ui/react-use-previous";
+import {useSize as $irPIl$useSize} from "@radix-ui/react-use-size";
+import {Primitive as $irPIl$Primitive} from "@radix-ui/react-primitive";
+import {useLabelContext as $irPIl$useLabelContext} from "@radix-ui/react-label";
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+var $6be4966fd9bbc698$exports = {};
+
+$parcel$export($6be4966fd9bbc698$exports, "createSwitchScope", () => $6be4966fd9bbc698$export$cf7f5f17f69cbd43);
+$parcel$export($6be4966fd9bbc698$exports, "Switch", () => $6be4966fd9bbc698$export$b5d5cf8927ab7262);
+$parcel$export($6be4966fd9bbc698$exports, "SwitchThumb", () => $6be4966fd9bbc698$export$4d07bf653ea69106);
+$parcel$export($6be4966fd9bbc698$exports, "Root", () => $6be4966fd9bbc698$export$be92b6f5f03c0fe9);
+$parcel$export($6be4966fd9bbc698$exports, "Thumb", () => $6be4966fd9bbc698$export$6521433ed15a34db);
+
+
+
+
+
+
+
+
+
+
+/* -------------------------------------------------------------------------------------------------
+ * Switch
+ * -----------------------------------------------------------------------------------------------*/ const $6be4966fd9bbc698$var$SWITCH_NAME = 'Switch';
+const [$6be4966fd9bbc698$var$createSwitchContext, $6be4966fd9bbc698$export$cf7f5f17f69cbd43] = $irPIl$createContextScope($6be4966fd9bbc698$var$SWITCH_NAME);
+const [$6be4966fd9bbc698$var$SwitchProvider, $6be4966fd9bbc698$var$useSwitchContext] = $6be4966fd9bbc698$var$createSwitchContext($6be4966fd9bbc698$var$SWITCH_NAME);
+const $6be4966fd9bbc698$export$b5d5cf8927ab7262 = /*#__PURE__*/ $irPIl$forwardRef((props, forwardedRef)=>{
+    const { __scopeSwitch: __scopeSwitch , 'aria-labelledby': ariaLabelledby , name: name , checked: checkedProp , defaultChecked: defaultChecked , required: required , disabled: disabled , value: value = 'on' , onCheckedChange: onCheckedChange , ...switchProps } = props;
+    const [button, setButton] = $irPIl$useState(null);
+    const composedRefs = $irPIl$useComposedRefs(forwardedRef, (node)=>setButton(node)
+    );
+    const labelId = $irPIl$useLabelContext(button);
+    const labelledBy = ariaLabelledby || labelId;
+    const hasConsumerStoppedPropagationRef = $irPIl$useRef(false); // We set this to true by default so that events bubble to forms without JS (SSR)
+    const isFormControl = button ? Boolean(button.closest('form')) : true;
+    const [checked = false, setChecked] = $irPIl$useControllableState({
+        prop: checkedProp,
+        defaultProp: defaultChecked,
+        onChange: onCheckedChange
+    });
+    return /*#__PURE__*/ $irPIl$createElement($6be4966fd9bbc698$var$SwitchProvider, {
+        scope: __scopeSwitch,
+        checked: checked,
+        disabled: disabled
+    }, /*#__PURE__*/ $irPIl$createElement($irPIl$Primitive.button, $irPIl$babelruntimehelpersesmextends({
+        type: "button",
+        role: "switch",
+        "aria-checked": checked,
+        "aria-labelledby": labelledBy,
+        "aria-required": required,
+        "data-state": $6be4966fd9bbc698$var$getState(checked),
+        "data-disabled": disabled ? '' : undefined,
+        disabled: disabled,
+        value: value
+    }, switchProps, {
+        ref: composedRefs,
+        onClick: $irPIl$composeEventHandlers(props.onClick, (event)=>{
+            setChecked((prevChecked)=>!prevChecked
+            );
+            if (isFormControl) {
+                hasConsumerStoppedPropagationRef.current = event.isPropagationStopped(); // if switch is in a form, stop propagation from the button so that we only propagate
+                // one click event (from the input). We propagate changes from an input so that native
+                // form validation works and form events reflect switch updates.
+                if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();
+            }
+        })
+    })), isFormControl && /*#__PURE__*/ $irPIl$createElement($6be4966fd9bbc698$var$BubbleInput, {
+        control: button,
+        bubbles: !hasConsumerStoppedPropagationRef.current,
+        name: name,
+        value: value,
+        checked: checked,
+        required: required,
+        disabled: disabled // We transform because the input is absolutely positioned but we have
+        ,
+        style: {
+            transform: 'translateX(-100%)'
+        }
+    }));
+});
+/*#__PURE__*/ Object.assign($6be4966fd9bbc698$export$b5d5cf8927ab7262, {
+    displayName: $6be4966fd9bbc698$var$SWITCH_NAME
+});
+/* -------------------------------------------------------------------------------------------------
+ * SwitchThumb
+ * -----------------------------------------------------------------------------------------------*/ const $6be4966fd9bbc698$var$THUMB_NAME = 'SwitchThumb';
+const $6be4966fd9bbc698$export$4d07bf653ea69106 = /*#__PURE__*/ $irPIl$forwardRef((props, forwardedRef)=>{
+    const { __scopeSwitch: __scopeSwitch , ...thumbProps } = props;
+    const context = $6be4966fd9bbc698$var$useSwitchContext($6be4966fd9bbc698$var$THUMB_NAME, __scopeSwitch);
+    return /*#__PURE__*/ $irPIl$createElement($irPIl$Primitive.span, $irPIl$babelruntimehelpersesmextends({
+        "data-state": $6be4966fd9bbc698$var$getState(context.checked),
+        "data-disabled": context.disabled ? '' : undefined
+    }, thumbProps, {
+        ref: forwardedRef
+    }));
+});
+/*#__PURE__*/ Object.assign($6be4966fd9bbc698$export$4d07bf653ea69106, {
+    displayName: $6be4966fd9bbc698$var$THUMB_NAME
+});
+/* ---------------------------------------------------------------------------------------------- */ const $6be4966fd9bbc698$var$BubbleInput = (props)=>{
+    const { control: control , checked: checked , bubbles: bubbles = true , ...inputProps } = props;
+    const ref = $irPIl$useRef(null);
+    const prevChecked = $irPIl$usePrevious(checked);
+    const controlSize = $irPIl$useSize(control); // Bubble checked change to parents (e.g form change event)
+    $irPIl$useEffect(()=>{
+        const input = ref.current;
+        const inputProto = window.HTMLInputElement.prototype;
+        const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked');
+        const setChecked = descriptor.set;
+        if (prevChecked !== checked && setChecked) {
+            const event = new Event('click', {
+                bubbles: bubbles
+            });
+            setChecked.call(input, checked);
+            input.dispatchEvent(event);
+        }
+    }, [
+        prevChecked,
+        checked,
+        bubbles
+    ]);
+    return /*#__PURE__*/ $irPIl$createElement("input", $irPIl$babelruntimehelpersesmextends({
+        type: "checkbox",
+        "aria-hidden": true,
+        defaultChecked: checked
+    }, inputProps, {
+        tabIndex: -1,
+        ref: ref,
+        style: {
+            ...props.style,
+            ...controlSize,
+            position: 'absolute',
+            pointerEvents: 'none',
+            opacity: 0,
+            margin: 0
+        }
+    }));
+};
+function $6be4966fd9bbc698$var$getState(checked) {
+    return checked ? 'checked' : 'unchecked';
+}
+const $6be4966fd9bbc698$export$be92b6f5f03c0fe9 = $6be4966fd9bbc698$export$b5d5cf8927ab7262;
+const $6be4966fd9bbc698$export$6521433ed15a34db = $6be4966fd9bbc698$export$4d07bf653ea69106;
+
+
+
+
+export {$6be4966fd9bbc698$export$cf7f5f17f69cbd43 as createSwitchScope, $6be4966fd9bbc698$export$b5d5cf8927ab7262 as Switch, $6be4966fd9bbc698$export$4d07bf653ea69106 as SwitchThumb, $6be4966fd9bbc698$export$be92b6f5f03c0fe9 as Root, $6be4966fd9bbc698$export$6521433ed15a34db as Thumb};
 //# sourceMappingURL=index.module.js.map

package/dist/index.module.js.map

@@ -1 +1 @@
-{"mappings":"2iBAiBA,MAGOA,EAAqBC,GAAqBC,EAH7B,yCAMpB,MAAOC,EAAgBC,GAAoBJ,EANvB,iBAiBpB,MAAMK,oBAASC,EAAMC,YACnB,CAACC,EAAiCC,KAChC,MAAMC,cACJA,EACA,kBAAmBC,EAFfC,KAGJA,EACAC,QAASC,EAJLC,eAKJA,EALIC,SAMJA,EANIC,SAOJA,EAPIC,MAQJA,EAAQ,KARJC,gBASJA,KACGC,GACDZ,GACGa,EAAQC,GAAahB,EAAMiB,SAAmC,MAC/DC,EAAeC,EAAgBhB,GAAeiB,GAASJ,EAAUI,KACjEC,EAAUC,EAAgBP,GAC1BQ,EAAalB,GAAkBgB,EAC/BG,EAAmCxB,EAAMyB,QAAO,GAEhDC,GAAgBX,GAASY,QAAQZ,EAAOa,QAAQ,UAC/CrB,GAAU,EAAOsB,GAAcC,EAAqB,CACzDC,KAAMvB,EACNwB,YAAavB,EACbwB,SAAUpB,iBAGZ,OACEqB,EAAAC,cAACC,EAAD,CAAgBC,MAAOjC,EAAeG,QAASA,EAASI,SAAUA,gBAChEuB,EAAAC,cAACG,EAAUvB,OAAXwB,EAAA,CACEC,KAAK,SACLC,KAAK,SACL,eAAclC,EACd,kBAAiBgB,EACjB,gBAAeb,EACf,aAAYgC,EAASnC,GACrB,gBAAeI,EAAW,QAAKgC,EAC/BhC,SAAUA,EACVC,MAAOA,GACHE,EAVN,CAWE8B,IAAK1B,EACL2B,QAASC,EAAqB5C,EAAM2C,SAAUE,IAC5ClB,GAAYmB,IAAiBA,IACzBtB,IACFF,EAAiCyB,QAAUF,EAAMG,uBAI5C1B,EAAiCyB,SAASF,EAAMI,yBAI1DzB,gBACCQ,EAAAC,cAACiB,EAAD,CACEC,QAAStC,EACTuC,SAAU9B,EAAiCyB,QAC3C3C,KAAMA,EACNM,MAAOA,EACPL,QAASA,EACTG,SAAUA,EACVC,SAAUA,EAIV4C,MAAO,CAAEC,UAAW,+CAoBhC,MAAMC,yBAAczD,EAAMC,YACxB,CAACC,EAAsCC,KACrC,MAAMC,cAAEA,KAAkBsD,GAAexD,EACnCyD,EAAU7D,EATD,cAS8BM,gBAC7C,OACE8B,EAAAC,cAACG,EAAUsB,KAAXrB,EAAA,CACE,aAAYG,EAASiB,EAAQpD,SAC7B,gBAAeoD,EAAQhD,SAAW,QAAKgC,GACnCe,EAHN,CAIEd,IAAKzC,qBAiBb,MAAM0D,EAAe3D,IACnB,MAAMmD,QAAEA,EAAF9C,QAAWA,EAAX+C,QAAoBA,GAAU,KAASQ,GAAe5D,EACtD0C,EAAM5C,EAAMyB,OAAyB,MACrCuB,EAAce,EAAYxD,GAC1ByD,EAAcC,EAAQZ,GAe5B,OAZArD,EAAMkE,WAAU,KACd,MAAMC,EAAQvB,EAAIK,QACZmB,EAAaC,OAAOC,iBAAiBC,UAErC1C,EADa2C,OAAOC,yBAAyBL,EAAY,WACjCM,IAC9B,GAAI1B,IAAgBzC,GAAWsB,EAAY,CACzC,MAAMkB,EAAQ,IAAI4B,MAAM,QAAS,CAAErB,QAAAA,IACnCzB,EAAW+C,KAAKT,EAAO5D,GACvB4D,EAAMU,cAAc9B,MAErB,CAACC,EAAazC,EAAS+C,iBAGxBpB,EAAAC,cAAA,QAAAI,EAAA,CACEC,KAAK,WACL,eAAA,EACA/B,eAAgBF,GACZuD,EAJN,CAKEgB,UAAW,EACXlC,IAAKA,EACLW,MAAO,IACFrD,EAAMqD,SACNS,EACHe,SAAU,WACVC,cAAe,OACfC,QAAS,EACTC,OAAQ,OAMhB,SAASxC,EAASnC,GAChB,OAAOA,EAAU,UAAY,mBAG/B,MAAM4E,KAAOpF,cACb,MAAMqF,MAAQ3B","sources":["./packages/react/switch/src/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { usePrevious } from '@radix-ui/react-use-previous';\nimport { useSize } from '@radix-ui/react-use-size';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { useLabelContext } from '@radix-ui/react-label';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Switch\n * -----------------------------------------------------------------------------------------------*/\n\nconst SWITCH_NAME = 'Switch';\n\ntype ScopedProps<P> = P & { __scopeSwitch?: Scope };\nconst [createSwitchContext, createSwitchScope] = createContextScope(SWITCH_NAME);\n\ntype SwitchContextValue = { checked: boolean; disabled?: boolean };\nconst [SwitchProvider, useSwitchContext] = createSwitchContext<SwitchContextValue>(SWITCH_NAME);\n\ntype SwitchElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = Radix.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface SwitchProps extends PrimitiveButtonProps {\n  checked?: boolean;\n  defaultChecked?: boolean;\n  required?: boolean;\n  onCheckedChange?(checked: boolean): void;\n}\n\nconst Switch = React.forwardRef<SwitchElement, SwitchProps>(\n  (props: ScopedProps<SwitchProps>, forwardedRef) => {\n    const {\n      __scopeSwitch,\n      'aria-labelledby': ariaLabelledby,\n      name,\n      checked: checkedProp,\n      defaultChecked,\n      required,\n      disabled,\n      value = 'on',\n      onCheckedChange,\n      ...switchProps\n    } = props;\n    const [button, setButton] = React.useState<HTMLButtonElement | null>(null);\n    const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));\n    const labelId = useLabelContext(button);\n    const labelledBy = ariaLabelledby || labelId;\n    const hasConsumerStoppedPropagationRef = React.useRef(false);\n    // We set this to true by default so that events bubble to forms without JS (SSR)\n    const isFormControl = button ? Boolean(button.closest('form')) : true;\n    const [checked = false, setChecked] = useControllableState({\n      prop: checkedProp,\n      defaultProp: defaultChecked,\n      onChange: onCheckedChange,\n    });\n\n    return (\n      <SwitchProvider scope={__scopeSwitch} checked={checked} disabled={disabled}>\n        <Primitive.button\n          type=\"button\"\n          role=\"switch\"\n          aria-checked={checked}\n          aria-labelledby={labelledBy}\n          aria-required={required}\n          data-state={getState(checked)}\n          data-disabled={disabled ? '' : undefined}\n          disabled={disabled}\n          value={value}\n          {...switchProps}\n          ref={composedRefs}\n          onClick={composeEventHandlers(props.onClick, (event) => {\n            setChecked((prevChecked) => !prevChecked);\n            if (isFormControl) {\n              hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();\n              // if switch is in a form, stop propagation from the button so that we only propagate\n              // one click event (from the input). We propagate changes from an input so that native\n              // form validation works and form events reflect switch updates.\n              if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();\n            }\n          })}\n        />\n        {isFormControl && (\n          <BubbleInput\n            control={button}\n            bubbles={!hasConsumerStoppedPropagationRef.current}\n            name={name}\n            value={value}\n            checked={checked}\n            required={required}\n            disabled={disabled}\n            // We transform because the input is absolutely positioned but we have\n            // rendered it **after** the button. This pulls it back to sit on top\n            // of the button.\n            style={{ transform: 'translateX(-100%)' }}\n          />\n        )}\n      </SwitchProvider>\n    );\n  }\n);\n\nSwitch.displayName = SWITCH_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * SwitchThumb\n * -----------------------------------------------------------------------------------------------*/\n\nconst THUMB_NAME = 'SwitchThumb';\n\ntype SwitchThumbElement = React.ElementRef<typeof Primitive.span>;\ntype PrimitiveSpanProps = Radix.ComponentPropsWithoutRef<typeof Primitive.span>;\ninterface SwitchThumbProps extends PrimitiveSpanProps {}\n\nconst SwitchThumb = React.forwardRef<SwitchThumbElement, SwitchThumbProps>(\n  (props: ScopedProps<SwitchThumbProps>, forwardedRef) => {\n    const { __scopeSwitch, ...thumbProps } = props;\n    const context = useSwitchContext(THUMB_NAME, __scopeSwitch);\n    return (\n      <Primitive.span\n        data-state={getState(context.checked)}\n        data-disabled={context.disabled ? '' : undefined}\n        {...thumbProps}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n\nSwitchThumb.displayName = THUMB_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype InputProps = Radix.ComponentPropsWithoutRef<'input'>;\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n  checked: boolean;\n  control: HTMLElement | null;\n  bubbles: boolean;\n}\n\nconst BubbleInput = (props: BubbleInputProps) => {\n  const { control, checked, bubbles = true, ...inputProps } = props;\n  const ref = React.useRef<HTMLInputElement>(null);\n  const prevChecked = usePrevious(checked);\n  const controlSize = useSize(control);\n\n  // Bubble checked change to parents (e.g form change event)\n  React.useEffect(() => {\n    const input = ref.current!;\n    const inputProto = window.HTMLInputElement.prototype;\n    const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked') as PropertyDescriptor;\n    const setChecked = descriptor.set;\n    if (prevChecked !== checked && setChecked) {\n      const event = new Event('click', { bubbles });\n      setChecked.call(input, checked);\n      input.dispatchEvent(event);\n    }\n  }, [prevChecked, checked, bubbles]);\n\n  return (\n    <input\n      type=\"checkbox\"\n      aria-hidden\n      defaultChecked={checked}\n      {...inputProps}\n      tabIndex={-1}\n      ref={ref}\n      style={{\n        ...props.style,\n        ...controlSize,\n        position: 'absolute',\n        pointerEvents: 'none',\n        opacity: 0,\n        margin: 0,\n      }}\n    />\n  );\n};\n\nfunction getState(checked: boolean) {\n  return checked ? 'checked' : 'unchecked';\n}\n\nconst Root = Switch;\nconst Thumb = SwitchThumb;\n\nexport {\n  createSwitchScope,\n  //\n  Switch,\n  SwitchThumb,\n  //\n  Root,\n  Thumb,\n};\nexport type { SwitchProps, SwitchThumbProps };\n"],"names":["createSwitchContext","createSwitchScope","createContextScope","SwitchProvider","useSwitchContext","Switch","React","forwardRef","props","forwardedRef","__scopeSwitch","ariaLabelledby","name","checked","checkedProp","defaultChecked","required","disabled","value","onCheckedChange","switchProps","button","setButton","useState","composedRefs","useComposedRefs","node","labelId","useLabelContext","labelledBy","hasConsumerStoppedPropagationRef","useRef","isFormControl","Boolean","closest","setChecked","useControllableState","prop","defaultProp","onChange","_react","createElement","$a39756f91f0c788d079b2ac1958ff$var$SwitchProvider","scope","Primitive","_babelRuntimeHelpersEsmExtends","type","role","getState","undefined","ref","onClick","composeEventHandlers","event","prevChecked","current","isPropagationStopped","stopPropagation","$a39756f91f0c788d079b2ac1958ff$var$BubbleInput","control","bubbles","style","transform","SwitchThumb","thumbProps","context","span","BubbleInput","inputProps","usePrevious","controlSize","useSize","useEffect","input","inputProto","window","HTMLInputElement","prototype","Object","getOwnPropertyDescriptor","set","Event","call","dispatchEvent","tabIndex","position","pointerEvents","opacity","margin","Root","Thumb"],"version":3,"file":"index.module.js.map"}
+{"mappings":"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","sources":["packages/react/switch/src/index.ts","packages/react/switch/src/Switch.tsx"],"sourcesContent":["export * from './Switch';\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { usePrevious } from '@radix-ui/react-use-previous';\nimport { useSize } from '@radix-ui/react-use-size';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { useLabelContext } from '@radix-ui/react-label';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Switch\n * -----------------------------------------------------------------------------------------------*/\n\nconst SWITCH_NAME = 'Switch';\n\ntype ScopedProps<P> = P & { __scopeSwitch?: Scope };\nconst [createSwitchContext, createSwitchScope] = createContextScope(SWITCH_NAME);\n\ntype SwitchContextValue = { checked: boolean; disabled?: boolean };\nconst [SwitchProvider, useSwitchContext] = createSwitchContext<SwitchContextValue>(SWITCH_NAME);\n\ntype SwitchElement = React.ElementRef<typeof Primitive.button>;\ntype PrimitiveButtonProps = Radix.ComponentPropsWithoutRef<typeof Primitive.button>;\ninterface SwitchProps extends PrimitiveButtonProps {\n  checked?: boolean;\n  defaultChecked?: boolean;\n  required?: boolean;\n  onCheckedChange?(checked: boolean): void;\n}\n\nconst Switch = React.forwardRef<SwitchElement, SwitchProps>(\n  (props: ScopedProps<SwitchProps>, forwardedRef) => {\n    const {\n      __scopeSwitch,\n      'aria-labelledby': ariaLabelledby,\n      name,\n      checked: checkedProp,\n      defaultChecked,\n      required,\n      disabled,\n      value = 'on',\n      onCheckedChange,\n      ...switchProps\n    } = props;\n    const [button, setButton] = React.useState<HTMLButtonElement | null>(null);\n    const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));\n    const labelId = useLabelContext(button);\n    const labelledBy = ariaLabelledby || labelId;\n    const hasConsumerStoppedPropagationRef = React.useRef(false);\n    // We set this to true by default so that events bubble to forms without JS (SSR)\n    const isFormControl = button ? Boolean(button.closest('form')) : true;\n    const [checked = false, setChecked] = useControllableState({\n      prop: checkedProp,\n      defaultProp: defaultChecked,\n      onChange: onCheckedChange,\n    });\n\n    return (\n      <SwitchProvider scope={__scopeSwitch} checked={checked} disabled={disabled}>\n        <Primitive.button\n          type=\"button\"\n          role=\"switch\"\n          aria-checked={checked}\n          aria-labelledby={labelledBy}\n          aria-required={required}\n          data-state={getState(checked)}\n          data-disabled={disabled ? '' : undefined}\n          disabled={disabled}\n          value={value}\n          {...switchProps}\n          ref={composedRefs}\n          onClick={composeEventHandlers(props.onClick, (event) => {\n            setChecked((prevChecked) => !prevChecked);\n            if (isFormControl) {\n              hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();\n              // if switch is in a form, stop propagation from the button so that we only propagate\n              // one click event (from the input). We propagate changes from an input so that native\n              // form validation works and form events reflect switch updates.\n              if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();\n            }\n          })}\n        />\n        {isFormControl && (\n          <BubbleInput\n            control={button}\n            bubbles={!hasConsumerStoppedPropagationRef.current}\n            name={name}\n            value={value}\n            checked={checked}\n            required={required}\n            disabled={disabled}\n            // We transform because the input is absolutely positioned but we have\n            // rendered it **after** the button. This pulls it back to sit on top\n            // of the button.\n            style={{ transform: 'translateX(-100%)' }}\n          />\n        )}\n      </SwitchProvider>\n    );\n  }\n);\n\nSwitch.displayName = SWITCH_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * SwitchThumb\n * -----------------------------------------------------------------------------------------------*/\n\nconst THUMB_NAME = 'SwitchThumb';\n\ntype SwitchThumbElement = React.ElementRef<typeof Primitive.span>;\ntype PrimitiveSpanProps = Radix.ComponentPropsWithoutRef<typeof Primitive.span>;\ninterface SwitchThumbProps extends PrimitiveSpanProps {}\n\nconst SwitchThumb = React.forwardRef<SwitchThumbElement, SwitchThumbProps>(\n  (props: ScopedProps<SwitchThumbProps>, forwardedRef) => {\n    const { __scopeSwitch, ...thumbProps } = props;\n    const context = useSwitchContext(THUMB_NAME, __scopeSwitch);\n    return (\n      <Primitive.span\n        data-state={getState(context.checked)}\n        data-disabled={context.disabled ? '' : undefined}\n        {...thumbProps}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n\nSwitchThumb.displayName = THUMB_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype InputProps = Radix.ComponentPropsWithoutRef<'input'>;\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n  checked: boolean;\n  control: HTMLElement | null;\n  bubbles: boolean;\n}\n\nconst BubbleInput = (props: BubbleInputProps) => {\n  const { control, checked, bubbles = true, ...inputProps } = props;\n  const ref = React.useRef<HTMLInputElement>(null);\n  const prevChecked = usePrevious(checked);\n  const controlSize = useSize(control);\n\n  // Bubble checked change to parents (e.g form change event)\n  React.useEffect(() => {\n    const input = ref.current!;\n    const inputProto = window.HTMLInputElement.prototype;\n    const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked') as PropertyDescriptor;\n    const setChecked = descriptor.set;\n    if (prevChecked !== checked && setChecked) {\n      const event = new Event('click', { bubbles });\n      setChecked.call(input, checked);\n      input.dispatchEvent(event);\n    }\n  }, [prevChecked, checked, bubbles]);\n\n  return (\n    <input\n      type=\"checkbox\"\n      aria-hidden\n      defaultChecked={checked}\n      {...inputProps}\n      tabIndex={-1}\n      ref={ref}\n      style={{\n        ...props.style,\n        ...controlSize,\n        position: 'absolute',\n        pointerEvents: 'none',\n        opacity: 0,\n        margin: 0,\n      }}\n    />\n  );\n};\n\nfunction getState(checked: boolean) {\n  return checked ? 'checked' : 'unchecked';\n}\n\nconst Root = Switch;\nconst Thumb = SwitchThumb;\n\nexport {\n  createSwitchScope,\n  //\n  Switch,\n  SwitchThumb,\n  //\n  Root,\n  Thumb,\n};\nexport type { SwitchProps, SwitchThumbProps };\n"],"names":["React","composeEventHandlers","useComposedRefs","createContextScope","useControllableState","usePrevious","useSize","Primitive","useLabelContext","SWITCH_NAME","createSwitchContext","createSwitchScope","SwitchProvider","useSwitchContext","Switch","forwardRef","props","forwardedRef","__scopeSwitch","ariaLabelledby","name","checked","checkedProp","defaultChecked","required","disabled","value","onCheckedChange","switchProps","button","setButton","useState","composedRefs","node","labelId","labelledBy","hasConsumerStoppedPropagationRef","useRef","isFormControl","Boolean","closest","setChecked","prop","defaultProp","onChange","getState","undefined","onClick","event","prevChecked","current","isPropagationStopped","stopPropagation","transform","THUMB_NAME","SwitchThumb","thumbProps","context","BubbleInput","control","bubbles","inputProps","ref","controlSize","useEffect","input","inputProto","window","HTMLInputElement","prototype","descriptor","Object","getOwnPropertyDescriptor","set","Event","call","dispatchEvent","style","position","pointerEvents","opacity","margin","Root","Thumb"],"version":3,"file":"index.module.js.map"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-switch",
-  "version": "0.1.6-rc.1",
+  "version": "0.1.6-rc.4",
   "license": "MIT",
   "source": "src/index.ts",
   "main": "dist/index.js",
@@ -18,13 +18,13 @@
   "dependencies": {
     "@babel/runtime": "^7.13.10",
     "@radix-ui/primitive": "0.1.0",
-    "@radix-ui/react-compose-refs": "0.1.1-rc.1",
-    "@radix-ui/react-context": "0.1.2-rc.1",
-    "@radix-ui/react-label": "0.1.6-rc.1",
-    "@radix-ui/react-primitive": "0.1.5-rc.1",
-    "@radix-ui/react-use-controllable-state": "0.1.1-rc.1",
-    "@radix-ui/react-use-previous": "0.1.2-rc.1",
-    "@radix-ui/react-use-size": "0.1.2-rc.1"
+    "@radix-ui/react-compose-refs": "0.1.1-rc.4",
+    "@radix-ui/react-context": "0.1.2-rc.4",
+    "@radix-ui/react-label": "0.1.6-rc.4",
+    "@radix-ui/react-primitive": "0.1.5-rc.4",
+    "@radix-ui/react-use-controllable-state": "0.1.1-rc.4",
+    "@radix-ui/react-use-previous": "0.1.2-rc.4",
+    "@radix-ui/react-use-size": "0.1.2-rc.4"
   },
   "peerDependencies": {
     "react": "^16.8 || ^17.0 || ^18.0"