react-native-system-ui 1.0.5 → 1.0.6

package/README.md

@@ -1,10 +1,10 @@
 # react-native-system-ui
 
-面向 React Native 的高性能设计系统组件库。基于 Design Tokens 驱动主题体系，50+ 组件全量覆盖移动端场景；原生 StyleSheet 零运行时开销，单组件均值 **2.9 KB gzip**；iOS / Android / Web 三端同构，API 一致、行为对齐。
+面向 React Native 的高性能设计系统组件库。基于 Design Tokens 驱动主题体系，50+ 组件全量覆盖移动端场景；原生 StyleSheet 零运行时开销，单组件均值 **2.7 KB gzip**；iOS / Android / Web 三端同构，API 一致、行为对齐。
 
 ## 核心优势
 
-- **极致轻量**：全组件经过逐行精简——冗余 Hook 移除、StyleSheet 合并、计算内联、辅助函数提取；构建产物 esbuild 压缩；按需引入 + Tree Shaking，单组件平均 gzip 仅 **2.9 KB**，最小组件（SafeAreaView）仅 **0.6 KB**。
+- **极致轻量**：全组件经过逐行精简——冗余 Hook 移除、StyleSheet 合并、计算内联、辅助函数提取；构建产物 esbuild 压缩；按需引入 + Tree Shaking，单组件平均 gzip 仅 **2.7 KB**，最小组件（SafeAreaView）仅 **0.5 KB**。
 - **原生性能**：纯 StyleSheet 驱动，零 CSS-in-JS 运行时；动画基于原生 Animated / LayoutAnimation，无 JS 线程阻塞；列表类组件（Picker、Swiper、Tabs）基于 FlatList / ScrollView 原生滚动，确保 60fps 流畅交互。
 - **三端同构**：iOS / Android / Web 统一 API 与交互行为；Swiper、Picker 等核心组件在 Web 端自动适配桌面鼠标拖拽与移动端触控，无需业务层额外处理。
 - **设计系统**：Design Tokens + ThemeProvider 分层架构，组件自管 tokens；支持 light / dark / 品牌主题一键切换，样式定制不侵入组件实现。
@@ -151,29 +151,29 @@ enableNativeWind(cssInterop)
 
 ## 组件体积
 
-按需引入后单组件均值约 **2.9 KB**（各组件目录 gzip 相加估算）。支持 Tree Shaking，实际打包体积以构建结果为准。
+按需引入后单组件均值约 **2.7 KB**（各组件目录 gzip 相加估算，数据由 `pnpm run build && pnpm run docs:update-size` 生成）。支持 Tree Shaking，实际打包体积以构建结果为准。
 
 | 组件 | gzip | 组件 | gzip | 组件 | gzip |
 | --- | ---: | --- | ---: | --- | ---: |
-| picker | 6.6 KB | tabs | 6.4 KB | form | 5.6 KB |
-| dialog | 4.9 KB | cascader | 4.8 KB | field | 4.6 KB |
-| calendar | 4.4 KB | slider | 4.4 KB | number-keyboard | 4.1 KB |
-| toast | 4.1 KB | swiper | 4.0 KB | popup | 4.0 KB |
-| notify | 3.9 KB | checkbox | 3.8 KB | image-preview | 3.7 KB |
-| button | 3.7 KB | stepper | 3.7 KB | cell | 3.6 KB |
-| radio | 3.5 KB | grid | 3.4 KB | config-provider | 3.2 KB |
-| tabbar | 3.2 KB | notice-bar | 3.0 KB | collapse | 2.9 KB |
-| password-input | 2.9 KB | action-sheet | 2.8 KB | sidebar | 2.8 KB |
-| image | 2.8 KB | datetime-picker | 2.7 KB | share-sheet | 2.5 KB |
-| progress | 2.4 KB | selector | 2.3 KB | portal | 2.3 KB |
-| nav-bar | 2.3 KB | typography | 2.1 KB | circle | 2.1 KB |
-| search | 2.1 KB | skeleton | 2.0 KB | badge | 2.0 KB |
-| water-mark | 2.0 KB | tag | 2.0 KB | flex | 1.7 KB |
-| space | 1.7 KB | avatar | 1.6 KB | divider | 1.5 KB |
-| empty | 1.5 KB | input | 1.4 KB | area | 1.3 KB |
-| count-down | 1.2 KB | loading | 1.2 KB | switch | 1.1 KB |
-| overlay | 0.9 KB | error-boundary | 0.7 KB | safe-area-view | 0.6 KB |
+| picker | 6.3 KB | tabs | 6.2 KB | form | 4.7 KB |
+| dialog | 4.6 KB | cascader | 4.5 KB | field | 4.4 KB |
+| calendar | 4.2 KB | slider | 4.1 KB | number-keyboard | 4.0 KB |
+| toast | 3.9 KB | swiper | 3.9 KB | popup | 3.8 KB |
+| notify | 3.7 KB | image-preview | 3.6 KB | checkbox | 3.6 KB |
+| stepper | 3.6 KB | button | 3.6 KB | cell | 3.4 KB |
+| radio | 3.3 KB | grid | 3.2 KB | tabbar | 3.0 KB |
+| notice-bar | 2.9 KB | collapse | 2.8 KB | config-provider | 2.8 KB |
+| password-input | 2.8 KB | action-sheet | 2.8 KB | image | 2.7 KB |
+| sidebar | 2.6 KB | datetime-picker | 2.5 KB | share-sheet | 2.4 KB |
+| progress | 2.3 KB | selector | 2.2 KB | nav-bar | 2.2 KB |
+| portal | 2.1 KB | typography | 2.1 KB | circle | 2.0 KB |
+| search | 2.0 KB | skeleton | 1.9 KB | badge | 1.9 KB |
+| water-mark | 1.9 KB | tag | 1.8 KB | flex | 1.6 KB |
+| space | 1.6 KB | avatar | 1.5 KB | divider | 1.4 KB |
+| empty | 1.4 KB | input | 1.3 KB | area | 1.2 KB |
+| count-down | 1.1 KB | loading | 1.1 KB | switch | 1.0 KB |
+| overlay | 0.8 KB | error-boundary | 0.6 KB | safe-area-view | 0.5 KB |
 
 ## 版本与反馈
 
-当前为 v1.0.5，欢迎 issue / PR。
+当前为 v1.0.6，欢迎 issue / PR。

package/dist/cjs/components/flex/Flex.js

@@ -1 +1 @@
-"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.FlexContext=exports.Flex=void 0;var _tokens=require("./tokens");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,o,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)&&((o=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(o.get||o.set)?n(i,t,o):i[t]=e[t]);return i})(e,t)}const FlexContext=exports.FlexContext=_react().default.createContext({horizontalGap:0,verticalGap:0,columns:24}),alignMap={start:"flex-start",center:"center",end:"flex-end",baseline:"baseline",stretch:"stretch"},justifyMap={start:"flex-start",end:"flex-end",center:"center",around:"space-around",between:"space-between"},FlexImpl=e=>{const{tokensOverride:t,children:r,direction:a,wrap:n,gutter:o,align:i,justify:l,style:c,columns:u}=e,s=(0,_tokens.useFlexTokens)(t),f=a??s.defaults.direction,d=n??s.defaults.wrap,p=o??s.defaults.gutter,x=i??s.defaults.align,_=l??s.defaults.justify,m=Math.max(1,u??s.defaults.columns),[v,y]=Array.isArray(p)?p:[p,0],M=Math.max(0,v??0),g=Math.max(0,y??0),w="web"===_reactNative().Platform.OS,h=(0,_react().useMemo)(()=>({horizontalGap:M,verticalGap:g,columns:m}),[M,g,m]);return _react().default.createElement(FlexContext.Provider,{value:h},_react().default.createElement(_reactNative().View,{style:[s.layout.container,{flexDirection:f,flexWrap:d,alignItems:alignMap[x],justifyContent:justifyMap[_],marginHorizontal:!w&&M?-M/2:void 0,marginVertical:!w&&g?-g/2:void 0,columnGap:w?M:void 0,rowGap:w?g:void 0},c]},r))},Flex=exports.Flex=_react().default.memo(FlexImpl);
+"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.FlexContext=exports.Flex=void 0;var _tokens=require("./tokens");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,o,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)&&((o=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(o.get||o.set)?n(i,t,o):i[t]=e[t]);return i})(e,t)}const FlexContext=exports.FlexContext=_react().default.createContext({horizontalGap:0,verticalGap:0,columns:24}),alignMap={start:"flex-start",center:"center",end:"flex-end",baseline:"baseline",stretch:"stretch"},justifyMap={start:"flex-start",end:"flex-end",center:"center",around:"space-around",between:"space-between"},FlexImpl=e=>{const{tokensOverride:t,children:r,direction:a,wrap:n,gutter:o,align:i,justify:l,style:u,columns:c}=e,s=(0,_tokens.useFlexTokens)(t),f=a??s.defaults.direction,p=n??s.defaults.wrap,d=o??s.defaults.gutter,x=i??s.defaults.align,_=l??s.defaults.justify,y=Math.max(1,c??s.defaults.columns),[m,v]=Array.isArray(d)?d:[d,0],M=Math.max(0,m??0),g=Math.max(0,v??0),h=(0,_react().useMemo)(()=>({horizontalGap:M,verticalGap:g,columns:y}),[M,g,y]);return _react().default.createElement(FlexContext.Provider,{value:h},_react().default.createElement(_reactNative().View,{style:[s.layout.container,{flexDirection:f,flexWrap:p,alignItems:alignMap[x],justifyContent:justifyMap[_],columnGap:M||void 0,rowGap:g||void 0},u]},r))},Flex=exports.Flex=_react().default.memo(FlexImpl);

