react-native-system-ui 1.0.2 → 1.0.4

package/dist/cjs/components/cascader/useCascaderExtend.js

@@ -1,39 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useCascaderExtend = void 0;
-const getDepth = (options, childrenKey) => {
-  let max = 1;
-  const traverse = (opts, level) => {
-    if (!opts?.length) return;
-    if (level > max) max = level;
-    opts.forEach(o => {
-      const has = Object.prototype.hasOwnProperty.call(o, childrenKey);
-      if (has && level + 1 > max) max = level + 1;
-      const ch = o[childrenKey];
-      if (ch?.length) traverse(ch, level + 1);
-    });
-  };
-  traverse(options, 1);
-  return max;
-};
-const useCascaderExtend = (options = [], keys, value) => {
-  const depth = getDepth(options, keys.childrenKey);
-  const tabs = !value?.length ? [options] : value.reduce((acc, val, i) => {
-    if (val == null) return acc;
-    const cur = acc[i];
-    if (!cur) return acc;
-    const ch = cur.find(o => o[keys.valueKey] === value[i])?.[keys.childrenKey];
-    if (ch) acc.push(ch);
-    return acc;
-  }, [options]);
-  const items = !value?.length ? [] : value.map((val, i) => tabs[i]?.find(o => o[keys.valueKey] === val));
-  return {
-    tabs,
-    items,
-    depth
-  };
-};
-exports.useCascaderExtend = useCascaderExtend;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.useCascaderExtend=void 0;const getDepth=(e,t)=>{let r=1;const n=(e,s)=>{e?.length&&(s>r&&(r=s),e.forEach(e=>{Object.prototype.hasOwnProperty.call(e,t)&&s+1>r&&(r=s+1);const c=e[t];c?.length&&n(c,s+1)}))};return n(e,1),r},useCascaderExtend=(e=[],t,r)=>{const n=getDepth(e,t.childrenKey),s=r?.length?r.reduce((e,n,s)=>{if(null==n)return e;const c=e[s];if(!c)return e;const d=c.find(e=>e[t.valueKey]===r[s])?.[t.childrenKey];return d&&e.push(d),e},[e]):[e],c=r?.length?r.map((e,r)=>s[r]?.find(r=>r[t.valueKey]===e)):[];return{tabs:s,items:c,depth:n}};exports.useCascaderExtend=useCascaderExtend;

package/dist/cjs/components/cell/Cell.js

