@tamagui/checkbox 1.5.12 → 1.5.14

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.
@@ -100,6 +100,7 @@ const BubbleInput = (props) => {
100
100
  };
101
101
  const INDICATOR_NAME = "CheckboxIndicator";
102
102
  const CheckboxIndicatorFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
103
+ // use Checkbox for easier themes
103
104
  name: INDICATOR_NAME
104
105
  });
105
106
  const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
@@ -127,7 +128,6 @@ const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
127
128
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
128
129
  CheckboxIndicatorFrame,
129
130
  {
130
- theme: "active",
131
131
  "data-state": getState(context.state),
132
132
  "data-disabled": context.disabled ? "" : void 0,
133
133
  pointerEvents: "none",
@@ -254,7 +254,6 @@ const Checkbox = (0, import_core.withStaticProperties)(
254
254
  {
255
255
  width: size,
256
256
  height: size,
257
- theme: checked ? "active" : null,
258
257
  tag: "button",
259
258
  role: "checkbox",
260
259
  "aria-labelledby": labelledBy,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Checkbox.tsx"],
4
- "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n theme=\"active\"\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n theme={checked ? 'active' : null}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAwEI;AArEJ,gCAA4B;AAC5B,kBAYO;AAEP,4BAAmC;AACnC,uBAAkC;AAClC,uBAA4B;AAC5B,sBAA2C;AAC3C,6BAAiC;AACjC,mBAAgC;AAChC,oBAA+B;AAC/B,oCAAqC;AACrC,YAAuB;AAIhB,SAAS,gBAAgB,SAAoD;AAClF,SAAO,YAAY;AACrB;AAEO,SAAS,SAAS,SAAuB;AAC9C,SAAO,gBAAgB,OAAO,IAAI,kBAAkB,UAAU,YAAY;AAC5E;AAWO,MAAM,cAAc,CAAC,UAA4B;AACtD,QAAM,EAAE,SAAS,UAAU,MAAM,SAAS,UAAU,GAAG,WAAW,IAAI;AACtE,QAAM,MAAM,MAAM,OAAyB,IAAI;AAC/C,QAAM,kBAAc,uCAAY,OAAO;AAIvC,QAAM,UAAU,MAAM;AACpB,UAAM,QAAQ,IAAI;AAClB,UAAM,aAAa,OAAO,iBAAiB;AAC3C,UAAM,aAAa,OAAO;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AACA,UAAM,aAAa,WAAW;AAE9B,QAAI,gBAAgB,WAAW,YAAY;AACzC,YAAM,QAAQ,IAAI,MAAM,SAAS,EAAE,QAAQ,CAAC;AAC5C,YAAM,gBAAgB,gBAAgB,OAAO;AAC7C,iBAAW,KAAK,OAAO,gBAAgB,OAAO,IAAI,QAAQ,OAAO;AACjE,YAAM,cAAc,KAAK;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,aAAa,SAAS,OAAO,CAAC;AAElC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,gBAAgB,gBAAgB,OAAO,IAAI,QAAQ;AAAA,MAClD,GAAG;AAAA,MACJ,UAAU;AAAA,MACV;AAAA,MACA,eAAa;AAAA,MACb,OAAO;AAAA,QACL,GAAI,WACA;AAAA;AAAA,UAEE,UAAU;AAAA,UACV,eAAe;AAAA,UACf,SAAS;AAAA,UACT,QAAQ;AAAA,QACV,IACA;AAAA,UACE,YAAY;AAAA,UACZ,aAAa;AAAA,QACf;AAAA,QAEJ,GAAG,MAAM;AAAA,MACX;AAAA;AAAA,EACF;AAEJ;AAMA,MAAM,iBAAiB;AAEvB,MAAM,6BAAyB,oBAAO,8BAAgB;AAAA,EACpD,MAAM;AACR,CAAC;AAgBD,MAAM,oBAAoB,uBAAuB;AAAA,EAC/C,MAAM;AAAA,IACJ,CAAC,OAA4C,iBAAiB;AAC5D,YAAM;AAAA,QACJ;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL,IAAI;AACJ,YAAM,UAAU,mBAAmB,gBAAgB,eAAe;AAClE,YAAM,YACH,OAAO,QAAQ,SAAS,WACrB,QAAQ,OAAO,WACf,8BAAY,QAAQ,IAAI,KAAK,QAAQ;AAC3C,YAAM,YAAQ,sBAAS;AACvB,YAAM,oBAAgB,yCAAiB,EAAE,MAAM,UAAU,OAAO,MAAM,MAAM,CAAC;AAE7E,YAAM,YAAY,MAAM,SAAS,QAAQ,YAAY;AACrD,YAAM,WAAW,UAAU,IAAI,CAAC,UAAU;AACxC,YAAI,qBAAqB,CAAC,MAAM,eAAe,KAAK,GAAG;AACrD,iBAAO;AAAA,QACT;AACA,eAAO,cAAc,KAAK;AAAA,MAC5B,CAAC;AAED,UAAI,cAAc,gBAAgB,QAAQ,KAAK,KAAK,QAAQ,UAAU;AACpE,eACE;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN,cAAY,SAAS,QAAQ,KAAK;AAAA,YAClC,iBAAe,QAAQ,WAAW,KAAK;AAAA,YACvC,eAAc;AAAA,YACb,GAAG;AAAA,YACJ,KAAK;AAAA,YAEJ;AAAA;AAAA,QACH;AAGJ,aAAO;AAAA,IACT;AAAA,EACF;AACF;AAEA,kBAAkB,cAAc;AAMhC,MAAM,gBAAgB;AAEf,MAAM,oBAAgB,oBAAO,8BAAgB;AAAA,EAClD,MAAM;AAAA,EACN,KAAK;AAAA,EAEL,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,MAAM;AAAA,QACN,iBAAiB;AAAA,QACjB,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,YAAY;AAAA,QACZ,WAAW;AAAA,QACX,aAAa;AAAA,QACb,aAAa;AAAA,QAEb,YAAY;AAAA,UACV,aAAa;AAAA,QACf;AAAA,QAEA,YAAY;AAAA,UACV,aAAa;AAAA,QACf;AAAA,MACF;AAAA,IACF;AAAA,IAEA,MAAM;AAAA,MACJ,WAAW,CAAC,KAAK,EAAE,OAAO,MAAM;AAC9B,cAAM,kBAAc,kCAAiB,yBAAQ,GAAG,CAAC,IAAI;AACrD,eAAO;AAAA,UACL,cAAc;AAAA,QAChB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,iBAAiB;AAAA,IACf,UAAU;AAAA,EACZ;AACF,CAAC;AAGD,MAAM,CAAC,uBAAuB,mBAAmB,QAAI,0CAAmB,aAAa;AASrF,MAAM,CAAC,kBAAkB,kBAAkB,IACzC,sBAA4C,aAAa;AAkBpD,MAAM,eAAW;AAAA,EACtB,cAAc;AAAA,IACZ,MAAM;AAAA,MACJ,CAAC,OAAmC,iBAAiB;AACnD,cAAM;AAAA,UACJ;AAAA,UACA,YAAY;AAAA,UACZ;AAAA,UACA,SAAS;AAAA,UACT;AAAA,UACA;AAAA,UACA,YAAY;AAAA,UACZ,YAAY;AAAA,UACZ,aAAa;AAAA,UACb;AAAA,UACA,QAAQ;AAAA,UACR;AAAA,UACA;AAAA,UACA,GAAG;AAAA,QACL,IAAI;AACJ,cAAM,CAAC,QAAQ,SAAS,IAAI,MAAM,SAAmC,IAAI;AACzE,cAAM,mBAAe,6BAAgB,cAAc,CAAC,SAAS,UAAU,IAAI,CAAC;AAC5E,cAAM,mCAAmC,MAAM,OAAO,KAAK;AAC3D,cAAM,kBAAc,iCAAoB,KAAK;AAE7C,cAAM,gBAAgB,oBAClB,SACE,QAAQ,OAAO,QAAQ,MAAM,CAAC,IAC9B,OACF;AACJ,cAAM,CAAC,UAAU,OAAO,UAAU,QAAI,oDAAqB;AAAA,UACzD,MAAM;AAAA,UACN,aAAa;AAAA,UACb,UAAU;AAAA,QACZ,CAAC;AAED,cAAM,mBAAe;AAAA,cACnB,mCAAkB,QAAQ,YAAY,MAAM,UAAU;AAAA,QACxD;AACA,cAAM,OAAO,YAAY,KAAK,MAAM,eAAe,SAAS,IAAI;AAEhE,cAAM,cAAU,8BAAgB,MAAM;AACtC,cAAM,aAAa,kBAAkB;AAErC,YAAI,QAAQ,IAAI,mBAAmB,UAAU;AAE3C,gBAAM,UAAU,MAAM;AACpB,gBAAI,CAAC,MAAM;AAAI;AACf,uBAAO,oCAAkB,MAAM,IAAI;AAAA,cACjC,gBAAgB,MAAM;AACpB,2BAAW,CAAC,MAAM,CAAC,CAAC;AAAA,cACtB;AAAA,cACA,OAAO,MAAM;AAAA,cAAC;AAAA,YAChB,CAAC;AAAA,UACH,GAAG,CAAC,MAAM,IAAI,UAAU,CAAC;AAAA,QAC3B;AAEA,eACE;AAAA,UAAC;AAAA;AAAA,YACC,OAAO;AAAA,YACP,OAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YAEC,+BAAS,SACR;AAAA,cAAC;AAAA;AAAA,gBACC,SAAS;AAAA,gBACT,SAAS,CAAC,iCAAiC;AAAA,gBAC3C;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA,IAAI,MAAM;AAAA;AAAA,YACZ,IAEA,4EACE;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,OAAO;AAAA,kBACP,QAAQ;AAAA,kBACR,OAAO,UAAU,WAAW;AAAA,kBAC5B,KAAI;AAAA,kBACJ,MAAK;AAAA,kBACL,mBAAiB;AAAA,kBACjB,gBAAc,gBAAgB,OAAO,IAAI,UAAU;AAAA,kBACnD,iBAAe;AAAA,kBACf,cAAY,SAAS,OAAO;AAAA,kBAC5B,iBAAe,WAAW,KAAK;AAAA,kBAC/B;AAAA,kBACC,GAAG;AAAA,kBACJ,KAAK;AAAA,kBACJ,GAAI,qBAAS;AAAA,oBACZ,MAAM;AAAA,oBACN;AAAA,oBACA,eAAW;AAAA,sBACR,MAA6C;AAAA,sBAC9C,CAAC,UAAU;AAET,4BAAI,MAAM,QAAQ;AAAS,gCAAM,eAAe;AAAA,sBAClD;AAAA,oBACF;AAAA,kBACF;AAAA,kBACA,aAAS,kCAAqB,MAAM,SAAgB,CAAC,UAAU;AAC7D;AAAA,sBAAW,CAAC,gBACV,gBAAgB,WAAW,IAAI,OAAO,CAAC;AAAA,oBACzC;AACA,wBAAI,eAAe;AACjB,uDAAiC,UAC/B,MAAM,qBAAqB;AAI7B,0BAAI,CAAC,iCAAiC;AACpC,8BAAM,gBAAgB;AAAA,oBAC1B;AAAA,kBACF,CAAC;AAAA;AAAA,cACH;AAAA,cAEC,qBAAS,gBACR;AAAA,gBAAC;AAAA;AAAA,kBACC,UAAQ;AAAA,kBACR,SAAS;AAAA,kBACT,SAAS,CAAC,iCAAiC;AAAA,kBAC3C;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA;AAAA,cACF,IACE;AAAA,eACN;AAAA;AAAA,QAEJ;AAAA,MAEJ;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,WAAW;AAAA,EACb;AACF;AAEA,SAAS,cAAc;",
4
+ "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n // use Checkbox for easier themes\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -71,6 +71,7 @@ const BubbleInput = (props) => {
71
71
  };
72
72
  const INDICATOR_NAME = "CheckboxIndicator";
73
73
  const CheckboxIndicatorFrame = styled(ThemeableStack, {
74
+ // use Checkbox for easier themes
74
75
  name: INDICATOR_NAME
75
76
  });
76
77
  const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
@@ -98,7 +99,6 @@ const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
98
99
  return /* @__PURE__ */ jsx(
99
100
  CheckboxIndicatorFrame,
100
101
  {
101
- theme: "active",
102
102
  "data-state": getState(context.state),
103
103
  "data-disabled": context.disabled ? "" : void 0,
104
104
  pointerEvents: "none",
@@ -225,7 +225,6 @@ const Checkbox = withStaticProperties(
225
225
  {
226
226
  width: size,
227
227
  height: size,
228
- theme: checked ? "active" : null,
229
228
  tag: "button",
230
229
  role: "checkbox",
231
230
  "aria-labelledby": labelledBy,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Checkbox.tsx"],
4
- "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n theme=\"active\"\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n theme={checked ? 'active' : null}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n // use Checkbox for easier themes\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -71,6 +71,7 @@ const BubbleInput = (props) => {
71
71
  };
72
72
  const INDICATOR_NAME = "CheckboxIndicator";
73
73
  const CheckboxIndicatorFrame = styled(ThemeableStack, {
74
+ // use Checkbox for easier themes
74
75
  name: INDICATOR_NAME
75
76
  });
76
77
  const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
@@ -98,7 +99,6 @@ const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
98
99
  return /* @__PURE__ */ jsx(
99
100
  CheckboxIndicatorFrame,
100
101
  {
101
- theme: "active",
102
102
  "data-state": getState(context.state),
103
103
  "data-disabled": context.disabled ? "" : void 0,
104
104
  pointerEvents: "none",
@@ -225,7 +225,6 @@ const Checkbox = withStaticProperties(
225
225
  {
226
226
  width: size,
227
227
  height: size,
228
- theme: checked ? "active" : null,
229
228
  tag: "button",
230
229
  role: "checkbox",
231
230
  "aria-labelledby": labelledBy,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Checkbox.tsx"],
4
- "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n theme=\"active\"\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n theme={checked ? 'active' : null}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
- "mappings": "AAwEI,SA2PU,UA3PV,KA2PU,YA3PV;AArEJ,SAAS,mBAAmB;AAC5B;AAAA,EAIE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAClC,SAAS,mBAAmB;AAC5B,SAAS,SAAS,yBAAyB;AAC3C,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,4BAA4B;AACrC,YAAY,WAAW;AAIhB,SAAS,gBAAgB,SAAoD;AAClF,SAAO,YAAY;AACrB;AAEO,SAAS,SAAS,SAAuB;AAC9C,SAAO,gBAAgB,OAAO,IAAI,kBAAkB,UAAU,YAAY;AAC5E;AAWO,MAAM,cAAc,CAAC,UAA4B;AACtD,QAAM,EAAE,SAAS,UAAU,MAAM,SAAS,UAAU,GAAG,WAAW,IAAI;AACtE,QAAM,MAAM,MAAM,OAAyB,IAAI;AAC/C,QAAM,cAAc,YAAY,OAAO;AAIvC,QAAM,UAAU,MAAM;AACpB,UAAM,QAAQ,IAAI;AAClB,UAAM,aAAa,OAAO,iBAAiB;AAC3C,UAAM,aAAa,OAAO;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AACA,UAAM,aAAa,WAAW;AAE9B,QAAI,gBAAgB,WAAW,YAAY;AACzC,YAAM,QAAQ,IAAI,MAAM,SAAS,EAAE,QAAQ,CAAC;AAC5C,YAAM,gBAAgB,gBAAgB,OAAO;AAC7C,iBAAW,KAAK,OAAO,gBAAgB,OAAO,IAAI,QAAQ,OAAO;AACjE,YAAM,cAAc,KAAK;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,aAAa,SAAS,OAAO,CAAC;AAElC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,gBAAgB,gBAAgB,OAAO,IAAI,QAAQ;AAAA,MAClD,GAAG;AAAA,MACJ,UAAU;AAAA,MACV;AAAA,MACA,eAAa;AAAA,MACb,OAAO;AAAA,QACL,GAAI,WACA;AAAA;AAAA,UAEE,UAAU;AAAA,UACV,eAAe;AAAA,UACf,SAAS;AAAA,UACT,QAAQ;AAAA,QACV,IACA;AAAA,UACE,YAAY;AAAA,UACZ,aAAa;AAAA,QACf;AAAA,QAEJ,GAAG,MAAM;AAAA,MACX;AAAA;AAAA,EACF;AAEJ;AAMA,MAAM,iBAAiB;AAEvB,MAAM,yBAAyB,OAAO,gBAAgB;AAAA,EACpD,MAAM;AACR,CAAC;AAgBD,MAAM,oBAAoB,uBAAuB;AAAA,EAC/C,MAAM;AAAA,IACJ,CAAC,OAA4C,iBAAiB;AAC5D,YAAM;AAAA,QACJ;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL,IAAI;AACJ,YAAM,UAAU,mBAAmB,gBAAgB,eAAe;AAClE,YAAM,YACH,OAAO,QAAQ,SAAS,WACrB,QAAQ,OAAO,OACf,YAAY,QAAQ,IAAI,KAAK,QAAQ;AAC3C,YAAM,QAAQ,SAAS;AACvB,YAAM,gBAAgB,iBAAiB,EAAE,MAAM,UAAU,OAAO,MAAM,MAAM,CAAC;AAE7E,YAAM,YAAY,MAAM,SAAS,QAAQ,YAAY;AACrD,YAAM,WAAW,UAAU,IAAI,CAAC,UAAU;AACxC,YAAI,qBAAqB,CAAC,MAAM,eAAe,KAAK,GAAG;AACrD,iBAAO;AAAA,QACT;AACA,eAAO,cAAc,KAAK;AAAA,MAC5B,CAAC;AAED,UAAI,cAAc,gBAAgB,QAAQ,KAAK,KAAK,QAAQ,UAAU;AACpE,eACE;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN,cAAY,SAAS,QAAQ,KAAK;AAAA,YAClC,iBAAe,QAAQ,WAAW,KAAK;AAAA,YACvC,eAAc;AAAA,YACb,GAAG;AAAA,YACJ,KAAK;AAAA,YAEJ;AAAA;AAAA,QACH;AAGJ,aAAO;AAAA,IACT;AAAA,EACF;AACF;AAEA,kBAAkB,cAAc;AAMhC,MAAM,gBAAgB;AAEf,MAAM,gBAAgB,OAAO,gBAAgB;AAAA,EAClD,MAAM;AAAA,EACN,KAAK;AAAA,EAEL,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,MAAM;AAAA,QACN,iBAAiB;AAAA,QACjB,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,YAAY;AAAA,QACZ,WAAW;AAAA,QACX,aAAa;AAAA,QACb,aAAa;AAAA,QAEb,YAAY;AAAA,UACV,aAAa;AAAA,QACf;AAAA,QAEA,YAAY;AAAA,UACV,aAAa;AAAA,QACf;AAAA,MACF;AAAA,IACF;AAAA,IAEA,MAAM;AAAA,MACJ,WAAW,CAAC,KAAK,EAAE,OAAO,MAAM;AAC9B,cAAM,cAAc,iBAAiB,QAAQ,GAAG,CAAC,IAAI;AACrD,eAAO;AAAA,UACL,cAAc;AAAA,QAChB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,iBAAiB;AAAA,IACf,UAAU;AAAA,EACZ;AACF,CAAC;AAGD,MAAM,CAAC,uBAAuB,mBAAmB,IAAI,mBAAmB,aAAa;AASrF,MAAM,CAAC,kBAAkB,kBAAkB,IACzC,sBAA4C,aAAa;AAkBpD,MAAM,WAAW;AAAA,EACtB,cAAc;AAAA,IACZ,MAAM;AAAA,MACJ,CAAC,OAAmC,iBAAiB;AACnD,cAAM;AAAA,UACJ;AAAA,UACA,YAAY;AAAA,UACZ;AAAA,UACA,SAAS;AAAA,UACT;AAAA,UACA;AAAA,UACA,YAAY;AAAA,UACZ,YAAY;AAAA,UACZ,aAAa;AAAA,UACb;AAAA,UACA,QAAQ;AAAA,UACR;AAAA,UACA;AAAA,UACA,GAAG;AAAA,QACL,IAAI;AACJ,cAAM,CAAC,QAAQ,SAAS,IAAI,MAAM,SAAmC,IAAI;AACzE,cAAM,eAAe,gBAAgB,cAAc,CAAC,SAAS,UAAU,IAAI,CAAC;AAC5E,cAAM,mCAAmC,MAAM,OAAO,KAAK;AAC3D,cAAM,cAAc,oBAAoB,KAAK;AAE7C,cAAM,gBAAgB,QAClB,SACE,QAAQ,OAAO,QAAQ,MAAM,CAAC,IAC9B,OACF;AACJ,cAAM,CAAC,UAAU,OAAO,UAAU,IAAI,qBAAqB;AAAA,UACzD,MAAM;AAAA,UACN,aAAa;AAAA,UACb,UAAU;AAAA,QACZ,CAAC;AAED,cAAM,eAAe;AAAA,UACnB,kBAAkB,QAAQ,YAAY,MAAM,UAAU;AAAA,QACxD;AACA,cAAM,OAAO,YAAY,KAAK,MAAM,eAAe,SAAS,IAAI;AAEhE,cAAM,UAAU,gBAAgB,MAAM;AACtC,cAAM,aAAa,kBAAkB;AAErC,YAAI,QAAQ,IAAI,mBAAmB,UAAU;AAE3C,gBAAM,UAAU,MAAM;AACpB,gBAAI,CAAC,MAAM;AAAI;AACf,mBAAO,kBAAkB,MAAM,IAAI;AAAA,cACjC,gBAAgB,MAAM;AACpB,2BAAW,CAAC,MAAM,CAAC,CAAC;AAAA,cACtB;AAAA,cACA,OAAO,MAAM;AAAA,cAAC;AAAA,YAChB,CAAC;AAAA,UACH,GAAG,CAAC,MAAM,IAAI,UAAU,CAAC;AAAA,QAC3B;AAEA,eACE;AAAA,UAAC;AAAA;AAAA,YACC,OAAO;AAAA,YACP,OAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YAEC,mBAAS,SACR;AAAA,cAAC;AAAA;AAAA,gBACC,SAAS;AAAA,gBACT,SAAS,CAAC,iCAAiC;AAAA,gBAC3C;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA;AAAA,gBACA,IAAI,MAAM;AAAA;AAAA,YACZ,IAEA,iCACE;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,OAAO;AAAA,kBACP,QAAQ;AAAA,kBACR,OAAO,UAAU,WAAW;AAAA,kBAC5B,KAAI;AAAA,kBACJ,MAAK;AAAA,kBACL,mBAAiB;AAAA,kBACjB,gBAAc,gBAAgB,OAAO,IAAI,UAAU;AAAA,kBACnD,iBAAe;AAAA,kBACf,cAAY,SAAS,OAAO;AAAA,kBAC5B,iBAAe,WAAW,KAAK;AAAA,kBAC/B;AAAA,kBACC,GAAG;AAAA,kBACJ,KAAK;AAAA,kBACJ,GAAI,SAAS;AAAA,oBACZ,MAAM;AAAA,oBACN;AAAA,oBACA,WAAW;AAAA,sBACR,MAA6C;AAAA,sBAC9C,CAAC,UAAU;AAET,4BAAI,MAAM,QAAQ;AAAS,gCAAM,eAAe;AAAA,sBAClD;AAAA,oBACF;AAAA,kBACF;AAAA,kBACA,SAAS,qBAAqB,MAAM,SAAgB,CAAC,UAAU;AAC7D;AAAA,sBAAW,CAAC,gBACV,gBAAgB,WAAW,IAAI,OAAO,CAAC;AAAA,oBACzC;AACA,wBAAI,eAAe;AACjB,uDAAiC,UAC/B,MAAM,qBAAqB;AAI7B,0BAAI,CAAC,iCAAiC;AACpC,8BAAM,gBAAgB;AAAA,oBAC1B;AAAA,kBACF,CAAC;AAAA;AAAA,cACH;AAAA,cAEC,SAAS,gBACR;AAAA,gBAAC;AAAA;AAAA,kBACC,UAAQ;AAAA,kBACR,SAAS;AAAA,kBACT,SAAS,CAAC,iCAAiC;AAAA,kBAC3C;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA;AAAA,cACF,IACE;AAAA,eACN;AAAA;AAAA,QAEJ;AAAA,MAEJ;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,WAAW;AAAA,EACb;AACF;AAEA,SAAS,cAAc;",
4
+ "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n // use Checkbox for easier themes\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -67,6 +67,7 @@ const BubbleInput = (props) => {
67
67
  };
68
68
  const INDICATOR_NAME = "CheckboxIndicator";
69
69
  const CheckboxIndicatorFrame = styled(ThemeableStack, {
70
+ // use Checkbox for easier themes
70
71
  name: INDICATOR_NAME
71
72
  });
72
73
  const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
@@ -92,7 +93,6 @@ const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
92
93
  });
93
94
  if (forceMount || isIndeterminate(context.state) || context.state === true)
94
95
  return <CheckboxIndicatorFrame
95
- theme="active"
96
96
  data-state={getState(context.state)}
97
97
  data-disabled={context.disabled ? "" : void 0}
98
98
  pointerEvents="none"
@@ -210,7 +210,6 @@ const Checkbox = withStaticProperties(
210
210
  <CheckboxFrame
211
211
  width={size}
212
212
  height={size}
213
- theme={checked ? "active" : null}
214
213
  tag="button"
215
214
  role="checkbox"
216
215
  aria-labelledby={labelledBy}
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Checkbox.tsx"],
4
- "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n theme=\"active\"\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n theme={checked ? 'active' : null}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n // use Checkbox for easier themes\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -67,6 +67,7 @@ const BubbleInput = (props) => {
67
67
  };
68
68
  const INDICATOR_NAME = "CheckboxIndicator";
69
69
  const CheckboxIndicatorFrame = styled(ThemeableStack, {
70
+ // use Checkbox for easier themes
70
71
  name: INDICATOR_NAME
71
72
  });
72
73
  const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
@@ -92,7 +93,6 @@ const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
92
93
  });
93
94
  if (forceMount || isIndeterminate(context.state) || context.state === true)
94
95
  return <CheckboxIndicatorFrame
95
- theme="active"
96
96
  data-state={getState(context.state)}
97
97
  data-disabled={context.disabled ? "" : void 0}
98
98
  pointerEvents="none"
@@ -210,7 +210,6 @@ const Checkbox = withStaticProperties(
210
210
  <CheckboxFrame
211
211
  width={size}
212
212
  height={size}
213
- theme={checked ? "active" : null}
214
213
  tag="button"
215
214
  role="checkbox"
216
215
  aria-labelledby={labelledBy}
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Checkbox.tsx"],
4
- "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n theme=\"active\"\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n theme={checked ? 'active' : null}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["// fork of radix\n// https://github.com/radix-ui/primitives/tree/main/packages/react/checkbox/src/Checkbox.tsx\n\nimport { usePrevious } from '@radix-ui/react-use-previous'\nimport {\n GetProps,\n SizeTokens,\n TamaguiElement,\n composeEventHandlers,\n getVariableValue,\n isWeb,\n styled,\n useComposedRefs,\n useMediaPropsActive,\n useTheme,\n withStaticProperties,\n} from '@tamagui/core'\nimport type { Scope } from '@tamagui/create-context'\nimport { createContextScope } from '@tamagui/create-context'\nimport { registerFocusable } from '@tamagui/focusable'\nimport { getFontSize } from '@tamagui/font-size'\nimport { getSize, stepTokenUpOrDown } from '@tamagui/get-size'\nimport { useGetThemedIcon } from '@tamagui/helpers-tamagui'\nimport { useLabelContext } from '@tamagui/label'\nimport { ThemeableStack } from '@tamagui/stacks'\nimport { useControllableState } from '@tamagui/use-controllable-state'\nimport * as React from 'react'\n\nexport type CheckedState = boolean | 'indeterminate'\n\nexport function isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate'\n}\n\nexport function getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked'\n}\n\ntype InputProps = any //Radix.ComponentPropsWithoutRef<'input'>\ninterface BubbleInputProps extends Omit<InputProps, 'checked'> {\n checked: CheckedState\n control: HTMLElement | null\n bubbles: boolean\n\n isHidden?: boolean\n}\n\nexport const BubbleInput = (props: BubbleInputProps) => {\n const { checked, bubbles = true, control, isHidden, ...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(\n inputProto,\n 'checked'\n ) as PropertyDescriptor\n const setChecked = descriptor.set\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles })\n input.indeterminate = isIndeterminate(checked)\n setChecked.call(input, isIndeterminate(checked) ? false : checked)\n input.dispatchEvent(event)\n }\n }, [prevChecked, checked, bubbles])\n\n return (\n <input\n type=\"checkbox\"\n defaultChecked={isIndeterminate(checked) ? false : checked}\n {...inputProps}\n tabIndex={-1}\n ref={ref}\n aria-hidden={isHidden}\n style={{\n ...(isHidden\n ? {\n // ...controlSize,\n position: 'absolute',\n pointerEvents: 'none',\n opacity: 0,\n margin: 0,\n }\n : {\n appearance: 'auto',\n accentColor: 'var(--color6)',\n }),\n\n ...props.style,\n }}\n />\n )\n}\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator'\n\nconst CheckboxIndicatorFrame = styled(ThemeableStack, {\n // use Checkbox for easier themes\n name: INDICATOR_NAME,\n})\n\ntype CheckboxIndicatorFrameProps = GetProps<typeof CheckboxIndicatorFrame>\n\nexport type CheckboxIndicatorProps = CheckboxIndicatorFrameProps & {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true\n /**\n * Used to disable passing styles down to children.\n */\n disablePassStyles?: boolean\n}\n\nconst CheckboxIndicator = CheckboxIndicatorFrame.extractable(\n React.forwardRef<TamaguiElement, CheckboxIndicatorProps>(\n (props: ScopedProps<CheckboxIndicatorProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n children: childrenProp,\n forceMount,\n disablePassStyles,\n ...indicatorProps\n } = props\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox)\n const iconSize =\n (typeof context.size === 'number'\n ? context.size * 0.65\n : getFontSize(context.size)) * context.scaleIcon\n const theme = useTheme()\n const getThemedIcon = useGetThemedIcon({ size: iconSize, color: theme.color })\n\n const childrens = React.Children.toArray(childrenProp)\n const children = childrens.map((child) => {\n if (disablePassStyles || !React.isValidElement(child)) {\n return child\n }\n return getThemedIcon(child)\n })\n\n if (forceMount || isIndeterminate(context.state) || context.state === true)\n return (\n <CheckboxIndicatorFrame\n data-state={getState(context.state)}\n data-disabled={context.disabled ? '' : undefined}\n pointerEvents=\"none\"\n {...indicatorProps}\n ref={forwardedRef}\n >\n {children}\n </CheckboxIndicatorFrame>\n )\n\n return null\n }\n )\n)\n\nCheckboxIndicator.displayName = INDICATOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox'\n\nexport const CheckboxFrame = styled(ThemeableStack, {\n name: CHECKBOX_NAME,\n tag: 'button',\n\n variants: {\n unstyled: {\n false: {\n size: '$true',\n backgroundColor: '$background',\n alignItems: 'center',\n justifyContent: 'center',\n pressTheme: true,\n focusable: true,\n borderWidth: 1,\n borderColor: '$borderColor',\n\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n },\n },\n\n size: {\n '...size': (val, { tokens }) => {\n const radiusToken = getVariableValue(getSize(val)) / 8\n return {\n borderRadius: radiusToken,\n }\n },\n },\n } as const,\n\n defaultVariants: {\n unstyled: false,\n },\n})\n\ntype ScopedProps<P> = P & { __scopeCheckbox?: Scope }\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME)\n\ntype CheckboxContextValue = {\n state: CheckedState\n disabled?: boolean\n size: SizeTokens\n scaleIcon: number\n}\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext<CheckboxContextValue>(CHECKBOX_NAME)\n\ntype CheckboxFrameProps = GetProps<typeof CheckboxFrame>\nexport interface CheckboxProps\n extends Omit<CheckboxFrameProps, 'checked' | 'defaultChecked'> {\n checked?: CheckedState\n defaultChecked?: CheckedState\n required?: boolean\n onCheckedChange?(checked: CheckedState): void\n labelledBy?: string\n name?: string\n value?: string\n native?: boolean\n scaleIcon?: number\n scaleSize?: number\n sizeAdjust?: number\n}\n\nexport const Checkbox = withStaticProperties(\n CheckboxFrame.extractable(\n React.forwardRef<HTMLButtonElement, CheckboxProps>(\n (props: ScopedProps<CheckboxProps>, forwardedRef) => {\n const {\n __scopeCheckbox,\n labelledBy: ariaLabelledby,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n scaleIcon = 1,\n scaleSize = 0.45,\n sizeAdjust = 0,\n disabled,\n value = 'on',\n onCheckedChange,\n native,\n ...checkboxProps\n } = props\n const [button, setButton] = React.useState<HTMLButtonElement | null>(null)\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node))\n const hasConsumerStoppedPropagationRef = React.useRef(false)\n const propsActive = useMediaPropsActive(props)\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = isWeb\n ? button\n ? Boolean(button.closest('form'))\n : true\n : false\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked!,\n onChange: onCheckedChange,\n })\n\n const adjustedSize = getVariableValue(\n stepTokenUpOrDown('size', propsActive.size, sizeAdjust)\n )\n const size = scaleSize ? Math.round(adjustedSize * scaleSize) : adjustedSize\n\n const labelId = useLabelContext(button)\n const labelledBy = ariaLabelledby || labelId\n\n if (process.env.TAMAGUI_TARGET === 'native') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (!props.id) return\n return registerFocusable(props.id, {\n focusAndSelect: () => {\n setChecked((x) => !x)\n },\n focus: () => {},\n })\n }, [props.id, setChecked])\n }\n\n return (\n <CheckboxProvider\n scope={__scopeCheckbox}\n state={checked}\n disabled={disabled}\n size={size}\n scaleIcon={scaleIcon}\n >\n {isWeb && native ? (\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 id={props.id}\n />\n ) : (\n <>\n <CheckboxFrame\n width={size}\n height={size}\n tag=\"button\"\n role=\"checkbox\"\n aria-labelledby={labelledBy}\n aria-checked={isIndeterminate(checked) ? 'mixed' : checked}\n aria-required={required}\n data-state={getState(checked)}\n data-disabled={disabled ? '' : undefined}\n disabled={disabled}\n {...checkboxProps}\n ref={composedRefs}\n {...(isWeb && {\n type: 'button',\n value,\n onKeyDown: composeEventHandlers(\n (props as React.HTMLProps<HTMLButtonElement>).onKeyDown,\n (event) => {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault()\n }\n ),\n })}\n onPress={composeEventHandlers(props.onPress as any, (event) => {\n setChecked((prevChecked) =>\n isIndeterminate(prevChecked) ? true : !prevChecked\n )\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current =\n event.isPropagationStopped()\n // if checkbox 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 checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current)\n event.stopPropagation()\n }\n })}\n />\n\n {isWeb && isFormControl ? (\n <BubbleInput\n isHidden\n control={button}\n bubbles={!hasConsumerStoppedPropagationRef.current}\n name={name}\n value={value}\n checked={checked}\n required={required}\n disabled={disabled}\n />\n ) : null}\n </>\n )}\n </CheckboxProvider>\n )\n }\n )\n ),\n {\n Indicator: CheckboxIndicator,\n }\n)\n\nCheckbox.displayName = CHECKBOX_NAME\n\nexport { createCheckboxScope }\n"],
5
+ "mappings": "AAGA,SAAS,mBAAmB;AAC5B;AAAA,EAIE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,0BAA0B;AACnC,SAAS,yBAAyB;AAClC,SAAS,mBAAmB;AAC5B,SAAS,SAAS,yBAAyB;AAC3C,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,4BAA4B;AACrC,YAAY,WAAW;AAIhB,SAAS,gBAAgB,SAAoD;AAClF,SAAO,YAAY;AACrB;AAEO,SAAS,SAAS,SAAuB;AAC9C,SAAO,gBAAgB,OAAO,IAAI,kBAAkB,UAAU,YAAY;AAC5E;AAWO,MAAM,cAAc,CAAC,UAA4B;AACtD,QAAM,EAAE,SAAS,UAAU,MAAM,SAAS,UAAU,GAAG,WAAW,IAAI;AACtE,QAAM,MAAM,MAAM,OAAyB,IAAI;AAC/C,QAAM,cAAc,YAAY,OAAO;AAIvC,QAAM,UAAU,MAAM;AACpB,UAAM,QAAQ,IAAI;AAClB,UAAM,aAAa,OAAO,iBAAiB;AAC3C,UAAM,aAAa,OAAO;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AACA,UAAM,aAAa,WAAW;AAE9B,QAAI,gBAAgB,WAAW,YAAY;AACzC,YAAM,QAAQ,IAAI,MAAM,SAAS,EAAE,QAAQ,CAAC;AAC5C,YAAM,gBAAgB,gBAAgB,OAAO;AAC7C,iBAAW,KAAK,OAAO,gBAAgB,OAAO,IAAI,QAAQ,OAAO;AACjE,YAAM,cAAc,KAAK;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,aAAa,SAAS,OAAO,CAAC;AAElC,SACE,CAAC;AAAA,IACC,KAAK;AAAA,IACL,gBAAgB,gBAAgB,OAAO,IAAI,QAAQ;AAAA,QAC/C;AAAA,IACJ,UAAU;AAAA,IACV,KAAK;AAAA,IACL,aAAa;AAAA,IACb,OAAO;AAAA,MACL,GAAI,WACA;AAAA;AAAA,QAEE,UAAU;AAAA,QACV,eAAe;AAAA,QACf,SAAS;AAAA,QACT,QAAQ;AAAA,MACV,IACA;AAAA,QACE,YAAY;AAAA,QACZ,aAAa;AAAA,MACf;AAAA,MAEJ,GAAG,MAAM;AAAA,IACX;AAAA,EACF;AAEJ;AAMA,MAAM,iBAAiB;AAEvB,MAAM,yBAAyB,OAAO,gBAAgB;AAAA;AAAA,EAEpD,MAAM;AACR,CAAC;AAgBD,MAAM,oBAAoB,uBAAuB;AAAA,EAC/C,MAAM;AAAA,IACJ,CAAC,OAA4C,iBAAiB;AAC5D,YAAM;AAAA,QACJ;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA,GAAG;AAAA,MACL,IAAI;AACJ,YAAM,UAAU,mBAAmB,gBAAgB,eAAe;AAClE,YAAM,YACH,OAAO,QAAQ,SAAS,WACrB,QAAQ,OAAO,OACf,YAAY,QAAQ,IAAI,KAAK,QAAQ;AAC3C,YAAM,QAAQ,SAAS;AACvB,YAAM,gBAAgB,iBAAiB,EAAE,MAAM,UAAU,OAAO,MAAM,MAAM,CAAC;AAE7E,YAAM,YAAY,MAAM,SAAS,QAAQ,YAAY;AACrD,YAAM,WAAW,UAAU,IAAI,CAAC,UAAU;AACxC,YAAI,qBAAqB,CAAC,MAAM,eAAe,KAAK,GAAG;AACrD,iBAAO;AAAA,QACT;AACA,eAAO,cAAc,KAAK;AAAA,MAC5B,CAAC;AAED,UAAI,cAAc,gBAAgB,QAAQ,KAAK,KAAK,QAAQ,UAAU;AACpE,eACE,CAAC;AAAA,UACC,YAAY,SAAS,QAAQ,KAAK;AAAA,UAClC,eAAe,QAAQ,WAAW,KAAK;AAAA,UACvC,cAAc;AAAA,cACV;AAAA,UACJ,KAAK;AAAA,UAEJ,SACH,EARC;AAWL,aAAO;AAAA,IACT;AAAA,EACF;AACF;AAEA,kBAAkB,cAAc;AAMhC,MAAM,gBAAgB;AAEf,MAAM,gBAAgB,OAAO,gBAAgB;AAAA,EAClD,MAAM;AAAA,EACN,KAAK;AAAA,EAEL,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,MAAM;AAAA,QACN,iBAAiB;AAAA,QACjB,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,YAAY;AAAA,QACZ,WAAW;AAAA,QACX,aAAa;AAAA,QACb,aAAa;AAAA,QAEb,YAAY;AAAA,UACV,aAAa;AAAA,QACf;AAAA,QAEA,YAAY;AAAA,UACV,aAAa;AAAA,QACf;AAAA,MACF;AAAA,IACF;AAAA,IAEA,MAAM;AAAA,MACJ,WAAW,CAAC,KAAK,EAAE,OAAO,MAAM;AAC9B,cAAM,cAAc,iBAAiB,QAAQ,GAAG,CAAC,IAAI;AACrD,eAAO;AAAA,UACL,cAAc;AAAA,QAChB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,iBAAiB;AAAA,IACf,UAAU;AAAA,EACZ;AACF,CAAC;AAGD,MAAM,CAAC,uBAAuB,mBAAmB,IAAI,mBAAmB,aAAa;AASrF,MAAM,CAAC,kBAAkB,kBAAkB,IACzC,sBAA4C,aAAa;AAkBpD,MAAM,WAAW;AAAA,EACtB,cAAc;AAAA,IACZ,MAAM;AAAA,MACJ,CAAC,OAAmC,iBAAiB;AACnD,cAAM;AAAA,UACJ;AAAA,UACA,YAAY;AAAA,UACZ;AAAA,UACA,SAAS;AAAA,UACT;AAAA,UACA;AAAA,UACA,YAAY;AAAA,UACZ,YAAY;AAAA,UACZ,aAAa;AAAA,UACb;AAAA,UACA,QAAQ;AAAA,UACR;AAAA,UACA;AAAA,UACA,GAAG;AAAA,QACL,IAAI;AACJ,cAAM,CAAC,QAAQ,SAAS,IAAI,MAAM,SAAmC,IAAI;AACzE,cAAM,eAAe,gBAAgB,cAAc,CAAC,SAAS,UAAU,IAAI,CAAC;AAC5E,cAAM,mCAAmC,MAAM,OAAO,KAAK;AAC3D,cAAM,cAAc,oBAAoB,KAAK;AAE7C,cAAM,gBAAgB,QAClB,SACE,QAAQ,OAAO,QAAQ,MAAM,CAAC,IAC9B,OACF;AACJ,cAAM,CAAC,UAAU,OAAO,UAAU,IAAI,qBAAqB;AAAA,UACzD,MAAM;AAAA,UACN,aAAa;AAAA,UACb,UAAU;AAAA,QACZ,CAAC;AAED,cAAM,eAAe;AAAA,UACnB,kBAAkB,QAAQ,YAAY,MAAM,UAAU;AAAA,QACxD;AACA,cAAM,OAAO,YAAY,KAAK,MAAM,eAAe,SAAS,IAAI;AAEhE,cAAM,UAAU,gBAAgB,MAAM;AACtC,cAAM,aAAa,kBAAkB;AAErC,YAAI,QAAQ,IAAI,mBAAmB,UAAU;AAE3C,gBAAM,UAAU,MAAM;AACpB,gBAAI,CAAC,MAAM;AAAI;AACf,mBAAO,kBAAkB,MAAM,IAAI;AAAA,cACjC,gBAAgB,MAAM;AACpB,2BAAW,CAAC,MAAM,CAAC,CAAC;AAAA,cACtB;AAAA,cACA,OAAO,MAAM;AAAA,cAAC;AAAA,YAChB,CAAC;AAAA,UACH,GAAG,CAAC,MAAM,IAAI,UAAU,CAAC;AAAA,QAC3B;AAEA,eACE,CAAC;AAAA,UACC,OAAO;AAAA,UACP,OAAO;AAAA,UACP,UAAU;AAAA,UACV,MAAM;AAAA,UACN,WAAW;AAAA,UAEV,SAAS,SACR,CAAC;AAAA,UACC,SAAS;AAAA,UACT,SAAS,CAAC,iCAAiC;AAAA,UAC3C,MAAM;AAAA,UACN,OAAO;AAAA,UACP,SAAS;AAAA,UACT,UAAU;AAAA,UACV,UAAU;AAAA,UACV,IAAI,MAAM;AAAA,QACZ,KAEA;AAAA,UACE,CAAC;AAAA,YACC,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,IAAI;AAAA,YACJ,KAAK;AAAA,YACL,iBAAiB;AAAA,YACjB,cAAc,gBAAgB,OAAO,IAAI,UAAU;AAAA,YACnD,eAAe;AAAA,YACf,YAAY,SAAS,OAAO;AAAA,YAC5B,eAAe,WAAW,KAAK;AAAA,YAC/B,UAAU;AAAA,gBACN;AAAA,YACJ,KAAK;AAAA,gBACA,SAAS;AAAA,cACZ,MAAM;AAAA,cACN;AAAA,cACA,WAAW;AAAA,gBACR,MAA6C;AAAA,gBAC9C,CAAC,UAAU;AAET,sBAAI,MAAM,QAAQ;AAAS,0BAAM,eAAe;AAAA,gBAClD;AAAA,cACF;AAAA,YACF;AAAA,YACA,SAAS,qBAAqB,MAAM,SAAgB,CAAC,UAAU;AAC7D;AAAA,gBAAW,CAAC,gBACV,gBAAgB,WAAW,IAAI,OAAO,CAAC;AAAA,cACzC;AACA,kBAAI,eAAe;AACjB,iDAAiC,UAC/B,MAAM,qBAAqB;AAI7B,oBAAI,CAAC,iCAAiC;AACpC,wBAAM,gBAAgB;AAAA,cAC1B;AAAA,YACF,CAAC;AAAA,UACH;AAAA,WAEC,SAAS,gBACR,CAAC;AAAA,YACC;AAAA,YACA,SAAS;AAAA,YACT,SAAS,CAAC,iCAAiC;AAAA,YAC3C,MAAM;AAAA,YACN,OAAO;AAAA,YACP,SAAS;AAAA,YACT,UAAU;AAAA,YACV,UAAU;AAAA,UACZ,KACE;AAAA,QACN,IAEJ,EA1EC;AAAA,MA4EL;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,WAAW;AAAA,EACb;AACF;AAEA,SAAS,cAAc;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/checkbox",
3
- "version": "1.5.12",
3
+ "version": "1.5.14",
4
4
  "sideEffects": [
5
5
  "*.css"
6
6
  ],
@@ -20,22 +20,22 @@
20
20
  },
21
21
  "dependencies": {
22
22
  "@radix-ui/react-use-previous": "^0.1.1",
23
- "@tamagui/core": "^1.5.12",
24
- "@tamagui/create-context": "^1.5.12",
25
- "@tamagui/focusable": "^1.5.12",
26
- "@tamagui/font-size": "^1.5.12",
27
- "@tamagui/get-size": "^1.5.12",
28
- "@tamagui/helpers-tamagui": "^1.5.12",
29
- "@tamagui/label": "^1.5.12",
30
- "@tamagui/stacks": "^1.5.12",
31
- "@tamagui/use-controllable-state": "^1.5.12"
23
+ "@tamagui/core": "^1.5.14",
24
+ "@tamagui/create-context": "^1.5.14",
25
+ "@tamagui/focusable": "^1.5.14",
26
+ "@tamagui/font-size": "^1.5.14",
27
+ "@tamagui/get-size": "^1.5.14",
28
+ "@tamagui/helpers-tamagui": "^1.5.14",
29
+ "@tamagui/label": "^1.5.14",
30
+ "@tamagui/stacks": "^1.5.14",
31
+ "@tamagui/use-controllable-state": "^1.5.14"
32
32
  },
33
33
  "peerDependencies": {
34
34
  "react": "*",
35
35
  "react-dom": "*"
36
36
  },
37
37
  "devDependencies": {
38
- "@tamagui/build": "^1.5.12",
38
+ "@tamagui/build": "^1.5.14",
39
39
  "react": "^18.2.0",
40
40
  "react-dom": "^18.2.0"
41
41
  },
package/src/Checkbox.tsx CHANGED
@@ -104,6 +104,7 @@ export const BubbleInput = (props: BubbleInputProps) => {
104
104
  const INDICATOR_NAME = 'CheckboxIndicator'
105
105
 
106
106
  const CheckboxIndicatorFrame = styled(ThemeableStack, {
107
+ // use Checkbox for easier themes
107
108
  name: INDICATOR_NAME,
108
109
  })
109
110
 
@@ -150,7 +151,6 @@ const CheckboxIndicator = CheckboxIndicatorFrame.extractable(
150
151
  if (forceMount || isIndeterminate(context.state) || context.state === true)
151
152
  return (
152
153
  <CheckboxIndicatorFrame
153
- theme="active"
154
154
  data-state={getState(context.state)}
155
155
  data-disabled={context.disabled ? '' : undefined}
156
156
  pointerEvents="none"
@@ -325,7 +325,6 @@ export const Checkbox = withStaticProperties(
325
325
  <CheckboxFrame
326
326
  width={size}
327
327
  height={size}
328
- theme={checked ? 'active' : null}
329
328
  tag="button"
330
329
  role="checkbox"
331
330
  aria-labelledby={labelledBy}
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../src/Checkbox.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,QAAQ,EACR,UAAU,EACV,cAAc,EASf,MAAM,eAAe,CAAA;AAUtB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,eAAe,CAAA;AAEpD,wBAAgB,eAAe,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,OAAO,IAAI,eAAe,CAElF;AAED,wBAAgB,QAAQ,CAAC,OAAO,EAAE,YAAY,6CAE7C;AAED,KAAK,UAAU,GAAG,GAAG,CAAA;AACrB,UAAU,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAC5D,OAAO,EAAE,YAAY,CAAA;IACrB,OAAO,EAAE,WAAW,GAAG,IAAI,CAAA;IAC3B,OAAO,EAAE,OAAO,CAAA;IAEhB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,eAAO,MAAM,WAAW,UAAW,gBAAgB,gBAkDlD,CAAA;AAQD,QAAA,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAE1B,CAAA;AAEF,KAAK,2BAA2B,GAAG,QAAQ,CAAC,OAAO,sBAAsB,CAAC,CAAA;AAE1E,MAAM,MAAM,sBAAsB,GAAG,2BAA2B,GAAG;IACjE;;;OAGG;IACH,UAAU,CAAC,EAAE,IAAI,CAAA;IACjB;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B,CAAA;AAuDD,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuCxB,CAAA;AAGF,QAAA,MAA8B,mBAAmB,+CAAqC,CAAA;AAYtF,KAAK,kBAAkB,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAA;AACxD,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,SAAS,GAAG,gBAAgB,CAAC;IAC9D,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,cAAc,CAAC,EAAE,YAAY,CAAA;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,eAAe,CAAC,CAAC,OAAO,EAAE,YAAY,GAAG,IAAI,CAAA;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAtInB;;;WAGG;;QAEH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;;WAGG;;QAEH;;WAEG;;;CA4QJ,CAAA;AAID,OAAO,EAAE,mBAAmB,EAAE,CAAA"}
1
+ {"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../src/Checkbox.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,QAAQ,EACR,UAAU,EACV,cAAc,EASf,MAAM,eAAe,CAAA;AAUtB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,eAAe,CAAA;AAEpD,wBAAgB,eAAe,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,OAAO,IAAI,eAAe,CAElF;AAED,wBAAgB,QAAQ,CAAC,OAAO,EAAE,YAAY,6CAE7C;AAED,KAAK,UAAU,GAAG,GAAG,CAAA;AACrB,UAAU,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC;IAC5D,OAAO,EAAE,YAAY,CAAA;IACrB,OAAO,EAAE,WAAW,GAAG,IAAI,CAAA;IAC3B,OAAO,EAAE,OAAO,CAAA;IAEhB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,eAAO,MAAM,WAAW,UAAW,gBAAgB,gBAkDlD,CAAA;AAQD,QAAA,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAG1B,CAAA;AAEF,KAAK,2BAA2B,GAAG,QAAQ,CAAC,OAAO,sBAAsB,CAAC,CAAA;AAE1E,MAAM,MAAM,sBAAsB,GAAG,2BAA2B,GAAG;IACjE;;;OAGG;IACH,UAAU,CAAC,EAAE,IAAI,CAAA;IACjB;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B,CAAA;AAsDD,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuCxB,CAAA;AAGF,QAAA,MAA8B,mBAAmB,+CAAqC,CAAA;AAYtF,KAAK,kBAAkB,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAA;AACxD,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,SAAS,GAAG,gBAAgB,CAAC;IAC9D,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,cAAc,CAAC,EAAE,YAAY,CAAA;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,eAAe,CAAC,CAAC,OAAO,EAAE,YAAY,GAAG,IAAI,CAAA;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QArInB;;;WAGG;;QAEH;;WAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAPH;;;WAGG;;QAEH;;WAEG;;;CA0QJ,CAAA;AAID,OAAO,EAAE,mBAAmB,EAAE,CAAA"}