package/dist/cjs/components/flex/FlexItem.js

@@ -1 +1 @@
-"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.FlexItem=void 0;var _FlexContext=require("./FlexContext"),_utils=require("../../utils");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,i=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,l,u={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return u;if(n=t?i:r){if(n.has(e))return n.get(e);n.set(e,u)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((l=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(l.get||l.set)?n(u,t,l):u[t]=e[t]);return u})(e,t)}const parseFlex=e=>{if((0,_utils.isNumber)(e))return{flex:e};if(!e)return;const t=e.trim();if(!t)return;if("auto"===t)return{flexGrow:1,flexShrink:1,flexBasis:"auto"};if("none"===t)return{flexGrow:0,flexShrink:0,flexBasis:"auto"};const r=Number(t);if((0,_utils.isNumber)(r))return{flex:r};const i=t.split(/\s+/);if(i.length>=2){const[e,t]=i.map(Number);if((0,_utils.isNumber)(e)&&(0,_utils.isNumber)(t)){const r=i.slice(2).join(" ");let n;if("auto"===r)n="auto";else if(r){const e=r.match(/^(-?\d+(?:\.\d+)?)px$/),t=Number(e?e[1]:r);(0,_utils.isNumber)(t)&&(n=t)}return{flexGrow:e,flexShrink:t,flexBasis:n}}}},FlexItemImpl=({span:e,flex:t,style:r,children:i})=>{const{horizontalGap:n,verticalGap:l,columns:u}=(0,_react().useContext)(_FlexContext.FlexContext),a="web"===_reactNative().Platform.OS;if((0,_utils.isNumber)(e)&&e<=0)return null;const o={};if((0,_utils.isNumber)(e)){const t=Math.max(1,u),r=Math.min(Math.max(e,0),t)/t;o.width=100*r+"%",o.flexGrow=0,o.flexShrink=0}return _react().default.createElement(_reactNative().View,{style:[a?null:{paddingHorizontal:n/2,paddingVertical:l/2},o,parseFlex(t),r]},i)},FlexItem=exports.FlexItem=_react().default.memo(FlexItemImpl);FlexItem.displayName="FlexItem";
+"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.FlexItem=void 0;var _FlexContext=require("./FlexContext"),_utils=require("../../utils");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,i=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,u,l={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return l;if(n=t?i:r){if(n.has(e))return n.get(e);n.set(e,l)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((u=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(u.get||u.set)?n(l,t,u):l[t]=e[t]);return l})(e,t)}const parseFlex=e=>{if((0,_utils.isNumber)(e))return{flex:e};if(!e)return;const t=e.trim();if(!t)return;if("auto"===t)return{flexGrow:1,flexShrink:1,flexBasis:"auto"};if("none"===t)return{flexGrow:0,flexShrink:0,flexBasis:"auto"};const r=Number(t);if((0,_utils.isNumber)(r))return{flex:r};const i=t.split(/\s+/);if(i.length>=2){const[e,t]=i.map(Number);if((0,_utils.isNumber)(e)&&(0,_utils.isNumber)(t)){const r=i.slice(2).join(" ");let n;if("auto"===r)n="auto";else if(r){const e=r.match(/^(-?\d+(?:\.\d+)?)px$/),t=Number(e?e[1]:r);(0,_utils.isNumber)(t)&&(n=t)}return{flexGrow:e,flexShrink:t,flexBasis:n}}}},FlexItemImpl=({span:e,flex:t,style:r,children:i})=>{const{columns:n}=(0,_react().useContext)(_FlexContext.FlexContext);if((0,_utils.isNumber)(e)&&e<=0)return null;const u={};if((0,_utils.isNumber)(e)){const t=Math.max(1,n),r=Math.min(Math.max(e,0),t)/t;u.flexBasis=100*r+"%",u.flexGrow=0,u.flexShrink=1}return _react().default.createElement(_reactNative().View,{style:[u,parseFlex(t),r]},i)},FlexItem=exports.FlexItem=_react().default.memo(FlexItemImpl);FlexItem.displayName="FlexItem";

package/dist/cjs/components/grid/Grid.js