@@ -1,181 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Cell = 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 _utils = require("../../utils");
-var _useDirection = require("../config-provider/useDirection");
-var _CellContext = require("./CellContext");
-var _tokens = require("./tokens");
-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 CellImpl = (props, ref) => {
-  const {
-    title,
-    value,
-    label,
-    extra,
-    icon,
-    rightIcon,
-    border: borderP,
-    clickable,
-    isLink,
-    required,
-    center,
-    size: sizeP,
-    arrowDirection: arrP,
-    tokensOverride,
-    children,
-    style,
-    titleStyle,
-    valueStyle,
-    labelStyle,
-    contentStyle,
-    onPress,
-    disabled,
-    android_ripple,
-    ...rest
-  } = props;
-  const tokens = (0, _tokens.useCellTokens)(tokensOverride);
-  const dir = (0, _useDirection.useDirection)();
-  const grp = (0, _react().useContext)(_CellContext.CellGroupContext);
-  const border = borderP ?? tokens.defaults.border;
-  const size = sizeP ?? tokens.defaults.size;
-  const arrRaw = arrP ?? tokens.defaults.arrowDirection;
-  const arr = dir === 'rtl' ? arrRaw === 'left' ? 'right' : arrRaw === 'right' ? 'left' : arrRaw : arrRaw;
-  const lh = tokens.typography.lineHeight;
-  const hasT = (0, _utils.isRenderable)(title);
-  const hasV = (0, _utils.isRenderable)(value);
-  const hasL = (0, _utils.isRenderable)(label);
-  const hasE = (0, _utils.isRenderable)(extra);
-  const hasCh = (0, _utils.isRenderable)(children);
-  const hasI = (0, _utils.isRenderable)(icon);
-  const hasRI = (0, _utils.isRenderable)(rightIcon);
-  const onlyV = !hasT && !hasCh;
-  const showB = border && grp.border && !grp.isLast;
-  const showArr = !!isLink || !!clickable;
-  const inter = !disabled && (clickable || !!onPress || !!rest.onLongPress || !!rest.onPressIn || !!rest.onPressOut);
-  const large = size === 'large';
-  const ctrStyle = (0, _react().useMemo)(() => [large ? tokens.layout.containerLarge : tokens.layout.container, center && tokens.layout.center, style], [size, center, tokens.layout, style]);
-  const hair = (0, _hooks.useHairline)({
-    show: showB,
-    containerStyle: ctrStyle,
-    color: tokens.colors.border,
-    width: tokens.borders.width,
-    defaultPaddingHorizontal: tokens.sizing.paddingHorizontal
-  });
-  const cntStyle = (0, _react().useMemo)(() => [tokens.layout.customContent, {
-    justifyContent: center ? 'center' : 'flex-start'
-  }, contentStyle], [center, tokens.layout.customContent, contentStyle]);
-  const {
-    interactionProps,
-    states
-  } = (0, _hooks.useAriaPress)({
-    disabled: !inter,
-    onPress: onPress ?? undefined
-  });
-  const Comp = inter ? _reactNative().Pressable : _reactNative().View;
-  const compProps = inter ? {
-    android_ripple: android_ripple ?? {
-      color: tokens.colors.ripple
-    },
-    accessibilityRole: 'button',
-    ...interactionProps
-  } : {};
-  return /*#__PURE__*/_react().default.createElement(Comp, _extends({
-    ref: ref,
-    style: [ctrStyle, inter && states.pressed && {
-      opacity: tokens.defaults.activeOpacity
-    }]
-  }, compProps, rest), hasI && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.iconWrapper, {
-      marginRight: tokens.spacing.iconGap,
-      minHeight: tokens.sizing.iconSize,
-      minWidth: tokens.sizing.iconSize
-    }]
-  }, icon), /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: tokens.layout.body
-  }, (hasT || required) && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.titleRow, {
-      minHeight: lh
-    }]
-  }, required && /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-    style: {
-      color: tokens.colors.required,
-      marginRight: tokens.spacing.iconGap / 2
-    }
-  }, "*"), hasT && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: titleStyle
-  }, (0, _utils.renderTextOrNode)(title, [{
-    color: tokens.colors.title,
-    fontSize: large ? tokens.typography.largeTitleSize : tokens.typography.titleSize,
-    fontWeight: tokens.typography.titleWeight
-  }, titleStyle], {
-    numberOfLines: 1
-  }))), hasL && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [{
-      marginTop: tokens.spacing.labelMarginTop
-    }, labelStyle]
-  }, (0, _utils.renderTextOrNode)(label, [{
-    color: tokens.colors.label,
-    fontSize: large ? tokens.typography.largeLabelSize : tokens.typography.labelSize
-  }, labelStyle], {
-    numberOfLines: 2
-  }))), /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.valueContainer, {
-      minHeight: lh,
-      marginLeft: tokens.spacing.valueGap
-    }, !center && onlyV && tokens.layout.valueOnlyContainer, center && tokens.layout.valueCenter]
-  }, hasV ? /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: cntStyle
-  }, (0, _utils.renderTextOrNode)(value, [tokens.layout.value, onlyV && tokens.layout.valueOnly, {
-    color: tokens.colors.value,
-    fontSize: large ? tokens.typography.largeValueSize : tokens.typography.valueSize
-  }, valueStyle], {
-    numberOfLines: 1
-  })) : hasCh && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: cntStyle
-  }, (0, _utils.isText)(children) ? (0, _utils.renderTextOrNode)(children, [tokens.layout.value, {
-    color: tokens.colors.value,
-    fontSize: large ? tokens.typography.largeValueSize : tokens.typography.valueSize
-  }, valueStyle]) : children)), hasE && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: {
-      marginLeft: tokens.spacing.extraGap
-    }
-  }, (0, _utils.renderTextOrNode)(extra, {
-    marginLeft: tokens.spacing.extraGap,
-    color: tokens.colors.value,
-    fontSize: large ? tokens.typography.largeValueSize : tokens.typography.valueSize
-  })), hasRI ? rightIcon : showArr && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.rightIconWrapper, tokens.layout.arrowTransforms[arr]]
-  }, /*#__PURE__*/_react().default.createElement(_reactNativeSystemIcon().Arrow, {
-    size: tokens.sizing.arrowSize,
-    fill: tokens.colors.arrow
-  })), hair);
-};
-const CellForwardRef = /*#__PURE__*/_react().default.forwardRef(CellImpl);
-CellForwardRef.displayName = 'Cell';
-const Cell = exports.Cell = /*#__PURE__*/_react().default.memo(CellForwardRef);
+"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.Cell=void 0;var _hooks=require("../../hooks"),_utils=require("../../utils"),_useDirection=require("../config-provider/useDirection"),_CellContext=require("./CellContext"),_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 i,l,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(i=t?a:r){if(i.has(e))return i.get(e);i.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((l=(i=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(l.get||l.set)?i(o,t,l):o[t]=e[t]);return o})(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 CellImpl=(e,t)=>{const{title:r,value:a,label:i,extra:l,icon:o,rightIcon:n,border:s,clickable:c,isLink:u,required:d,center:y,size:p,arrowDirection:_,tokensOverride:f,children:g,style:v,titleStyle:m,valueStyle:h,labelStyle:b,contentStyle:w,onPress:z,disabled:S,android_ripple:C,...N}=e,x=(0,_tokens.useCellTokens)(f),O=(0,_useDirection.useDirection)(),R=(0,_react().useContext)(_CellContext.CellGroupContext),k=s??x.defaults.border,P=p??x.defaults.size,V=_??x.defaults.arrowDirection,q="rtl"===O?"left"===V?"right":"right"===V?"left":V:V,E=x.typography.lineHeight,T=(0,_utils.isRenderable)(r),L=(0,_utils.isRenderable)(a),W=(0,_utils.isRenderable)(i),I=(0,_utils.isRenderable)(l),M=(0,_utils.isRenderable)(g),j=(0,_utils.isRenderable)(o),D=(0,_utils.isRenderable)(n),H=!T&&!M,G=k&&R.border&&!R.isLast,F=!!u||!!c,A=!S&&(c||!!z||!!N.onLongPress||!!N.onPressIn||!!N.onPressOut),B="large"===P,J=(0,_react().useMemo)(()=>[B?x.layout.containerLarge:x.layout.container,y&&x.layout.center,v],[P,y,x.layout,v]),K=(0,_hooks.useHairline)({show:G,containerStyle:J,color:x.colors.border,width:x.borders.width,defaultPaddingHorizontal:x.sizing.paddingHorizontal}),Q=(0,_react().useMemo)(()=>[x.layout.customContent,{justifyContent:y?"center":"flex-start"},w],[y,x.layout.customContent,w]),{interactionProps:U,states:X}=(0,_hooks.useAriaPress)({disabled:!A,onPress:z??void 0}),Y=A?_reactNative().Pressable:_reactNative().View,Z=A?{android_ripple:C??{color:x.colors.ripple},accessibilityRole:"button",...U}:{};return _react().default.createElement(Y,_extends({ref:t,style:[J,A&&X.pressed&&{opacity:x.defaults.activeOpacity}]},Z,N),j&&_react().default.createElement(_reactNative().View,{style:[x.layout.iconWrapper,{marginRight:x.spacing.iconGap,minHeight:x.sizing.iconSize,minWidth:x.sizing.iconSize}]},o),_react().default.createElement(_reactNative().View,{style:x.layout.body},(T||d)&&_react().default.createElement(_reactNative().View,{style:[x.layout.titleRow,{minHeight:E}]},d&&_react().default.createElement(_reactNative().Text,{style:{color:x.colors.required,marginRight:x.spacing.iconGap/2}},"*"),T&&_react().default.createElement(_reactNative().View,{style:m},(0,_utils.renderTextOrNode)(r,[{color:x.colors.title,fontSize:B?x.typography.largeTitleSize:x.typography.titleSize,fontWeight:x.typography.titleWeight},m],{numberOfLines:1}))),W&&_react().default.createElement(_reactNative().View,{style:[{marginTop:x.spacing.labelMarginTop},b]},(0,_utils.renderTextOrNode)(i,[{color:x.colors.label,fontSize:B?x.typography.largeLabelSize:x.typography.labelSize},b],{numberOfLines:2}))),_react().default.createElement(_reactNative().View,{style:[x.layout.valueContainer,{minHeight:E,marginLeft:x.spacing.valueGap},!y&&H&&x.layout.valueOnlyContainer,y&&x.layout.valueCenter]},L?_react().default.createElement(_reactNative().View,{style:Q},(0,_utils.renderTextOrNode)(a,[x.layout.value,H&&x.layout.valueOnly,{color:x.colors.value,fontSize:B?x.typography.largeValueSize:x.typography.valueSize},h],{numberOfLines:1})):M&&_react().default.createElement(_reactNative().View,{style:Q},(0,_utils.isText)(g)?(0,_utils.renderTextOrNode)(g,[x.layout.value,{color:x.colors.value,fontSize:B?x.typography.largeValueSize:x.typography.valueSize},h]):g)),I&&_react().default.createElement(_reactNative().View,{style:{marginLeft:x.spacing.extraGap}},(0,_utils.renderTextOrNode)(l,{marginLeft:x.spacing.extraGap,color:x.colors.value,fontSize:B?x.typography.largeValueSize:x.typography.valueSize})),D?n:F&&_react().default.createElement(_reactNative().View,{style:[x.layout.rightIconWrapper,x.layout.arrowTransforms[q]]},_react().default.createElement(_reactNativeSystemIcon().Arrow,{size:x.sizing.arrowSize,fill:x.colors.arrow})),K)},CellForwardRef=_react().default.forwardRef(CellImpl);CellForwardRef.displayName="Cell";const Cell=exports.Cell=_react().default.memo(CellForwardRef);

