react-native-system-ui 1.0.1 → 1.0.3

package/dist/cjs/components/search/Search.js

@@ -1,215 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Search = void 0;
-function _react() {
-  const data = _interopRequireWildcard(require("react"));
-  _react = function () {
-    return data;
-  };
-  return data;
-}
-function _reactNative() {
-  const data = require("react-native");
-  _reactNative = function () {
-    return data;
-  };
-  return data;
-}
-function _reactNativeSystemIcon() {
-  const data = require("react-native-system-icon");
-  _reactNativeSystemIcon = function () {
-    return data;
-  };
-  return data;
-}
-var _hooks = require("../../hooks");
-var _validate = require("../../utils/validate");
-var _useLocale = require("../config-provider/useLocale");
-var _field = _interopRequireDefault(require("../field"));
-var _tokens = require("./tokens");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-const SearchComponent = (props, ref) => {
-  const locale = (0, _useLocale.useLocale)();
-  const {
-    tokensOverride,
-    label,
-    action,
-    actionText,
-    showAction = false,
-    shape: shapeP,
-    background,
-    style: containerStyle,
-    fieldStyle,
-    fieldContentStyle,
-    clearTrigger,
-    clearable = true,
-    leftIcon,
-    rightIcon,
-    errorMessage,
-    onSearch,
-    onCancel,
-    onChangeText,
-    onSubmitEditing,
-    returnKeyType,
-    inputStyle,
-    align,
-    inputAlign,
-    ...restFieldProps
-  } = props;
-  const tokens = (0, _tokens.useSearchTokens)(tokensOverride);
-  const shape = shapeP ?? tokens.defaults.shape;
-  const [value, triggerChange] = (0, _hooks.useControllableValue)(props, {
-    defaultValue: ''
-  });
-  const inputValue = value ?? '';
-  const rInputAlign = align ?? inputAlign;
-  const onChangeTextRef = (0, _react().useRef)(onChangeText),
-    onCancelRef = (0, _react().useRef)(onCancel),
-    onSearchRef = (0, _react().useRef)(onSearch),
-    onSubmitEditingRef = (0, _react().useRef)(onSubmitEditing),
-    inputValueRef = (0, _react().useRef)(inputValue);
-  onChangeTextRef.current = onChangeText;
-  onCancelRef.current = onCancel;
-  onSearchRef.current = onSearch;
-  onSubmitEditingRef.current = onSubmitEditing;
-  inputValueRef.current = inputValue;
-  const handleChange = (0, _react().useCallback)(next => {
-    triggerChange(next);
-    onChangeTextRef.current?.(next);
-  }, [triggerChange]);
-  const handleCancel = (0, _react().useCallback)(() => {
-    handleChange('');
-    onCancelRef.current?.();
-  }, [handleChange]);
-  const handleSubmit = (0, _react().useCallback)(event => {
-    onSearchRef.current?.(inputValueRef.current);
-    onSubmitEditingRef.current?.(event);
-  }, []);
-  const rBg = background ?? tokens.colors.background;
-  const rLeftIcon = leftIcon ?? /*#__PURE__*/_react().default.createElement(_reactNativeSystemIcon().Search, {
-    size: tokens.icon.size,
-    fill: tokens.colors.icon,
-    color: tokens.colors.icon
-  });
-  const rClearTrigger = clearTrigger ?? tokens.defaults.clearTrigger;
-  const rReturnKey = returnKeyType ?? 'search';
-  const showAct = !!action || showAction;
-  const customActTxt = /*#__PURE__*/_react().default.isValidElement(actionText);
-  const renderCancelAct = showAct && !action && !customActTxt;
-  const radius = shape === 'round' ? tokens.radius.round : tokens.radius.square;
-  const inputRef = (0, _react().useRef)(null);
-  (0, _react().useImperativeHandle)(ref, () => ({
-    focus: () => inputRef.current?.focus(),
-    blur: () => inputRef.current?.blur(),
-    clear: () => handleChange('')
-  }), [handleChange]);
-  const cancelActPress = (0, _hooks.useAriaPress)({
-    disabled: !renderCancelAct,
-    onPress: handleCancel,
-    extraProps: {
-      accessibilityRole: 'button',
-      testID: 'rnsu-search-action'
-    }
-  });
-  const ctrStyles = [S.ctr, {
-    paddingHorizontal: tokens.spacing.paddingHorizontal,
-    paddingVertical: tokens.spacing.paddingVertical,
-    backgroundColor: rBg
-  }, containerStyle];
-  const cntStyles = [S.cnt, {
-    borderRadius: radius,
-    paddingHorizontal: tokens.spacing.contentPaddingHorizontal,
-    paddingVertical: tokens.spacing.contentPaddingVertical,
-    backgroundColor: tokens.colors.contentBackground
-  }];
-  const labelEl = !label ? null : (0, _validate.isText)(label) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-    style: {
-      marginRight: tokens.spacing.labelGap,
-      color: tokens.colors.label,
-      fontSize: tokens.typography.label,
-      fontWeight: tokens.typography.labelWeight
-    }
-  }, label) : /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: {
-      marginRight: tokens.spacing.labelGap
-    }
-  }, label);
-  const actEl = action ? /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [S.act, {
-      marginLeft: tokens.spacing.actionGap
-    }]
-  }, action) : !showAct ? null : customActTxt ? /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [S.act, {
-      marginLeft: tokens.spacing.actionGap
-    }]
-  }, actionText) : /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, _extends({
-    style: [S.act, {
-      marginLeft: tokens.spacing.actionGap,
-      opacity: cancelActPress.states.pressed ? tokens.opacity.actionPressed : 1
-    }]
-  }, cancelActPress.interactionProps), /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-    style: {
-      color: tokens.colors.action,
-      fontSize: tokens.typography.action,
-      fontWeight: tokens.typography.actionWeight
-    }
-  }, actionText ?? locale.cancel));
-  return /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: ctrStyles
-  }, /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: cntStyles
-  }, labelEl, /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: S.field
-  }, /*#__PURE__*/_react().default.createElement(_field.default, _extends({
-    ref: inputRef,
-    type: "search",
-    value: inputValue,
-    onChangeText: handleChange,
-    clearable: clearable,
-    clearTrigger: rClearTrigger,
-    leftIcon: rLeftIcon,
-    rightIcon: rightIcon,
-    center: !errorMessage,
-    errorMessage: errorMessage,
-    inputAlign: rInputAlign,
-    border: false,
-    style: [{
-      paddingHorizontal: tokens.spacing.none,
-      paddingVertical: tokens.spacing.none
-    }, fieldStyle],
-    contentStyle: [{
-      paddingVertical: tokens.spacing.none
-    }, fieldContentStyle],
-    inputStyle: [{
-      paddingVertical: tokens.spacing.none
-    }, inputStyle],
-    onSubmitEditing: handleSubmit,
-    returnKeyType: rReturnKey
-  }, restFieldProps)))), actEl);
-};
-const SearchForwardRef = /*#__PURE__*/_react().default.forwardRef(SearchComponent);
-SearchForwardRef.displayName = 'Search';
-const Search = exports.Search = /*#__PURE__*/_react().default.memo(SearchForwardRef);
-const S = _reactNative().StyleSheet.create({
-  ctr: {
-    flexDirection: 'row',
-    alignItems: 'center'
-  },
-  cnt: {
-    flex: 1,
-    flexDirection: 'row',
-    alignItems: 'center'
-  },
-  field: {
-    flex: 1
-  },
-  act: {
-    justifyContent: 'center'
-  }
-});
-var _default = exports.default = Search;
+"use strict";function _react(){const e=_interopRequireWildcard(require("react"));return _react=function(){return e},e}function _reactNative(){const e=require("react-native");return _reactNative=function(){return e},e}function _reactNativeSystemIcon(){const e=require("react-native-system-icon");return _reactNativeSystemIcon=function(){return e},e}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Search=void 0;var _hooks=require("../../hooks"),_validate=require("../../utils/validate"),_useLocale=require("../config-provider/useLocale"),_field=_interopRequireDefault(require("../field")),_tokens=require("./tokens");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,a=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,c,i={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return i;if(n=t?a:r){if(n.has(e))return n.get(e);n.set(e,i)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((c=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(c.get||c.set)?n(i,t,c):i[t]=e[t]);return i})(e,t)}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)({}).hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},_extends.apply(null,arguments)}const SearchComponent=(e,t)=>{const r=(0,_useLocale.useLocale)(),{tokensOverride:a,label:n,action:c,actionText:i,showAction:o=!1,shape:l,background:s,style:u,fieldStyle:d,fieldContentStyle:f,clearTrigger:p,clearable:_=!0,leftIcon:g,rightIcon:y,errorMessage:h,onSearch:b,onCancel:v,onChangeText:m,onSubmitEditing:x,returnKeyType:k,inputStyle:R,align:w,inputAlign:N,...V}=e,q=(0,_tokens.useSearchTokens)(a),E=l??q.defaults.shape,[C,P]=(0,_hooks.useControllableValue)(e,{defaultValue:""}),T=C??"",I=w??N,W=(0,_react().useRef)(m),z=(0,_react().useRef)(v),O=(0,_react().useRef)(b),M=(0,_react().useRef)(x),j=(0,_react().useRef)(T);W.current=m,z.current=v,O.current=b,M.current=x,j.current=T;const L=(0,_react().useCallback)(e=>{P(e),W.current?.(e)},[P]),D=(0,_react().useCallback)(()=>{L(""),z.current?.()},[L]),H=(0,_react().useCallback)(e=>{O.current?.(j.current),M.current?.(e)},[]),G=s??q.colors.background,A=g??_react().default.createElement(_reactNativeSystemIcon().Search,{size:q.icon.size,fill:q.colors.icon,color:q.colors.icon}),F=p??q.defaults.clearTrigger,K=k??"search",B=!!c||o,J=_react().default.isValidElement(i),Q=B&&!c&&!J,U="round"===E?q.radius.round:q.radius.square,X=(0,_react().useRef)(null);(0,_react().useImperativeHandle)(t,()=>({focus:()=>X.current?.focus(),blur:()=>X.current?.blur(),clear:()=>L("")}),[L]);const Y=(0,_hooks.useAriaPress)({disabled:!Q,onPress:D,extraProps:{accessibilityRole:"button",testID:"rnsu-search-action"}}),Z=[S.ctr,{paddingHorizontal:q.spacing.paddingHorizontal,paddingVertical:q.spacing.paddingVertical,backgroundColor:G},u],$=[S.cnt,{borderRadius:U,paddingHorizontal:q.spacing.contentPaddingHorizontal,paddingVertical:q.spacing.contentPaddingVertical,backgroundColor:q.colors.contentBackground}],ee=n?(0,_validate.isText)(n)?_react().default.createElement(_reactNative().Text,{style:{marginRight:q.spacing.labelGap,color:q.colors.label,fontSize:q.typography.label,fontWeight:q.typography.labelWeight}},n):_react().default.createElement(_reactNative().View,{style:{marginRight:q.spacing.labelGap}},n):null,te=c?_react().default.createElement(_reactNative().View,{style:[S.act,{marginLeft:q.spacing.actionGap}]},c):B?J?_react().default.createElement(_reactNative().View,{style:[S.act,{marginLeft:q.spacing.actionGap}]},i):_react().default.createElement(_reactNative().Pressable,_extends({style:[S.act,{marginLeft:q.spacing.actionGap,opacity:Y.states.pressed?q.opacity.actionPressed:1}]},Y.interactionProps),_react().default.createElement(_reactNative().Text,{style:{color:q.colors.action,fontSize:q.typography.action,fontWeight:q.typography.actionWeight}},i??r.cancel)):null;return _react().default.createElement(_reactNative().View,{style:Z},_react().default.createElement(_reactNative().View,{style:$},ee,_react().default.createElement(_reactNative().View,{style:S.field},_react().default.createElement(_field.default,_extends({ref:X,type:"search",value:T,onChangeText:L,clearable:_,clearTrigger:F,leftIcon:A,rightIcon:y,center:!h,errorMessage:h,inputAlign:I,border:!1,style:[{paddingHorizontal:q.spacing.none,paddingVertical:q.spacing.none},d],contentStyle:[{paddingVertical:q.spacing.none},f],inputStyle:[{paddingVertical:q.spacing.none},R],onSubmitEditing:H,returnKeyType:K},V)))),te)},SearchForwardRef=_react().default.forwardRef(SearchComponent);SearchForwardRef.displayName="Search";const Search=exports.Search=_react().default.memo(SearchForwardRef),S=_reactNative().StyleSheet.create({ctr:{flexDirection:"row",alignItems:"center"},cnt:{flex:1,flexDirection:"row",alignItems:"center"},field:{flex:1},act:{justifyContent:"center"}});var _default=exports.default=Search;