@@ -1 +1 @@
-"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.GridContext=exports.Grid=void 0;var _utils=require("../../utils"),_tokens=require("./tokens");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,n={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return n;if(a=t?o:r){if(a.has(e))return a.get(e);a.set(e,n)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(a=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?a(n,t,i):n[t]=e[t]);return n})(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 GridContext=exports.GridContext=_react().default.createContext(null),GridImpl=e=>{const{tokensOverride:t,children:r,columnNum:o,gutter:a,border:i,center:n,square:u,direction:l,reverse:c,clickable:s,iconSize:d,iconColor:f,style:_,...m}=e,p=(0,_tokens.useGridTokens)(t),b=(0,_react().useMemo)(()=>{const e=o??p.defaults.columnNum;return Number.isFinite(e)&&e>0?Math.floor(e):p.defaults.columnNum},[o,p.defaults.columnNum]),y=(0,_react().useMemo)(()=>{const e=a??p.defaults.gutter;return Number.isFinite(e)&&e>0?e:0},[a,p.defaults.gutter]),v=i??p.defaults.border,g=n??p.defaults.center,x=u??p.defaults.square,M=l??p.defaults.direction,N=c??p.defaults.reverse,k=s??p.defaults.clickable,G=(0,_react().useMemo)(()=>{const e=d??p.defaults.iconSize;return Number.isFinite(e)&&e>0?e:p.defaults.iconSize},[d,p.defaults.iconSize]),w=(0,_react().useMemo)(()=>_react().default.Children.toArray(r).filter(e=>_react().default.isValidElement(e)),[r]),h=v&&!y,O=p.colors.border,q=(0,_react().useMemo)(()=>h?_react().default.createElement(_reactNative().View,{style:[p.layout.border,p.layout.borderTop,(0,_utils.createHairlineView)({position:"top",color:O,left:0,right:0,top:0})]}):null,[O,h,p.layout.border,p.layout.borderTop]),C=(0,_react().useMemo)(()=>h?_react().default.createElement(_reactNative().View,{style:[p.layout.border,p.layout.borderBottom,(0,_utils.createHairlineView)({position:"bottom",color:O,left:0,right:0,bottom:0})]}):null,[O,h,p.layout.border,p.layout.borderBottom]),P=(0,_react().useMemo)(()=>({columnNum:b,gutter:y,border:v,center:g,square:x,direction:M,reverse:N,clickable:k,iconSize:G,iconColor:f,count:w.length,tokens:p}),[v,g,w.length,k,b,M,y,f,G,N,x,p]),S=(0,_react().useMemo)(()=>"web"===_reactNative().Platform.OS?{display:"grid",gridTemplateColumns:`repeat(${b}, minmax(0, 1fr))`,columnGap:y,rowGap:y}:void 0,[b,y]),j=(0,_react().useMemo)(()=>[p.layout.container,"web"===_reactNative().Platform.OS?S:y?{paddingLeft:y}:void 0,_],[y,_,p.layout.container,S]),E=(0,_react().useMemo)(()=>w.map((e,t)=>_react().default.cloneElement(e,{gridItemIndex:t,key:e.key??t})),[w]);return _react().default.createElement(GridContext.Provider,{value:P},_react().default.createElement(_reactNative().View,_extends({accessibilityRole:"grid",style:j},m),q,E,C))},Grid=exports.Grid=_react().default.memo(GridImpl);Grid.displayName="Grid";
+"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.GridContext=exports.Grid=void 0;var _utils=require("../../utils"),_tokens=require("./tokens");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 n,a,i={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return i;if(n=t?o:r){if(n.has(e))return n.get(e);n.set(e,i)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((a=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(a.get||a.set)?n(i,t,a):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 o in r)({}).hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e},_extends.apply(null,arguments)}const GridContext=exports.GridContext=_react().default.createContext(null),GridImpl=e=>{const{tokensOverride:t,children:r,columnNum:o,gutter:n,border:a,center:i,square:u,direction:l,reverse:c,clickable:s,iconSize:d,iconColor:f,style:_,onLayout:m,...p}=e,y=(0,_tokens.useGridTokens)(t),[b,v]=_react().default.useState(0),g=(0,_react().useMemo)(()=>{const e=o??y.defaults.columnNum;return Number.isFinite(e)&&e>0?Math.floor(e):y.defaults.columnNum},[o,y.defaults.columnNum]),k=(0,_react().useMemo)(()=>{const e=n??y.defaults.gutter;return Number.isFinite(e)&&e>0?e:0},[n,y.defaults.gutter]),x=a??y.defaults.border,G=i??y.defaults.center,M=u??y.defaults.square,N=l??y.defaults.direction,h=c??y.defaults.reverse,w=s??y.defaults.clickable,q=(0,_react().useMemo)(()=>{const e=d??y.defaults.iconSize;return Number.isFinite(e)&&e>0?e:y.defaults.iconSize},[d,y.defaults.iconSize]),C=(0,_react().useMemo)(()=>_react().default.Children.toArray(r).filter(e=>_react().default.isValidElement(e)),[r]),O=x&&!k,E=y.colors.border,W=(0,_react().useMemo)(()=>O?_react().default.createElement(_reactNative().View,{style:[y.layout.border,y.layout.borderTop,(0,_utils.createHairlineView)({position:"top",color:E,left:0,right:0,top:0})]}):null,[E,O,y.layout.border,y.layout.borderTop]),j=(0,_react().useMemo)(()=>O?_react().default.createElement(_reactNative().View,{style:[y.layout.border,y.layout.borderBottom,(0,_utils.createHairlineView)({position:"bottom",color:E,left:0,right:0,bottom:0})]}):null,[E,O,y.layout.border,y.layout.borderBottom]),P=(0,_react().useMemo)(()=>({columnNum:g,gutter:k,border:x,center:G,square:M,direction:N,reverse:h,clickable:w,iconSize:q,iconColor:f,count:C.length,containerWidth:b,tokens:y}),[x,G,C.length,w,g,b,N,k,f,q,h,M,y]),S=(0,_react().useMemo)(()=>C.map((e,t)=>_react().default.cloneElement(e,{gridItemIndex:t,key:e.key??t})),[C]),V=(0,_react().useCallback)(e=>{v(e.nativeEvent.layout.width),m?.(e)},[m]);return _react().default.createElement(GridContext.Provider,{value:P},_react().default.createElement(_reactNative().View,_extends({accessibilityRole:"grid",onLayout:V,style:[y.layout.container,k?{columnGap:k,rowGap:k}:void 0,_]},p),W,S,j))},Grid=exports.Grid=_react().default.memo(GridImpl);Grid.displayName="Grid";

package/dist/cjs/components/grid/GridItem.js