package/dist/cjs/components/cell/CellContext.js

@@ -1,19 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CellGroupContext = void 0;
-function _react() {
-  const data = _interopRequireDefault(require("react"));
-  _react = function () {
-    return data;
-  };
-  return data;
-}
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const CellGroupContext = exports.CellGroupContext = /*#__PURE__*/_react().default.createContext({
-  border: true,
-  inset: false,
-  isLast: false
-});
+"use strict";function _react(){const e=_interopRequireDefault(require("react"));return _react=function(){return e},e}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(exports,"__esModule",{value:!0}),exports.CellGroupContext=void 0;const CellGroupContext=exports.CellGroupContext=_react().default.createContext({border:!0,inset:!1,isLast:!1});

package/dist/cjs/components/cell/CellGroup.js

@@ -1,100 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CellGroup = 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 _utils = require("../../utils");
-var _Cell = require("./Cell");
-var _CellContext = require("./CellContext");
-var _tokens = require("./tokens");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-const isCellElement = child => {
-  if (! /*#__PURE__*/_react().default.isValidElement(child)) return false;
-  if (child.type === _Cell.Cell) return true;
-  return child.type.displayName === 'Cell';
-};
-const CellGroup = exports.CellGroup = /*#__PURE__*/_react().default.memo(({
-  children,
-  title,
-  border,
-  inset,
-  card,
-  style,
-  bodyStyle,
-  tokensOverride
-}) => {
-  const tokens = (0, _tokens.useCellTokens)(tokensOverride);
-  const rBorder = border ?? tokens.defaults.groupBorder;
-  const showInset = (inset ?? tokens.defaults.groupInset) || (card ?? tokens.defaults.groupCard);
-  const rCard = card ?? tokens.defaults.groupCard;
-  const showOuter = rBorder && !showInset;
-  const chArr = (0, _react().useMemo)(() => _react().default.Children.toArray(children), [children]);
-  const lastIdx = (0, _react().useMemo)(() => {
-    for (let i = chArr.length - 1; i >= 0; i--) {
-      if (isCellElement(chArr[i])) return i;
-    }
-    ;
-    return -1;
-  }, [chArr]);
-  const ctrStyle = (0, _react().useMemo)(() => [{
-    marginBottom: rCard ? 0 : tokens.sizing.groupMarginBottom
-  }, style], [rCard, style, tokens.sizing.groupMarginBottom]);
-  const insStyle = (0, _react().useMemo)(() => ({
-    overflow: 'hidden',
-    borderRadius: tokens.radii.groupInset,
-    marginHorizontal: tokens.sizing.groupInsetMarginHorizontal,
-    backgroundColor: tokens.colors.background
-  }), [tokens.colors.background, tokens.radii.groupInset, tokens.sizing.groupInsetMarginHorizontal]);
-  const bodyStyleArr = [{
-    backgroundColor: tokens.colors.groupBodyBackground
-  }, showInset ? insStyle : null, rCard ? tokens.layout.groupCardShadow : null, bodyStyle];
-  const rTitle = (0, _react().useMemo)(() => title ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-    style: {
-      color: tokens.colors.groupTitle,
-      fontSize: tokens.typography.groupTitleSize,
-      paddingHorizontal: tokens.sizing.groupTitlePaddingHorizontal,
-      paddingVertical: tokens.sizing.groupTitlePaddingVertical
-    }
-  }, title) : null, [title, tokens.colors.groupTitle, tokens.sizing.groupTitlePaddingHorizontal, tokens.sizing.groupTitlePaddingVertical, tokens.typography.groupTitleSize]);
-  const rCh = (0, _react().useMemo)(() => chArr.map((ch, i) => {
-    const key = /*#__PURE__*/_react().default.isValidElement(ch) && ch.key != null ? ch.key : i;
-    return /*#__PURE__*/_react().default.createElement(_CellContext.CellGroupContext.Provider, {
-      key: key,
-      value: {
-        border: rBorder,
-        inset: showInset,
-        isLast: isCellElement(ch) ? i === lastIdx : false
-      }
-    }, ch);
-  }), [chArr, lastIdx, rBorder, showInset]);
-  return /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: ctrStyle
-  }, rTitle, /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: bodyStyleArr
-  }, rCh, showOuter ? /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, ['top', 'bottom'].map(pos => /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    key: pos,
-    style: (0, _utils.createHairlineView)({
-      position: pos,
-      color: tokens.colors.border,
-      left: 0,
-      right: 0,
-      enabled: tokens.borders.width > 0,
-      width: tokens.borders.width
-    })
-  }))) : null));
-});
+"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.CellGroup=void 0;var _utils=require("../../utils"),_Cell=require("./Cell"),_CellContext=require("./CellContext"),_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 l,i,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(l=t?o:r){if(l.has(e))return l.get(e);l.set(e,a)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(l=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?l(a,t,i):a[t]=e[t]);return a})(e,t)}const isCellElement=e=>!!_react().default.isValidElement(e)&&(e.type===_Cell.Cell||"Cell"===e.type.displayName),CellGroup=exports.CellGroup=_react().default.memo(({children:e,title:t,border:r,inset:o,card:l,style:i,bodyStyle:a,tokensOverride:n})=>{const u=(0,_tokens.useCellTokens)(n),c=r??u.defaults.groupBorder,d=(o??u.defaults.groupInset)||(l??u.defaults.groupCard),s=l??u.defaults.groupCard,p=c&&!d,g=(0,_react().useMemo)(()=>_react().default.Children.toArray(e),[e]),_=(0,_react().useMemo)(()=>{for(let e=g.length-1;e>=0;e--)if(isCellElement(g[e]))return e;return-1},[g]),f=(0,_react().useMemo)(()=>[{marginBottom:s?0:u.sizing.groupMarginBottom},i],[s,i,u.sizing.groupMarginBottom]),m=(0,_react().useMemo)(()=>({overflow:"hidden",borderRadius:u.radii.groupInset,marginHorizontal:u.sizing.groupInsetMarginHorizontal,backgroundColor:u.colors.background}),[u.colors.background,u.radii.groupInset,u.sizing.groupInsetMarginHorizontal]),y=[{backgroundColor:u.colors.groupBodyBackground},d?m:null,s?u.layout.groupCardShadow:null,a],C=(0,_react().useMemo)(()=>t?_react().default.createElement(_reactNative().Text,{style:{color:u.colors.groupTitle,fontSize:u.typography.groupTitleSize,paddingHorizontal:u.sizing.groupTitlePaddingHorizontal,paddingVertical:u.sizing.groupTitlePaddingVertical}},t):null,[t,u.colors.groupTitle,u.sizing.groupTitlePaddingHorizontal,u.sizing.groupTitlePaddingVertical,u.typography.groupTitleSize]),b=(0,_react().useMemo)(()=>g.map((e,t)=>{const r=_react().default.isValidElement(e)&&null!=e.key?e.key:t;return _react().default.createElement(_CellContext.CellGroupContext.Provider,{key:r,value:{border:c,inset:d,isLast:!!isCellElement(e)&&t===_}},e)}),[g,_,c,d]);return _react().default.createElement(_reactNative().View,{style:f},C,_react().default.createElement(_reactNative().View,{style:y},b,p?_react().default.createElement(_react().default.Fragment,null,["top","bottom"].map(e=>_react().default.createElement(_reactNative().View,{key:e,style:(0,_utils.createHairlineView)({position:e,color:u.colors.border,left:0,right:0,enabled:u.borders.width>0,width:u.borders.width})}))):null))});

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