package/dist/cjs/components/search/index.js

@@ -1,15 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Search", {
-  enumerable: true,
-  get: function () {
-    return _Search.default;
-  }
-});
-exports.default = void 0;
-var _Search = _interopRequireDefault(require("./Search"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = _Search.default;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Search",{enumerable:!0,get:function(){return _Search.default}}),exports.default=void 0;var _Search=_interopRequireDefault(require("./Search"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=_Search.default;

package/dist/cjs/components/search/tokens.js

@@ -1,54 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useSearchTokens = void 0;
-var _designSystem = require("../../design-system");
-const createSearchTokens = foundations => {
-  const {
-    palette,
-    spacing,
-    radii,
-    fontSize
-  } = foundations;
-  return {
-    defaults: {
-      shape: 'square',
-      clearTrigger: 'focus'
-    },
-    colors: {
-      background: '#ffffff',
-      contentBackground: '#ffffff',
-      label: palette.default[600],
-      action: palette.primary[500],
-      icon: palette.default[400]
-    },
-    spacing: {
-      paddingHorizontal: spacing.md,
-      paddingVertical: spacing.sm,
-      labelGap: spacing.sm,
-      actionGap: spacing.sm,
-      contentPaddingHorizontal: spacing.sm,
-      contentPaddingVertical: spacing.xs,
-      none: spacing.none
-    },
-    radius: {
-      square: radii.md,
-      round: radii.pill
-    },
-    typography: {
-      label: fontSize.sm,
-      labelWeight: '500',
-      action: fontSize.sm,
-      actionWeight: '500'
-    },
-    opacity: {
-      actionPressed: 0.6
-    },
-    icon: {
-      size: fontSize.md
-    }
-  };
-};
-const useSearchTokens = exports.useSearchTokens = (0, _designSystem.createComponentTokensHook)('search', createSearchTokens);
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useSearchTokens=void 0;var _designSystem=require("../../design-system");const createSearchTokens=e=>{const{palette:a,spacing:n,radii:s,fontSize:o}=e;return{defaults:{shape:"square",clearTrigger:"focus"},colors:{background:"#ffffff",contentBackground:"#ffffff",label:a.default[600],action:a.primary[500],icon:a.default[400]},spacing:{paddingHorizontal:n.md,paddingVertical:n.sm,labelGap:n.sm,actionGap:n.sm,contentPaddingHorizontal:n.sm,contentPaddingVertical:n.xs,none:n.none},radius:{square:s.md,round:s.pill},typography:{label:o.sm,labelWeight:"500",action:o.sm,actionWeight:"500"},opacity:{actionPressed:.6},icon:{size:o.md}}},useSearchTokens=exports.useSearchTokens=(0,_designSystem.createComponentTokensHook)("search",createSearchTokens);

package/dist/cjs/components/selector/Selector.js

@@ -1,185 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Selector = void 0;
-function _react() {
-  const data = _interopRequireWildcard(require("react"));
-  _react = function () {
-    return data;
-  };
-  return data;
-}
-function _reactNative() {
-  const data = require("react-native");
-  _reactNative = function () {
-    return data;
-  };
-  return data;
-}
-var _tokens = require("./tokens");
-var _hooks = require("../../hooks");
-var _utils = require("../../utils");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-const CHECK_MARK = '✓';
-const CHECK_MARK_CORNER_HEIGHT = 8;
-const CHECK_MARK_CORNER_WIDTH = 10;
-const SelectorOptionItemImpl = ({
-  option,
-  active,
-  disabled,
-  multiple,
-  showCheckMark,
-  basis,
-  itemMargin,
-  tokens,
-  itemStyle,
-  labelStyle,
-  descriptionStyle,
-  onToggle
-}) => {
-  const labelContent = option.label;
-  const descriptionContent = option.description;
-  const hasDescription = descriptionContent != null;
-  const accessibilityLabel = (0, _utils.isText)(labelContent) ? String(labelContent) : String(option.value);
-  const accessibilityHint = (0, _utils.isText)(descriptionContent) ? String(descriptionContent) : undefined;
-  const {
-    interactionProps,
-    states
-  } = (0, _hooks.useAriaPress)({
-    disabled,
-    onPress: () => onToggle(option),
-    extraProps: {
-      accessibilityRole: multiple ? 'checkbox' : 'radio',
-      accessibilityLabel: accessibilityLabel,
-      accessibilityHint: accessibilityHint,
-      accessibilityState: multiple ? {
-        checked: active,
-        disabled
-      } : {
-        selected: active,
-        disabled
-      }
-    }
-  });
-  return /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, _extends({}, interactionProps, {
-    style: [tokens.layout.pressable, {
-      width: basis
-    }]
-  }), /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.item, {
-      marginHorizontal: itemMargin,
-      marginVertical: itemMargin,
-      paddingHorizontal: tokens.spacing.paddingHorizontal,
-      paddingVertical: tokens.spacing.paddingVertical,
-      borderRadius: tokens.radii.item,
-      borderColor: active ? tokens.colors.borderActive : tokens.colors.border,
-      backgroundColor: active ? tokens.colors.backgroundActive : tokens.colors.background,
-      opacity: disabled ? tokens.states.disabledOpacity : 1
-    }, states.pressed && {
-      opacity: 0.9
-    }, itemStyle]
-  }, (0, _utils.isText)(labelContent) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-    style: [tokens.layout.label, {
-      color: active ? tokens.colors.textActive : tokens.colors.text,
-      fontSize: tokens.typography.fontSize,
-      lineHeight: tokens.typography.fontSize * 1.4,
-      fontFamily: tokens.typography.fontFamily,
-      fontWeight: tokens.typography.fontWeight
-    }, labelStyle]
-  }, labelContent) : labelContent, hasDescription ? (0, _utils.isText)(descriptionContent) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-    style: [tokens.layout.description, {
-      marginTop: tokens.spacing.descriptionMarginTop,
-      color: disabled ? tokens.colors.disabledText : tokens.colors.description,
-      fontSize: tokens.typography.descriptionSize,
-      lineHeight: tokens.typography.descriptionSize * 1.4
-    }, descriptionStyle]
-  }, descriptionContent) : /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: {
-      marginTop: tokens.spacing.descriptionMarginTop
-    }
-  }, descriptionContent) : null, active && showCheckMark ? /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.checkMarkTriangle, {
-      borderTopWidth: CHECK_MARK_CORNER_HEIGHT,
-      borderBottomWidth: CHECK_MARK_CORNER_HEIGHT,
-      borderLeftWidth: CHECK_MARK_CORNER_WIDTH,
-      borderRightWidth: CHECK_MARK_CORNER_WIDTH,
-      borderBottomColor: tokens.colors.check,
-      borderRightColor: tokens.colors.check
-    }]
-  }), /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-    style: [tokens.layout.checkMark, {
-      color: tokens.colors.checkForeground
-    }]
-  }, CHECK_MARK)) : null));
-};
-const SelectorOptionItemMemo = /*#__PURE__*/_react().default.memo(SelectorOptionItemImpl);
-SelectorOptionItemMemo.displayName = 'SelectorOptionItem';
-const SelectorOptionItem = SelectorOptionItemMemo;
-const SelectorImpl = props => {
-  const {
-    tokensOverride,
-    options,
-    columns: colP,
-    multiple: multP,
-    showCheckMark: showChkP,
-    disabled: disP,
-    onChange,
-    itemStyle,
-    labelStyle,
-    descriptionStyle,
-    style,
-    ...rest
-  } = props;
-  const tokens = (0, _tokens.useSelectorTokens)(tokensOverride);
-  const columns = colP ?? tokens.defaults.columns ?? 1;
-  const multiple = multP ?? tokens.defaults.multiple;
-  const showCheckMark = showChkP ?? tokens.defaults.showCheckMark;
-  const disabled = Boolean(disP ?? tokens.defaults.disabled);
-  const [value = [], triggerChange] = (0, _hooks.useControllableValue)(props, {
-    defaultValue: []
-  });
-  const optionsByVal = (0, _react().useMemo)(() => {
-    const m = new Map();
-    for (const o of options) m.set(o.value, o);
-    return m;
-  }, [options]);
-  const rCols = Math.max(1, Math.floor(columns));
-  const basis = `${100 / rCols}%`;
-  const itemMargin = tokens.spacing.gap / 2;
-  const selectedSet = (0, _react().useMemo)(() => new Set(value), [value]);
-  const toggleOption = (0, _react().useCallback)(option => {
-    if (disabled || option.disabled) return;
-    const active = selectedSet.has(option.value);
-    const nextVal = multiple ? active ? value.filter(item => item !== option.value) : [...value, option.value] : active ? [] : [option.value];
-    triggerChange(nextVal, {
-      items: nextVal.map(v => optionsByVal.get(v)).filter(Boolean)
-    });
-  }, [disabled, multiple, optionsByVal, selectedSet, triggerChange, value]);
-  return /*#__PURE__*/_react().default.createElement(_reactNative().View, _extends({}, rest, {
-    style: [tokens.layout.container, {
-      marginHorizontal: -itemMargin,
-      marginVertical: -itemMargin
-    }, style],
-    accessibilityRole: multiple ? undefined : 'radiogroup'
-  }), options.map(option => /*#__PURE__*/_react().default.createElement(SelectorOptionItem, {
-    key: String(option.value),
-    option: option,
-    active: selectedSet.has(option.value),
-    disabled: disabled || Boolean(option.disabled),
-    multiple: multiple,
-    showCheckMark: showCheckMark,
-    basis: basis,
-    itemMargin: itemMargin,
-    tokens: tokens,
-    itemStyle: itemStyle,
-    labelStyle: labelStyle,
-    descriptionStyle: descriptionStyle,
-    onToggle: toggleOption
-  })));
-};
-const Selector = exports.Selector = /*#__PURE__*/_react().default.memo(SelectorImpl);
-Selector.displayName = 'Selector';
-var _default = exports.default = Selector;
+"use strict";function _react(){const e=_interopRequireWildcard(require("react"));return _react=function(){return e},e}function _reactNative(){const e=require("react-native");return _reactNative=function(){return e},e}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.Selector=void 0;var _tokens=require("./tokens"),_hooks=require("../../hooks"),_utils=require("../../utils");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,o=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var a,i,l={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return l;if(a=t?o:r){if(a.has(e))return a.get(e);a.set(e,l)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(a=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?a(l,t,i):l[t]=e[t]);return l})(e,t)}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)({}).hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e},_extends.apply(null,arguments)}const CHECK_MARK="✓",CHECK_MARK_CORNER_HEIGHT=8,CHECK_MARK_CORNER_WIDTH=10,SelectorOptionItemImpl=({option:e,active:t,disabled:r,multiple:o,showCheckMark:a,basis:i,itemMargin:l,tokens:n,itemStyle:c,labelStyle:s,descriptionStyle:d,onToggle:u})=>{const p=e.label,_=e.description,f=null!=_,m=(0,_utils.isText)(p)?String(p):String(e.value),y=(0,_utils.isText)(_)?String(_):void 0,{interactionProps:g,states:b}=(0,_hooks.useAriaPress)({disabled:r,onPress:()=>u(e),extraProps:{accessibilityRole:o?"checkbox":"radio",accessibilityLabel:m,accessibilityHint:y,accessibilityState:o?{checked:t,disabled:r}:{selected:t,disabled:r}}});return _react().default.createElement(_reactNative().Pressable,_extends({},g,{style:[n.layout.pressable,{width:i}]}),_react().default.createElement(_reactNative().View,{style:[n.layout.item,{marginHorizontal:l,marginVertical:l,paddingHorizontal:n.spacing.paddingHorizontal,paddingVertical:n.spacing.paddingVertical,borderRadius:n.radii.item,borderColor:t?n.colors.borderActive:n.colors.border,backgroundColor:t?n.colors.backgroundActive:n.colors.background,opacity:r?n.states.disabledOpacity:1},b.pressed&&{opacity:.9},c]},(0,_utils.isText)(p)?_react().default.createElement(_reactNative().Text,{style:[n.layout.label,{color:t?n.colors.textActive:n.colors.text,fontSize:n.typography.fontSize,lineHeight:1.4*n.typography.fontSize,fontFamily:n.typography.fontFamily,fontWeight:n.typography.fontWeight},s]},p):p,f?(0,_utils.isText)(_)?_react().default.createElement(_reactNative().Text,{style:[n.layout.description,{marginTop:n.spacing.descriptionMarginTop,color:r?n.colors.disabledText:n.colors.description,fontSize:n.typography.descriptionSize,lineHeight:1.4*n.typography.descriptionSize},d]},_):_react().default.createElement(_reactNative().View,{style:{marginTop:n.spacing.descriptionMarginTop}},_):null,t&&a?_react().default.createElement(_react().default.Fragment,null,_react().default.createElement(_reactNative().View,{style:[n.layout.checkMarkTriangle,{borderTopWidth:8,borderBottomWidth:8,borderLeftWidth:10,borderRightWidth:10,borderBottomColor:n.colors.check,borderRightColor:n.colors.check}]}),_react().default.createElement(_reactNative().Text,{style:[n.layout.checkMark,{color:n.colors.checkForeground}]},"✓")):null))},SelectorOptionItemMemo=_react().default.memo(SelectorOptionItemImpl);SelectorOptionItemMemo.displayName="SelectorOptionItem";const SelectorOptionItem=SelectorOptionItemMemo,SelectorImpl=e=>{const{tokensOverride:t,options:r,columns:o,multiple:a,showCheckMark:i,disabled:l,onChange:n,itemStyle:c,labelStyle:s,descriptionStyle:d,style:u,...p}=e,_=(0,_tokens.useSelectorTokens)(t),f=o??_.defaults.columns??1,m=a??_.defaults.multiple,y=i??_.defaults.showCheckMark,g=Boolean(l??_.defaults.disabled),[b=[],h]=(0,_hooks.useControllableValue)(e,{defaultValue:[]}),S=(0,_react().useMemo)(()=>{const e=new Map;for(const t of r)e.set(t.value,t);return e},[r]),k=100/Math.max(1,Math.floor(f))+"%",v=_.spacing.gap/2,M=(0,_react().useMemo)(()=>new Set(b),[b]),x=(0,_react().useCallback)(e=>{if(g||e.disabled)return;const t=M.has(e.value),r=m?t?b.filter(t=>t!==e.value):[...b,e.value]:t?[]:[e.value];h(r,{items:r.map(e=>S.get(e)).filter(Boolean)})},[g,m,S,M,h,b]);return _react().default.createElement(_reactNative().View,_extends({},p,{style:[_.layout.container,{marginHorizontal:-v,marginVertical:-v},u],accessibilityRole:m?void 0:"radiogroup"}),r.map(e=>_react().default.createElement(SelectorOptionItem,{key:String(e.value),option:e,active:M.has(e.value),disabled:g||Boolean(e.disabled),multiple:m,showCheckMark:y,basis:k,itemMargin:v,tokens:_,itemStyle:c,labelStyle:s,descriptionStyle:d,onToggle:x})))},Selector=exports.Selector=_react().default.memo(SelectorImpl);Selector.displayName="Selector";var _default=exports.default=Selector;