@@ -1 +1 @@
-"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.GridItem=void 0;var _designSystem=require("../../design-system"),_badge=_interopRequireDefault(require("../badge")),_utils=require("../../utils"),_GridContext=require("./GridContext");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,i=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,n,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(o=t?i:r){if(o.has(e))return o.get(e);o.set(e,a)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((n=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(n.get||n.set)?o(a,t,n):a[t]=e[t]);return a})(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 i in r)({}).hasOwnProperty.call(r,i)&&(e[i]=r[i])}return e},_extends.apply(null,arguments)}const GridItemImpl=e=>{const t=(0,_react().useContext)(_GridContext.GridContext);if(!t)throw new Error("GridItem must be used within Grid");const{gridItemIndex:r=0,text:i,icon:o,iconColor:n,badge:a,dot:l,contentStyle:c,textStyle:u,children:s,style:d,onPress:f,...p}=e,{tokens:y,columnNum:_,gutter:m,border:g,center:h,square:x,direction:b,reverse:v,clickable:w,iconSize:G,iconColor:N,count:O}=t,S=100/_+"%",q=(r+1)%_===0,R=Math.floor(r/_),W=Math.floor((O-1)/_),C=[y.layout.itemContentBase,"horizontal"===b?y.layout.itemHorizontal:y.layout.itemVertical,h&&y.layout.itemCenter,v?"horizontal"===b?y.layout.itemReverseRow:y.layout.itemReverseColumn:null,x?y.layout.itemContentSquare:null,{paddingHorizontal:y.spacing.paddingHorizontal,paddingVertical:y.spacing.paddingVertical,backgroundColor:y.colors.background},c],I=(0,_utils.isRenderable)(i),z=n??N??y.colors.text,P=(0,_react().useMemo)(()=>{if(s)return(0,_utils.isText)(s)?(0,_utils.renderTextOrNode)(s,[y.layout.text,{color:y.colors.text,fontSize:y.typography.fontSize,lineHeight:y.typography.lineHeight,fontFamily:y.typography.fontFamily,fontWeight:y.typography.fontWeight},u]):s;let e=null;if(o||a||l){const{style:t,...r}=a??{},i="vertical"===b?v?"marginTop":"marginBottom":v?"marginLeft":"marginRight",n=[y.layout.iconWrapper,I&&{[i]:y.spacing.iconGap}],c=(0,_utils.isFunction)(o)?o(G,z):o,u=_react().default.createElement(_reactNative().View,{style:n},c);e=a||l?_react().default.createElement(_badge.default,_extends({dot:l},r,{style:h?[t,{alignSelf:"center"}]:t}),u):u}const t=I&&((0,_utils.isText)(i)?_react().default.createElement(_designSystem.Text,{style:[y.layout.text,{color:y.colors.text,fontSize:y.typography.fontSize,lineHeight:y.typography.lineHeight,fontFamily:y.typography.fontFamily,fontWeight:y.typography.fontWeight},u],numberOfLines:y.defaults.textNumberOfLines},i):i);return _react().default.createElement(_react().default.Fragment,null,e,t)},[a,h,s,b,l,I,o,G,z,v,i,u,y.colors.text,y.defaults.textNumberOfLines,y.layout.iconWrapper,y.layout.text,y.spacing.iconGap,y.typography.fontFamily,y.typography.fontSize,y.typography.fontWeight,y.typography.lineHeight]),E=!g||m||q?null:_react().default.createElement(_reactNative().View,{style:[y.layout.itemBorderRight,(0,_utils.createHairlineView)({position:"right",color:y.colors.border,top:0,bottom:0,right:0})]}),H=g&&!m&&R<W?_react().default.createElement(_reactNative().View,{style:[y.layout.itemBorderBottom,(0,_utils.createHairlineView)({position:"bottom",color:y.colors.border,left:0,right:0,bottom:0})]}):null,V=_react().default.createElement(_reactNative().View,{style:C},P,E,H),M={width:"web"===_reactNative().Platform.OS?void 0:S,flexGrow:0,flexShrink:0,paddingRight:"web"===_reactNative().Platform.OS?void 0:m||void 0,marginTop:"web"===_reactNative().Platform.OS?void 0:m&&R>0?m:void 0};return w||(0,_utils.isFunction)(f)?_react().default.createElement(_reactNative().Pressable,_extends({accessibilityRole:"button",style:e=>[M,"function"==typeof d?d(e):d,{opacity:e.pressed?y.defaults.pressedOpacity:1}],android_ripple:{color:y.colors.active},onPress:f},p),V):_react().default.createElement(_reactNative().View,_extends({style:[M,"function"==typeof d?d({pressed:!1}):d]},p),V)},GridItem=exports.GridItem=_react().default.memo(GridItemImpl);GridItem.displayName="GridItem";
+"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.GridItem=void 0;var _designSystem=require("../../design-system"),_badge=_interopRequireDefault(require("../badge")),_utils=require("../../utils"),_GridContext=require("./GridContext");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,i=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,n,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(o=t?i:r){if(o.has(e))return o.get(e);o.set(e,a)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((n=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(n.get||n.set)?o(a,t,n):a[t]=e[t]);return a})(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 i in r)({}).hasOwnProperty.call(r,i)&&(e[i]=r[i])}return e},_extends.apply(null,arguments)}const GridItemImpl=e=>{const t=(0,_react().useContext)(_GridContext.GridContext);if(!t)throw new Error("GridItem must be used within Grid");const{gridItemIndex:r=0,text:i,icon:o,iconColor:n,badge:a,dot:l,contentStyle:c,textStyle:u,children:s,style:d,onPress:f,...p}=e,{tokens:y,columnNum:m,gutter:_,border:g,center:h,square:x,direction:b,reverse:v,clickable:w,iconSize:G,iconColor:W,count:S,containerWidth:q}=t,N=(r+1)%m===0,O=Math.floor(r/m),C=Math.floor((S-1)/m),I=[y.layout.itemContentBase,"horizontal"===b?y.layout.itemHorizontal:y.layout.itemVertical,h&&y.layout.itemCenter,v?"horizontal"===b?y.layout.itemReverseRow:y.layout.itemReverseColumn:null,x?y.layout.itemContentSquare:null,{paddingHorizontal:y.spacing.paddingHorizontal,paddingVertical:y.spacing.paddingVertical,backgroundColor:y.colors.background},c],R=(0,_utils.isRenderable)(i),z=n??W??y.colors.text,H=(0,_react().useMemo)(()=>{if(s)return(0,_utils.isText)(s)?(0,_utils.renderTextOrNode)(s,[y.layout.text,{color:y.colors.text,fontSize:y.typography.fontSize,lineHeight:y.typography.lineHeight,fontFamily:y.typography.fontFamily,fontWeight:y.typography.fontWeight},u]):s;let e=null;if(o||a||l){const{style:t,...r}=a??{},i="vertical"===b?v?"marginTop":"marginBottom":v?"marginLeft":"marginRight",n=[y.layout.iconWrapper,R&&{[i]:y.spacing.iconGap}],c=(0,_utils.isFunction)(o)?o(G,z):o,u=_react().default.createElement(_reactNative().View,{style:n},c);e=a||l?_react().default.createElement(_badge.default,_extends({dot:l},r,{style:h?[t,{alignSelf:"center"}]:t}),u):u}const t=R&&((0,_utils.isText)(i)?_react().default.createElement(_designSystem.Text,{style:[y.layout.text,{color:y.colors.text,fontSize:y.typography.fontSize,lineHeight:y.typography.lineHeight,fontFamily:y.typography.fontFamily,fontWeight:y.typography.fontWeight},u],numberOfLines:y.defaults.textNumberOfLines},i):i);return _react().default.createElement(_react().default.Fragment,null,e,t)},[a,h,s,b,l,R,o,G,z,v,i,u,y.colors.text,y.defaults.textNumberOfLines,y.layout.iconWrapper,y.layout.text,y.spacing.iconGap,y.typography.fontFamily,y.typography.fontSize,y.typography.fontWeight,y.typography.lineHeight]),E=!g||_||N?null:_react().default.createElement(_reactNative().View,{style:[y.layout.itemBorderRight,(0,_utils.createHairlineView)({position:"right",color:y.colors.border,top:0,bottom:0,right:0})]}),V=g&&!_&&O<C?_react().default.createElement(_reactNative().View,{style:[y.layout.itemBorderBottom,(0,_utils.createHairlineView)({position:"bottom",color:y.colors.border,left:0,right:0,bottom:0})]}):null,k=_react().default.createElement(_reactNative().View,{style:I},H,E,V),M=_>0&&q>0?{width:(q-(m-1)*_)/m,flexGrow:0,flexShrink:0}:{flexBasis:100/m+"%",flexGrow:0,flexShrink:1,minWidth:0,minHeight:0};return w||(0,_utils.isFunction)(f)?_react().default.createElement(_reactNative().Pressable,_extends({accessibilityRole:"button",style:e=>[M,"function"==typeof d?d(e):d,{opacity:e.pressed?y.defaults.pressedOpacity:1}],android_ripple:{color:y.colors.active},onPress:f},p),k):_react().default.createElement(_reactNative().View,_extends({style:[M,"function"==typeof d?d({pressed:!1}):d]},p),k)},GridItem=exports.GridItem=_react().default.memo(GridItemImpl);GridItem.displayName="GridItem";

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

@@ -1 +1 @@
-"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;
+"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 o=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var a,l,i={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return i;if(a=t?r:o){if(a.has(e))return a.get(e);a.set(e,i)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((l=(a=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(l.get||l.set)?a(i,t,l):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 o=arguments[t];for(var r in o)({}).hasOwnProperty.call(o,r)&&(e[r]=o[r])}return e},_extends.apply(null,arguments)}const CHECK_MARK="✓",CH=8,CW=10,SelectorOptionItemImpl=({option:e,active:t,disabled:o,multiple:r,showCheckMark:a,basis:l,containerWidth:i,columns:n,gap:c,tokens:s,itemStyle:u,labelStyle:d,descriptionStyle:p,onToggle:f})=>{const y=e.label,m=e.description,_=null!=m,g=(0,_utils.isText)(y)?String(y):String(e.value),b=(0,_utils.isText)(m)?String(m):void 0,{interactionProps:h,states:S}=(0,_hooks.useAriaPress)({disabled:o,onPress:()=>f(e),extraProps:{accessibilityRole:r?"checkbox":"radio",accessibilityLabel:g,accessibilityHint:b,accessibilityState:r?{checked:t,disabled:o}:{selected:t,disabled:o}}}),k=i>0?{width:(i-(n-1)*c)/n,flexGrow:0,flexShrink:0}:{flexBasis:l,flexShrink:1};return _react().default.createElement(_reactNative().Pressable,_extends({},h,{style:[s.layout.pressable,k]}),_react().default.createElement(_reactNative().View,{style:[s.layout.item,{paddingHorizontal:s.spacing.paddingHorizontal,paddingVertical:s.spacing.paddingVertical,borderRadius:s.radii.item,borderColor:t?s.colors.borderActive:s.colors.border,backgroundColor:t?s.colors.backgroundActive:s.colors.background,opacity:o?s.states.disabledOpacity:1},S.pressed&&{opacity:.9},u]},(0,_utils.isText)(y)?_react().default.createElement(_reactNative().Text,{style:[s.layout.label,{color:t?s.colors.textActive:s.colors.text,fontSize:s.typography.fontSize,lineHeight:1.4*s.typography.fontSize,fontFamily:s.typography.fontFamily,fontWeight:s.typography.fontWeight},d]},y):y,_?(0,_utils.isText)(m)?_react().default.createElement(_reactNative().Text,{style:[s.layout.description,{marginTop:s.spacing.descriptionMarginTop,color:o?s.colors.disabledText:s.colors.description,fontSize:s.typography.descriptionSize,lineHeight:1.4*s.typography.descriptionSize},p]},m):_react().default.createElement(_reactNative().View,{style:{marginTop:s.spacing.descriptionMarginTop}},m):null,t&&a?_react().default.createElement(_react().default.Fragment,null,_react().default.createElement(_reactNative().View,{style:[s.layout.checkMarkTriangle,{borderTopWidth:8,borderBottomWidth:8,borderLeftWidth:10,borderRightWidth:10,borderBottomColor:s.colors.check,borderRightColor:s.colors.check}]}),_react().default.createElement(_reactNative().Text,{style:[s.layout.checkMark,{color:s.colors.checkForeground}]},"✓")):null))},SelectorOptionItemMemo=_react().default.memo(SelectorOptionItemImpl);SelectorOptionItemMemo.displayName="SelectorOptionItem";const SelectorOptionItem=SelectorOptionItemMemo,SelectorImpl=e=>{const{tokensOverride:t,options:o,columns:r,multiple:a,showCheckMark:l,disabled:i,onChange:n,itemStyle:c,labelStyle:s,descriptionStyle:u,style:d,onLayout:p,...f}=e,y=(0,_tokens.useSelectorTokens)(t),[m,_]=_react().default.useState(0),g=r??y.defaults.columns??1,b=a??y.defaults.multiple,h=l??y.defaults.showCheckMark,S=Boolean(i??y.defaults.disabled),[k=[],v]=(0,_hooks.useControllableValue)(e,{defaultValue:[]}),x=(0,_react().useMemo)(()=>{const e=new Map;for(const t of o)e.set(t.value,t);return e},[o]),M=Math.max(1,Math.floor(g)),w=100/M+"%",O=y.spacing.gap,T=(0,_react().useMemo)(()=>new Set(k),[k]),C=(0,_react().useCallback)(e=>{if(S||e.disabled)return;const t=T.has(e.value),o=b?t?k.filter(t=>t!==e.value):[...k,e.value]:t?[]:[e.value];v(o,{items:o.map(e=>x.get(e)).filter(Boolean)})},[S,b,x,T,v,k]),W=(0,_react().useCallback)(e=>{_(e.nativeEvent.layout.width),p?.(e)},[p]);return _react().default.createElement(_reactNative().View,_extends({},f,{onLayout:W,style:[y.layout.container,{columnGap:O,rowGap:O},d],accessibilityRole:b?void 0:"radiogroup"}),o.map(e=>_react().default.createElement(SelectorOptionItem,{key:String(e.value),option:e,active:T.has(e.value),disabled:S||Boolean(e.disabled),multiple:b,showCheckMark:h,basis:w,containerWidth:m,columns:M,gap:O,tokens:y,itemStyle:c,labelStyle:s,descriptionStyle:u,onToggle:C})))},Selector=exports.Selector=_react().default.memo(SelectorImpl);Selector.displayName="Selector";var _default=exports.default=Selector;