@@ -1,19 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Cell = void 0;
-Object.defineProperty(exports, "CellGroup", {
-  enumerable: true,
-  get: function () {
-    return _CellGroup.CellGroup;
-  }
-});
-exports.default = void 0;
-var _Cell = require("./Cell");
-var _CellGroup = require("./CellGroup");
-const Cell = exports.Cell = Object.assign(_Cell.Cell, {
-  Group: _CellGroup.CellGroup
-});
-var _default = exports.default = Cell;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Cell=void 0,Object.defineProperty(exports,"CellGroup",{enumerable:!0,get:function(){return _CellGroup.CellGroup}}),exports.default=void 0;var _Cell=require("./Cell"),_CellGroup=require("./CellGroup");const Cell=exports.Cell=Object.assign(_Cell.Cell,{Group:_CellGroup.CellGroup});var _default=exports.default=Cell;

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

@@ -1,173 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useCellTokens = exports.createCellTokens = void 0;
-function _reactNative() {
-  const data = require("react-native");
-  _reactNative = function () {
-    return data;
-  };
-  return data;
-}
-var _designSystem = require("../../design-system");
-const createCellTokens = foundations => {
-  const {
-    palette,
-    spacing,
-    fontSize,
-    typography,
-    radii
-  } = foundations;
-  const background = '#ffffff';
-  const paddingVertical = 10;
-  const largePaddingVertical = 14;
-  const paddingHorizontal = 16;
-  const arrowSize = 16;
-  const iconSize = 16;
-  const baseContainerLayout = {
-    flexDirection: 'row',
-    alignItems: 'flex-start',
-    width: '100%',
-    backgroundColor: background,
-    paddingHorizontal
-  };
-  return {
-    defaults: {
-      border: true,
-      size: 'normal',
-      arrowDirection: 'right',
-      activeOpacity: 0.6,
-      groupBorder: true,
-      groupInset: false,
-      groupCard: false
-    },
-    layout: {
-      container: {
-        ...baseContainerLayout,
-        paddingVertical
-      },
-      containerLarge: {
-        ...baseContainerLayout,
-        paddingVertical: largePaddingVertical
-      },
-      center: {
-        alignItems: 'center'
-      },
-      body: {
-        minWidth: 0,
-        flexDirection: 'column'
-      },
-      titleRow: {
-        flexDirection: 'row',
-        alignItems: 'center'
-      },
-      value: {
-        textAlign: 'right'
-      },
-      valueOnly: {
-        textAlign: 'left'
-      },
-      valueContainer: {
-        flex: 1,
-        flexShrink: 1,
-        minWidth: 0,
-        flexDirection: 'row',
-        alignItems: 'center',
-        justifyContent: 'flex-end'
-      },
-      valueOnlyContainer: {
-        justifyContent: 'flex-start',
-        alignItems: 'flex-start'
-      },
-      valueCenter: {
-        alignItems: 'center'
-      },
-      customContent: {
-        flexShrink: 1,
-        minWidth: 0
-      },
-      iconWrapper: {
-        justifyContent: 'center',
-        alignItems: 'center'
-      },
-      rightIconWrapper: {
-        alignSelf: 'center',
-        justifyContent: 'center',
-        alignItems: 'center'
-      },
-      hairline: {
-        position: 'absolute',
-        bottom: 0
-      },
-      groupCardShadow: {},
-      arrowTransforms: {
-        left: {
-          transform: [{
-            rotate: '180deg'
-          }]
-        },
-        right: {},
-        up: {
-          transform: [{
-            rotate: '-90deg'
-          }]
-        },
-        down: {
-          transform: [{
-            rotate: '90deg'
-          }]
-        }
-      }
-    },
-    colors: {
-      background,
-      ripple: palette.default[100],
-      title: palette.default[800],
-      label: palette.default[500],
-      value: palette.default[600],
-      required: palette.danger[500],
-      border: palette.default[200],
-      arrow: palette.default[400],
-      groupTitle: palette.default[500],
-      groupBodyBackground: background
-    },
-    typography: {
-      titleSize: fontSize.sm,
-      lineHeight: 24,
-      titleWeight: typography.weight.medium,
-      largeTitleSize: fontSize.lg,
-      labelSize: fontSize.xs,
-      largeLabelSize: fontSize.sm,
-      valueSize: fontSize.sm,
-      largeValueSize: fontSize.md,
-      groupTitleSize: fontSize.sm
-    },
-    sizing: {
-      paddingVertical,
-      paddingHorizontal,
-      largePaddingVertical,
-      arrowSize,
-      iconSize,
-      groupMarginBottom: spacing.md,
-      groupTitlePaddingHorizontal: spacing.lg,
-      groupTitlePaddingVertical: spacing.sm,
-      groupInsetMarginHorizontal: spacing.lg
-    },
-    radii: {
-      groupInset: radii.lg
-    },
-    borders: {
-      width: _reactNative().StyleSheet.hairlineWidth
-    },
-    spacing: {
-      iconGap: spacing.sm,
-      valueGap: spacing.none,
-      extraGap: spacing.sm,
-      labelMarginTop: spacing.xs
-    }
-  };
-};
-exports.createCellTokens = createCellTokens;
-const useCellTokens = exports.useCellTokens = (0, _designSystem.createComponentTokensHook)('cell', createCellTokens);
+"use strict";function _reactNative(){const e=require("react-native");return _reactNative=function(){return e},e}Object.defineProperty(exports,"__esModule",{value:!0}),exports.useCellTokens=exports.createCellTokens=void 0;var _designSystem=require("../../design-system");const createCellTokens=e=>{const{palette:t,spacing:r,fontSize:i,typography:n,radii:a}=e,o=e.surface??"#ffffff",l={flexDirection:"row",alignItems:"flex-start",width:"100%",backgroundColor:o,paddingHorizontal:16};return{defaults:{border:!0,size:"normal",arrowDirection:"right",activeOpacity:.6,groupBorder:!0,groupInset:!1,groupCard:!1},layout:{container:{...l,paddingVertical:10},containerLarge:{...l,paddingVertical:14},center:{alignItems:"center"},body:{minWidth:0,flexDirection:"column"},titleRow:{flexDirection:"row",alignItems:"center"},value:{textAlign:"right"},valueOnly:{textAlign:"left"},valueContainer:{flex:1,flexShrink:1,minWidth:0,flexDirection:"row",alignItems:"center",justifyContent:"flex-end"},valueOnlyContainer:{justifyContent:"flex-start",alignItems:"flex-start"},valueCenter:{alignItems:"center"},customContent:{flexShrink:1,minWidth:0},iconWrapper:{justifyContent:"center",alignItems:"center"},rightIconWrapper:{alignSelf:"center",justifyContent:"center",alignItems:"center"},hairline:{position:"absolute",bottom:0},groupCardShadow:{},arrowTransforms:{left:{transform:[{rotate:"180deg"}]},right:{},up:{transform:[{rotate:"-90deg"}]},down:{transform:[{rotate:"90deg"}]}}},colors:{background:o,ripple:t.default[100],title:t.default[800],label:t.default[500],value:t.default[600],required:t.danger[500],border:t.default[200],arrow:t.default[400],groupTitle:t.default[500],groupBodyBackground:o},typography:{titleSize:i.sm,lineHeight:24,titleWeight:n.weight.medium,largeTitleSize:i.lg,labelSize:i.xs,largeLabelSize:i.sm,valueSize:i.sm,largeValueSize:i.md,groupTitleSize:i.sm},sizing:{paddingVertical:10,paddingHorizontal:16,largePaddingVertical:14,arrowSize:16,iconSize:16,groupMarginBottom:r.md,groupTitlePaddingHorizontal:r.lg,groupTitlePaddingVertical:r.sm,groupInsetMarginHorizontal:r.lg},radii:{groupInset:a.lg},borders:{width:_reactNative().StyleSheet.hairlineWidth},spacing:{iconGap:r.sm,valueGap:r.none,extraGap:r.sm,labelMarginTop:r.xs}}};exports.createCellTokens=createCellTokens;const useCellTokens=exports.useCellTokens=(0,_designSystem.createComponentTokensHook)("cell",createCellTokens);