package/dist/cjs/components/selector/index.js

@@ -1,15 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Selector", {
-  enumerable: true,
-  get: function () {
-    return _Selector.default;
-  }
-});
-exports.default = void 0;
-var _Selector = _interopRequireDefault(require("./Selector"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = _Selector.default;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"Selector",{enumerable:!0,get:function(){return _Selector.default}}),exports.default=void 0;var _Selector=_interopRequireDefault(require("./Selector"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=_Selector.default;

package/dist/cjs/components/selector/tokens.js

@@ -1,100 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useSelectorTokens = void 0;
-function _reactNative() {
-  const data = require("react-native");
-  _reactNative = function () {
-    return data;
-  };
-  return data;
-}
-var _designSystem = require("../../design-system");
-const createSelectorTokens = ({
-  palette,
-  spacing,
-  radii,
-  typography,
-  fontSize
-}) => ({
-  defaults: {
-    columns: 3,
-    multiple: false,
-    showCheckMark: true,
-    disabled: false
-  },
-  layout: {
-    container: {
-      flexDirection: 'row',
-      flexWrap: 'wrap'
-    },
-    pressable: _reactNative().Platform.OS === 'web' ? {
-      outlineStyle: 'solid',
-      outlineWidth: 0
-    } : {},
-    item: {
-      flex: 1,
-      borderWidth: 0,
-      justifyContent: 'center',
-      alignItems: 'center',
-      overflow: 'hidden'
-    },
-    label: {
-      includeFontPadding: false,
-      textAlign: 'center'
-    },
-    description: {
-      includeFontPadding: false,
-      textAlign: 'center'
-    },
-    checkMark: {
-      position: 'absolute',
-      right: 1,
-      bottom: 1,
-      fontSize: 8,
-      includeFontPadding: false
-    },
-    checkMarkTriangle: {
-      position: 'absolute',
-      right: 0,
-      bottom: 0,
-      width: 0,
-      height: 0,
-      borderTopColor: 'transparent',
-      borderLeftColor: 'transparent'
-    }
-  },
-  colors: {
-    border: 'transparent',
-    borderActive: 'transparent',
-    background: '#ffffff',
-    backgroundActive: palette.primary[50],
-    text: palette.default[900],
-    textActive: palette.primary[600],
-    description: palette.default[500],
-    disabledText: palette.default[400],
-    check: palette.primary[600],
-    checkForeground: palette.primary.foreground ?? '#fff'
-  },
-  typography: {
-    fontSize: fontSize.md,
-    descriptionSize: fontSize.sm,
-    fontFamily: typography.fontFamily,
-    fontWeight: typography.weight.medium
-  },
-  radii: {
-    item: radii.xs
-  },
-  spacing: {
-    gap: spacing.sm,
-    paddingVertical: spacing.sm,
-    paddingHorizontal: spacing.lg,
-    descriptionMarginTop: spacing.xxs
-  },
-  states: {
-    disabledOpacity: 0.45
-  }
-});
-const useSelectorTokens = exports.useSelectorTokens = (0, _designSystem.createComponentTokensHook)('selector', createSelectorTokens);
+"use strict";function _reactNative(){const e=require("react-native");return _reactNative=function(){return e},e}Object.defineProperty(exports,"__esModule",{value:!0}),exports.useSelectorTokens=void 0;var _designSystem=require("../../design-system");const createSelectorTokens=({palette:e,spacing:t,radii:r,typography:o,fontSize:i})=>({defaults:{columns:3,multiple:!1,showCheckMark:!0,disabled:!1},layout:{container:{flexDirection:"row",flexWrap:"wrap"},pressable:"web"===_reactNative().Platform.OS?{outlineStyle:"solid",outlineWidth:0}:{},item:{flex:1,borderWidth:0,justifyContent:"center",alignItems:"center",overflow:"hidden"},label:{includeFontPadding:!1,textAlign:"center"},description:{includeFontPadding:!1,textAlign:"center"},checkMark:{position:"absolute",right:1,bottom:1,fontSize:8,includeFontPadding:!1},checkMarkTriangle:{position:"absolute",right:0,bottom:0,width:0,height:0,borderTopColor:"transparent",borderLeftColor:"transparent"}},colors:{border:"transparent",borderActive:"transparent",background:"#ffffff",backgroundActive:e.primary[50],text:e.default[900],textActive:e.primary[600],description:e.default[500],disabledText:e.default[400],check:e.primary[600],checkForeground:e.primary.foreground??"#fff"},typography:{fontSize:i.md,descriptionSize:i.sm,fontFamily:o.fontFamily,fontWeight:o.weight.medium},radii:{item:r.xs},spacing:{gap:t.sm,paddingVertical:t.sm,paddingHorizontal:t.lg,descriptionMarginTop:t.xxs},states:{disabledOpacity:.45}}),useSelectorTokens=exports.useSelectorTokens=(0,_designSystem.createComponentTokensHook)("selector",createSelectorTokens);