package/dist/es/components/flex/Flex.js

@@ -1 +1 @@
-import React,{useMemo}from"react";import{Platform,View}from"react-native";import{useFlexTokens}from"./tokens";export const FlexContext=React.createContext({horizontalGap:0,verticalGap:0,columns:24});const alignMap={start:"flex-start",center:"center",end:"flex-end",baseline:"baseline",stretch:"stretch"},justifyMap={start:"flex-start",end:"flex-end",center:"center",around:"space-around",between:"space-between"},FlexImpl=e=>{const{tokensOverride:t,children:a,direction:r,wrap:n,gutter:o,align:l,justify:i,style:s,columns:c}=e,m=useFlexTokens(t),u=r??m.defaults.direction,f=n??m.defaults.wrap,p=o??m.defaults.gutter,d=l??m.defaults.align,x=i??m.defaults.justify,v=Math.max(1,c??m.defaults.columns),[y,g]=Array.isArray(p)?p:[p,0],M=Math.max(0,y??0),h=Math.max(0,g??0),w="web"===Platform.OS,F=useMemo(()=>({horizontalGap:M,verticalGap:h,columns:v}),[M,h,v]);return React.createElement(FlexContext.Provider,{value:F},React.createElement(View,{style:[m.layout.container,{flexDirection:u,flexWrap:f,alignItems:alignMap[d],justifyContent:justifyMap[x],marginHorizontal:!w&&M?-M/2:void 0,marginVertical:!w&&h?-h/2:void 0,columnGap:w?M:void 0,rowGap:w?h:void 0},s]},a))};export const Flex=React.memo(FlexImpl);
+import React,{useMemo}from"react";import{View}from"react-native";import{useFlexTokens}from"./tokens";export const FlexContext=React.createContext({horizontalGap:0,verticalGap:0,columns:24});const alignMap={start:"flex-start",center:"center",end:"flex-end",baseline:"baseline",stretch:"stretch"},justifyMap={start:"flex-start",end:"flex-end",center:"center",around:"space-around",between:"space-between"},FlexImpl=e=>{const{tokensOverride:t,children:a,direction:r,wrap:n,gutter:l,align:o,justify:s,style:i,columns:c}=e,u=useFlexTokens(t),m=r??u.defaults.direction,p=n??u.defaults.wrap,x=l??u.defaults.gutter,f=o??u.defaults.align,d=s??u.defaults.justify,y=Math.max(1,c??u.defaults.columns),[M,h]=Array.isArray(x)?x:[x,0],v=Math.max(0,M??0),g=Math.max(0,h??0),w=useMemo(()=>({horizontalGap:v,verticalGap:g,columns:y}),[v,g,y]);return React.createElement(FlexContext.Provider,{value:w},React.createElement(View,{style:[u.layout.container,{flexDirection:m,flexWrap:p,alignItems:alignMap[f],justifyContent:justifyMap[d],columnGap:v||void 0,rowGap:g||void 0},i]},a))};export const Flex=React.memo(FlexImpl);

package/dist/es/components/flex/FlexItem.js

@@ -1 +1 @@
-import React,{useContext}from"react";import{Platform,View}from"react-native";import{FlexContext}from"./FlexContext";import{isNumber}from"../../utils";const parseFlex=e=>{if(isNumber(e))return{flex:e};if(!e)return;const t=e.trim();if(!t)return;if("auto"===t)return{flexGrow:1,flexShrink:1,flexBasis:"auto"};if("none"===t)return{flexGrow:0,flexShrink:0,flexBasis:"auto"};const r=Number(t);if(isNumber(r))return{flex:r};const i=t.split(/\s+/);if(i.length>=2){const[e,t]=i.map(Number);if(isNumber(e)&&isNumber(t)){const r=i.slice(2).join(" ");let l;if("auto"===r)l="auto";else if(r){const e=r.match(/^(-?\d+(?:\.\d+)?)px$/),t=Number(e?e[1]:r);isNumber(t)&&(l=t)}return{flexGrow:e,flexShrink:t,flexBasis:l}}}},FlexItemImpl=({span:e,flex:t,style:r,children:i})=>{const{horizontalGap:l,verticalGap:n,columns:o}=useContext(FlexContext),m="web"===Platform.OS;if(isNumber(e)&&e<=0)return null;const s={};if(isNumber(e)){const t=Math.max(1,o),r=Math.min(Math.max(e,0),t)/t;s.width=100*r+"%",s.flexGrow=0,s.flexShrink=0}return React.createElement(View,{style:[m?null:{paddingHorizontal:l/2,paddingVertical:n/2},s,parseFlex(t),r]},i)};export const FlexItem=React.memo(FlexItemImpl);FlexItem.displayName="FlexItem";
+import React,{useContext}from"react";import{View}from"react-native";import{FlexContext}from"./FlexContext";import{isNumber}from"../../utils";const parseFlex=e=>{if(isNumber(e))return{flex:e};if(!e)return;const t=e.trim();if(!t)return;if("auto"===t)return{flexGrow:1,flexShrink:1,flexBasis:"auto"};if("none"===t)return{flexGrow:0,flexShrink:0,flexBasis:"auto"};const r=Number(t);if(isNumber(r))return{flex:r};const i=t.split(/\s+/);if(i.length>=2){const[e,t]=i.map(Number);if(isNumber(e)&&isNumber(t)){const r=i.slice(2).join(" ");let l;if("auto"===r)l="auto";else if(r){const e=r.match(/^(-?\d+(?:\.\d+)?)px$/),t=Number(e?e[1]:r);isNumber(t)&&(l=t)}return{flexGrow:e,flexShrink:t,flexBasis:l}}}},FlexItemImpl=({span:e,flex:t,style:r,children:i})=>{const{columns:l}=useContext(FlexContext);if(isNumber(e)&&e<=0)return null;const s={};if(isNumber(e)){const t=Math.max(1,l),r=Math.min(Math.max(e,0),t)/t;s.flexBasis=100*r+"%",s.flexGrow=0,s.flexShrink=1}return React.createElement(View,{style:[s,parseFlex(t),r]},i)};export const FlexItem=React.memo(FlexItemImpl);FlexItem.displayName="FlexItem";

package/dist/es/components/grid/Grid.js

@@ -1 +1 @@
-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)}import React,{useMemo}from"react";import{Platform,View}from"react-native";import{createHairlineView}from"../../utils";import{useGridTokens}from"./tokens";export const GridContext=React.createContext(null);const GridImpl=e=>{const{tokensOverride:t,children:r,columnNum:o,gutter:i,border:l,center:n,square:a,direction:u,reverse:s,clickable:c,iconSize:d,iconColor:m,style:f,...b}=e,p=useGridTokens(t),y=useMemo(()=>{const e=o??p.defaults.columnNum;return Number.isFinite(e)&&e>0?Math.floor(e):p.defaults.columnNum},[o,p.defaults.columnNum]),g=useMemo(()=>{const e=i??p.defaults.gutter;return Number.isFinite(e)&&e>0?e:0},[i,p.defaults.gutter]),v=l??p.defaults.border,M=n??p.defaults.center,w=a??p.defaults.square,x=u??p.defaults.direction,G=s??p.defaults.reverse,R=c??p.defaults.clickable,k=useMemo(()=>{const e=d??p.defaults.iconSize;return Number.isFinite(e)&&e>0?e:p.defaults.iconSize},[d,p.defaults.iconSize]),h=useMemo(()=>React.Children.toArray(r).filter(e=>React.isValidElement(e)),[r]),N=v&&!g,V=p.colors.border,C=useMemo(()=>N?React.createElement(View,{style:[p.layout.border,p.layout.borderTop,createHairlineView({position:"top",color:V,left:0,right:0,top:0})]}):null,[V,N,p.layout.border,p.layout.borderTop]),S=useMemo(()=>N?React.createElement(View,{style:[p.layout.border,p.layout.borderBottom,createHairlineView({position:"bottom",color:V,left:0,right:0,bottom:0})]}):null,[V,N,p.layout.border,p.layout.borderBottom]),E=useMemo(()=>({columnNum:y,gutter:g,border:v,center:M,square:w,direction:x,reverse:G,clickable:R,iconSize:k,iconColor:m,count:h.length,tokens:p}),[v,M,h.length,R,y,x,g,m,k,G,w,p]),O=useMemo(()=>"web"===Platform.OS?{display:"grid",gridTemplateColumns:`repeat(${y}, minmax(0, 1fr))`,columnGap:g,rowGap:g}:void 0,[y,g]),z=useMemo(()=>[p.layout.container,"web"===Platform.OS?O:g?{paddingLeft:g}:void 0,f],[g,f,p.layout.container,O]),P=useMemo(()=>h.map((e,t)=>React.cloneElement(e,{gridItemIndex:t,key:e.key??t})),[h]);return React.createElement(GridContext.Provider,{value:E},React.createElement(View,_extends({accessibilityRole:"grid",style:z},b),C,P,S))};export const Grid=React.memo(GridImpl);Grid.displayName="Grid";
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var r in o)({}).hasOwnProperty.call(o,r)&&(e[r]=o[r])}return e},_extends.apply(null,arguments)}import React,{useCallback,useMemo}from"react";import{View}from"react-native";import{createHairlineView}from"../../utils";import{useGridTokens}from"./tokens";export const GridContext=React.createContext(null);const GridImpl=e=>{const{tokensOverride:t,children:o,columnNum:r,gutter:i,border:n,center:l,square:a,direction:u,reverse:c,clickable:s,iconSize:d,iconColor:m,style:b,onLayout:f,...y}=e,p=useGridTokens(t),[g,v]=React.useState(0),k=useMemo(()=>{const e=r??p.defaults.columnNum;return Number.isFinite(e)&&e>0?Math.floor(e):p.defaults.columnNum},[r,p.defaults.columnNum]),R=useMemo(()=>{const e=i??p.defaults.gutter;return Number.isFinite(e)&&e>0?e:0},[i,p.defaults.gutter]),h=n??p.defaults.border,G=l??p.defaults.center,w=a??p.defaults.square,x=u??p.defaults.direction,M=c??p.defaults.reverse,N=s??p.defaults.clickable,C=useMemo(()=>{const e=d??p.defaults.iconSize;return Number.isFinite(e)&&e>0?e:p.defaults.iconSize},[d,p.defaults.iconSize]),V=useMemo(()=>React.Children.toArray(o).filter(e=>React.isValidElement(e)),[o]),E=h&&!R,S=p.colors.border,z=useMemo(()=>E?React.createElement(View,{style:[p.layout.border,p.layout.borderTop,createHairlineView({position:"top",color:S,left:0,right:0,top:0})]}):null,[S,E,p.layout.border,p.layout.borderTop]),I=useMemo(()=>E?React.createElement(View,{style:[p.layout.border,p.layout.borderBottom,createHairlineView({position:"bottom",color:S,left:0,right:0,bottom:0})]}):null,[S,E,p.layout.border,p.layout.borderBottom]),O=useMemo(()=>({columnNum:k,gutter:R,border:h,center:G,square:w,direction:x,reverse:M,clickable:N,iconSize:C,iconColor:m,count:V.length,containerWidth:g,tokens:p}),[h,G,V.length,N,k,g,x,R,m,C,M,w,p]),T=useMemo(()=>V.map((e,t)=>React.cloneElement(e,{gridItemIndex:t,key:e.key??t})),[V]),_=useCallback(e=>{v(e.nativeEvent.layout.width),f?.(e)},[f]);return React.createElement(GridContext.Provider,{value:O},React.createElement(View,_extends({accessibilityRole:"grid",onLayout:_,style:[p.layout.container,R?{columnGap:R,rowGap:R}:void 0,b]},y),z,T,I))};export const Grid=React.memo(GridImpl);Grid.displayName="Grid";

package/dist/es/components/grid/GridItem.js

@@ -1 +1 @@
-function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var r in o)({}).hasOwnProperty.call(o,r)&&(e[r]=o[r])}return e},_extends.apply(null,arguments)}import React,{useContext,useMemo}from"react";import{Platform,Pressable,View}from"react-native";import{Text}from"../../design-system";import Badge from"../badge";import{createHairlineView,isFunction,isRenderable,isText,renderTextOrNode}from"../../utils";import{GridContext}from"./GridContext";const GridItemImpl=e=>{const t=useContext(GridContext);if(!t)throw new Error("GridItem must be used within Grid");const{gridItemIndex:o=0,text:r,icon:i,iconColor:n,badge:a,dot:l,contentStyle:s,textStyle:c,children:m,style:d,onPress:p,...y}=e,{tokens:g,columnNum:u,gutter:f,border:h,center:x,square:b,direction:R,reverse:w,clickable:v,iconSize:S,iconColor:G,count:C}=t,O=100/u+"%",V=(o+1)%u===0,z=Math.floor(o/u),H=Math.floor((C-1)/u),E=[g.layout.itemContentBase,"horizontal"===R?g.layout.itemHorizontal:g.layout.itemVertical,x&&g.layout.itemCenter,w?"horizontal"===R?g.layout.itemReverseRow:g.layout.itemReverseColumn:null,b?g.layout.itemContentSquare:null,{paddingHorizontal:g.spacing.paddingHorizontal,paddingVertical:g.spacing.paddingVertical,backgroundColor:g.colors.background},s],I=isRenderable(r),F=n??G??g.colors.text,P=useMemo(()=>{if(m)return isText(m)?renderTextOrNode(m,[g.layout.text,{color:g.colors.text,fontSize:g.typography.fontSize,lineHeight:g.typography.lineHeight,fontFamily:g.typography.fontFamily,fontWeight:g.typography.fontWeight},c]):m;let e=null;if(i||a||l){const{style:t,...o}=a??{},r="vertical"===R?w?"marginTop":"marginBottom":w?"marginLeft":"marginRight",n=[g.layout.iconWrapper,I&&{[r]:g.spacing.iconGap}],s=isFunction(i)?i(S,F):i,c=React.createElement(View,{style:n},s);e=a||l?React.createElement(Badge,_extends({dot:l},o,{style:x?[t,{alignSelf:"center"}]:t}),c):c}const t=I&&(isText(r)?React.createElement(Text,{style:[g.layout.text,{color:g.colors.text,fontSize:g.typography.fontSize,lineHeight:g.typography.lineHeight,fontFamily:g.typography.fontFamily,fontWeight:g.typography.fontWeight},c],numberOfLines:g.defaults.textNumberOfLines},r):r);return React.createElement(React.Fragment,null,e,t)},[a,x,m,R,l,I,i,S,F,w,r,c,g.colors.text,g.defaults.textNumberOfLines,g.layout.iconWrapper,g.layout.text,g.spacing.iconGap,g.typography.fontFamily,g.typography.fontSize,g.typography.fontWeight,g.typography.lineHeight]),T=!h||f||V?null:React.createElement(View,{style:[g.layout.itemBorderRight,createHairlineView({position:"right",color:g.colors.border,top:0,bottom:0,right:0})]}),B=h&&!f&&z<H?React.createElement(View,{style:[g.layout.itemBorderBottom,createHairlineView({position:"bottom",color:g.colors.border,left:0,right:0,bottom:0})]}):null,W=React.createElement(View,{style:E},P,T,B),_={width:"web"===Platform.OS?void 0:O,flexGrow:0,flexShrink:0,paddingRight:"web"===Platform.OS?void 0:f||void 0,marginTop:"web"===Platform.OS?void 0:f&&z>0?f:void 0};return v||isFunction(p)?React.createElement(Pressable,_extends({accessibilityRole:"button",style:e=>[_,"function"==typeof d?d(e):d,{opacity:e.pressed?g.defaults.pressedOpacity:1}],android_ripple:{color:g.colors.active},onPress:p},y),W):React.createElement(View,_extends({style:[_,"function"==typeof d?d({pressed:!1}):d]},y),W)};export const GridItem=React.memo(GridItemImpl);GridItem.displayName="GridItem";
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var r in o)({}).hasOwnProperty.call(o,r)&&(e[r]=o[r])}return e},_extends.apply(null,arguments)}import React,{useContext,useMemo}from"react";import{Pressable,View}from"react-native";import{Text}from"../../design-system";import Badge from"../badge";import{createHairlineView,isFunction,isRenderable,isText,renderTextOrNode}from"../../utils";import{GridContext}from"./GridContext";const GridItemImpl=e=>{const t=useContext(GridContext);if(!t)throw new Error("GridItem must be used within Grid");const{gridItemIndex:o=0,text:r,icon:i,iconColor:n,badge:a,dot:l,contentStyle:s,textStyle:c,children:m,style:p,onPress:y,...d}=e,{tokens:u,columnNum:g,gutter:f,border:h,center:x,square:b,direction:R,reverse:w,clickable:G,iconSize:C,iconColor:H,count:S,containerWidth:V}=t,z=(o+1)%g===0,E=Math.floor(o/g),I=Math.floor((S-1)/g),v=[u.layout.itemContentBase,"horizontal"===R?u.layout.itemHorizontal:u.layout.itemVertical,x&&u.layout.itemCenter,w?"horizontal"===R?u.layout.itemReverseRow:u.layout.itemReverseColumn:null,b?u.layout.itemContentSquare:null,{paddingHorizontal:u.spacing.paddingHorizontal,paddingVertical:u.spacing.paddingVertical,backgroundColor:u.colors.background},s],F=isRenderable(r),O=n??H??u.colors.text,W=useMemo(()=>{if(m)return isText(m)?renderTextOrNode(m,[u.layout.text,{color:u.colors.text,fontSize:u.typography.fontSize,lineHeight:u.typography.lineHeight,fontFamily:u.typography.fontFamily,fontWeight:u.typography.fontWeight},c]):m;let e=null;if(i||a||l){const{style:t,...o}=a??{},r="vertical"===R?w?"marginTop":"marginBottom":w?"marginLeft":"marginRight",n=[u.layout.iconWrapper,F&&{[r]:u.spacing.iconGap}],s=isFunction(i)?i(C,O):i,c=React.createElement(View,{style:n},s);e=a||l?React.createElement(Badge,_extends({dot:l},o,{style:x?[t,{alignSelf:"center"}]:t}),c):c}const t=F&&(isText(r)?React.createElement(Text,{style:[u.layout.text,{color:u.colors.text,fontSize:u.typography.fontSize,lineHeight:u.typography.lineHeight,fontFamily:u.typography.fontFamily,fontWeight:u.typography.fontWeight},c],numberOfLines:u.defaults.textNumberOfLines},r):r);return React.createElement(React.Fragment,null,e,t)},[a,x,m,R,l,F,i,C,O,w,r,c,u.colors.text,u.defaults.textNumberOfLines,u.layout.iconWrapper,u.layout.text,u.spacing.iconGap,u.typography.fontFamily,u.typography.fontSize,u.typography.fontWeight,u.typography.lineHeight]),B=!h||f||z?null:React.createElement(View,{style:[u.layout.itemBorderRight,createHairlineView({position:"right",color:u.colors.border,top:0,bottom:0,right:0})]}),T=h&&!f&&E<I?React.createElement(View,{style:[u.layout.itemBorderBottom,createHairlineView({position:"bottom",color:u.colors.border,left:0,right:0,bottom:0})]}):null,_=React.createElement(View,{style:v},W,B,T),k=f>0&&V>0?{width:(V-(g-1)*f)/g,flexGrow:0,flexShrink:0}:{flexBasis:100/g+"%",flexGrow:0,flexShrink:1,minWidth:0,minHeight:0};return G||isFunction(y)?React.createElement(Pressable,_extends({accessibilityRole:"button",style:e=>[k,"function"==typeof p?p(e):p,{opacity:e.pressed?u.defaults.pressedOpacity:1}],android_ripple:{color:u.colors.active},onPress:y},d),_):React.createElement(View,_extends({style:[k,"function"==typeof p?p({pressed:!1}):p]},d),_)};export const GridItem=React.memo(GridItemImpl);GridItem.displayName="GridItem";

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

@@ -1 +1 @@
-function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var l in o)({}).hasOwnProperty.call(o,l)&&(e[l]=o[l])}return e},_extends.apply(null,arguments)}import React,{useCallback,useMemo}from"react";import{Pressable,Text,View}from"react-native";import{useSelectorTokens}from"./tokens";import{useAriaPress,useControllableValue}from"../../hooks";import{isText}from"../../utils";const CHECK_MARK="✓",CHECK_MARK_CORNER_HEIGHT=8,CHECK_MARK_CORNER_WIDTH=10,SelectorOptionItemImpl=({option:e,active:t,disabled:o,multiple:l,showCheckMark:i,basis:r,itemMargin:a,tokens:s,itemStyle:c,labelStyle:n,descriptionStyle:d,onToggle:p})=>{const m=e.label,u=e.description,g=null!=u,y=isText(m)?String(m):String(e.value),b=isText(u)?String(u):void 0,{interactionProps:h,states:S}=useAriaPress({disabled:o,onPress:()=>p(e),extraProps:{accessibilityRole:l?"checkbox":"radio",accessibilityLabel:y,accessibilityHint:b,accessibilityState:l?{checked:t,disabled:o}:{selected:t,disabled:o}}});return React.createElement(Pressable,_extends({},h,{style:[s.layout.pressable,{width:r}]}),React.createElement(View,{style:[s.layout.item,{marginHorizontal:a,marginVertical:a,paddingHorizontal:s.spacing.paddingHorizontal,paddingVertical:s.spacing.paddingVertical,borderRadius:s.radii.item,borderColor:t?s.colors.borderActive:s.colors.border,backgroundColor:t?s.colors.backgroundActive:s.colors.background,opacity:o?s.states.disabledOpacity:1},S.pressed&&{opacity:.9},c]},isText(m)?React.createElement(Text,{style:[s.layout.label,{color:t?s.colors.textActive:s.colors.text,fontSize:s.typography.fontSize,lineHeight:1.4*s.typography.fontSize,fontFamily:s.typography.fontFamily,fontWeight:s.typography.fontWeight},n]},m):m,g?isText(u)?React.createElement(Text,{style:[s.layout.description,{marginTop:s.spacing.descriptionMarginTop,color:o?s.colors.disabledText:s.colors.description,fontSize:s.typography.descriptionSize,lineHeight:1.4*s.typography.descriptionSize},d]},u):React.createElement(View,{style:{marginTop:s.spacing.descriptionMarginTop}},u):null,t&&i?React.createElement(React.Fragment,null,React.createElement(View,{style:[s.layout.checkMarkTriangle,{borderTopWidth:8,borderBottomWidth:8,borderLeftWidth:10,borderRightWidth:10,borderBottomColor:s.colors.check,borderRightColor:s.colors.check}]}),React.createElement(Text,{style:[s.layout.checkMark,{color:s.colors.checkForeground}]},"✓")):null))},SelectorOptionItemMemo=React.memo(SelectorOptionItemImpl);SelectorOptionItemMemo.displayName="SelectorOptionItem";const SelectorOptionItem=SelectorOptionItemMemo,SelectorImpl=e=>{const{tokensOverride:t,options:o,columns:l,multiple:i,showCheckMark:r,disabled:a,onChange:s,itemStyle:c,labelStyle:n,descriptionStyle:d,style:p,...m}=e,u=useSelectorTokens(t),g=l??u.defaults.columns??1,y=i??u.defaults.multiple,b=r??u.defaults.showCheckMark,h=Boolean(a??u.defaults.disabled),[S=[],f]=useControllableValue(e,{defaultValue:[]}),k=useMemo(()=>{const e=new Map;for(const t of o)e.set(t.value,t);return e},[o]),R=100/Math.max(1,Math.floor(g))+"%",x=u.spacing.gap/2,M=useMemo(()=>new Set(S),[S]),T=useCallback(e=>{if(h||e.disabled)return;const t=M.has(e.value),o=y?t?S.filter(t=>t!==e.value):[...S,e.value]:t?[]:[e.value];f(o,{items:o.map(e=>k.get(e)).filter(Boolean)})},[h,y,k,M,f,S]);return React.createElement(View,_extends({},m,{style:[u.layout.container,{marginHorizontal:-x,marginVertical:-x},p],accessibilityRole:y?void 0:"radiogroup"}),o.map(e=>React.createElement(SelectorOptionItem,{key:String(e.value),option:e,active:M.has(e.value),disabled:h||Boolean(e.disabled),multiple:y,showCheckMark:b,basis:R,itemMargin:x,tokens:u,itemStyle:c,labelStyle:n,descriptionStyle:d,onToggle:T})))};export const Selector=React.memo(SelectorImpl);Selector.displayName="Selector";export default Selector;
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var l in o)({}).hasOwnProperty.call(o,l)&&(e[l]=o[l])}return e},_extends.apply(null,arguments)}import React,{useCallback,useMemo}from"react";import{Pressable,Text,View}from"react-native";import{useSelectorTokens}from"./tokens";import{useAriaPress,useControllableValue}from"../../hooks";import{isText}from"../../utils";const CHECK_MARK="✓",CH=8,CW=10,SelectorOptionItemImpl=({option:e,active:t,disabled:o,multiple:l,showCheckMark:a,basis:i,containerWidth:r,columns:s,gap:c,tokens:n,itemStyle:d,labelStyle:p,descriptionStyle:m,onToggle:u})=>{const y=e.label,b=e.description,g=null!=b,h=isText(y)?String(y):String(e.value),S=isText(b)?String(b):void 0,{interactionProps:f,states:k}=useAriaPress({disabled:o,onPress:()=>u(e),extraProps:{accessibilityRole:l?"checkbox":"radio",accessibilityLabel:h,accessibilityHint:S,accessibilityState:l?{checked:t,disabled:o}:{selected:t,disabled:o}}}),x=r>0?{width:(r-(s-1)*c)/s,flexGrow:0,flexShrink:0}:{flexBasis:i,flexShrink:1};return React.createElement(Pressable,_extends({},f,{style:[n.layout.pressable,x]}),React.createElement(View,{style:[n.layout.item,{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:o?n.states.disabledOpacity:1},k.pressed&&{opacity:.9},d]},isText(y)?React.createElement(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},p]},y):y,g?isText(b)?React.createElement(Text,{style:[n.layout.description,{marginTop:n.spacing.descriptionMarginTop,color:o?n.colors.disabledText:n.colors.description,fontSize:n.typography.descriptionSize,lineHeight:1.4*n.typography.descriptionSize},m]},b):React.createElement(View,{style:{marginTop:n.spacing.descriptionMarginTop}},b):null,t&&a?React.createElement(React.Fragment,null,React.createElement(View,{style:[n.layout.checkMarkTriangle,{borderTopWidth:8,borderBottomWidth:8,borderLeftWidth:10,borderRightWidth:10,borderBottomColor:n.colors.check,borderRightColor:n.colors.check}]}),React.createElement(Text,{style:[n.layout.checkMark,{color:n.colors.checkForeground}]},"✓")):null))},SelectorOptionItemMemo=React.memo(SelectorOptionItemImpl);SelectorOptionItemMemo.displayName="SelectorOptionItem";const SelectorOptionItem=SelectorOptionItemMemo,SelectorImpl=e=>{const{tokensOverride:t,options:o,columns:l,multiple:a,showCheckMark:i,disabled:r,onChange:s,itemStyle:c,labelStyle:n,descriptionStyle:d,style:p,onLayout:m,...u}=e,y=useSelectorTokens(t),[b,g]=React.useState(0),h=l??y.defaults.columns??1,S=a??y.defaults.multiple,f=i??y.defaults.showCheckMark,k=Boolean(r??y.defaults.disabled),[x=[],v]=useControllableValue(e,{defaultValue:[]}),R=useMemo(()=>{const e=new Map;for(const t of o)e.set(t.value,t);return e},[o]),T=Math.max(1,Math.floor(h)),C=100/T+"%",M=y.spacing.gap,w=useMemo(()=>new Set(x),[x]),O=useCallback(e=>{if(k||e.disabled)return;const t=w.has(e.value),o=S?t?x.filter(t=>t!==e.value):[...x,e.value]:t?[]:[e.value];v(o,{items:o.map(e=>R.get(e)).filter(Boolean)})},[k,S,R,w,v,x]),E=useCallback(e=>{g(e.nativeEvent.layout.width),m?.(e)},[m]);return React.createElement(View,_extends({},u,{onLayout:E,style:[y.layout.container,{columnGap:M,rowGap:M},p],accessibilityRole:S?void 0:"radiogroup"}),o.map(e=>React.createElement(SelectorOptionItem,{key:String(e.value),option:e,active:w.has(e.value),disabled:k||Boolean(e.disabled),multiple:S,showCheckMark:f,basis:C,containerWidth:b,columns:T,gap:M,tokens:y,itemStyle:c,labelStyle:n,descriptionStyle:d,onToggle:O})))};export const Selector=React.memo(SelectorImpl);Selector.displayName="Selector";export default Selector;

package/dist/types/components/grid/Grid.d.ts

@@ -12,6 +12,7 @@ export interface GridContextValue {
     iconSize: number;
     iconColor?: string;
     count: number;
+    containerWidth: number;
     tokens: GridTokens;
 }
 export declare const GridContext: React.Context<GridContextValue | null>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-system-ui",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "面向 React Native 的设计系统级组件库，Tokens + ThemeProvider 主题体系，按需引入、体积小；API 统一可组合、高效可靠，支持可访问性与多端一致。",
   "homepage": "https://rn-system-ui.netlify.app/",
   "main": "./dist/cjs/index.js",