react-native-system-ui 0.0.1 → 0.0.2

package/dist/cjs/components/form/FormItem.js

@@ -1,143 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FormItem = void 0;
-function _react() {
-  const data = _interopRequireDefault(require("react"));
-  _react = function () {
-    return data;
-  };
-  return data;
-}
-var _validate = require("../../utils/validate");
-var _FormContext = require("./FormContext");
-var _utils = require("./utils");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const EMPTY_RULES = [];
-const FormItem = ({
-  name,
-  label,
-  description,
-  intro,
-  tooltip,
-  rules,
-  dependencies,
-  valuePropName = 'value',
-  trigger = 'onChangeText',
-  validateTrigger,
-  showValidateMessage,
-  required,
-  shouldUpdate,
-  initialValue,
-  children
-}) => {
-  const renderProps = (0, _validate.isFunction)(children);
-  const context = _react().default.useContext(_FormContext.FormContext);
-  if (!context) {
-    if (renderProps) {
-      return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, children({
-        getFieldValue: () => undefined,
-        getFieldsValue: () => ({}),
-        form: null
-      }));
-    }
-    return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, children);
-  }
-  const normalizedRules = rules ?? EMPTY_RULES;
-  const prevValuesRef = _react().default.useRef(context.values);
-  _react().default.useEffect(() => {
-    prevValuesRef.current = context.values;
-  }, [context.values]);
-  const shouldRender = !shouldUpdate || shouldUpdate(prevValuesRef.current, context.values);
-  _react().default.useEffect(() => {
-    if (!name) return undefined;
-    return context.registerField(name, {
-      rules: normalizedRules,
-      dependencies,
-      initialValue,
-      validateTrigger: validateTrigger ?? trigger
-    });
-  }, [context.registerField, name, normalizedRules, dependencies, initialValue, validateTrigger, trigger]);
-  const mergedValue = name ? context.getFieldValue(name) : undefined;
-  const mergedShowMessage = showValidateMessage ?? context.showValidateMessage ?? true;
-  const fieldErrors = name ? context.getFieldError(name) : undefined;
-  const firstError = mergedShowMessage ? fieldErrors?.[0] : undefined;
-  const mergedRequired = required ?? normalizedRules.some(rule => rule.required);
-  const mergedValidateTriggers = (0, _utils.normalizeTrigger)(validateTrigger ?? trigger);
-  if (renderProps) {
-    if (!shouldRender) return null;
-    const node = children({
-      getFieldValue: context.getFieldValue,
-      getFieldsValue: context.getFieldsValue,
-      form: context.form
-    });
-    return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, node);
-  }
-  if (!name) {
-    return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, children);
-  }
-  if (!shouldRender) return null;
-  const childArray = _react().default.Children.toArray(children);
-  if (childArray.length !== 1) {
-    return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, children);
-  }
-  const child = childArray[0];
-  const handleChange = next => {
-    context.setFieldValue(name, next, trigger);
-    const original = child.props[trigger];
-    if ((0, _validate.isFunction)(original)) {
-      original(next);
-    }
-  };
-  const isFieldLike = (0, _validate.isString)(child?.type?.displayName) && (child.type.displayName.includes('Field') || child.type.displayName.includes('Input'));
-  const resolveValue = () => {
-    if (child.props[valuePropName] !== undefined) return child.props[valuePropName];
-    if (mergedValue !== undefined) return mergedValue;
-    if (isFieldLike && valuePropName === 'value') return '';
-    return mergedValue;
-  };
-  const injectedProps = {
-    [valuePropName]: resolveValue(),
-    [trigger]: handleChange
-  };
-  mergedValidateTriggers.forEach(eventName => {
-    if (!eventName || eventName === trigger) return;
-    const original = child.props[eventName];
-    injectedProps[eventName] = (...args) => {
-      if ((0, _validate.isFunction)(original)) {
-        original(...args);
-      }
-      context.validateField(name, eventName);
-    };
-  });
-  if (label !== undefined && child.props.label === undefined) {
-    injectedProps.label = label;
-  }
-  if (context.colon !== undefined && injectedProps.label !== undefined && child.props.colon === undefined) {
-    injectedProps.colon = context.colon;
-  }
-  if (context.labelWidth !== undefined && child.props.labelWidth === undefined) {
-    injectedProps.labelWidth = context.labelWidth;
-  }
-  if (description && child.props.description === undefined) {
-    injectedProps.description = description;
-  }
-  if (intro && child.props.intro === undefined) {
-    injectedProps.intro = intro;
-  }
-  if (tooltip && child.props.tooltip === undefined) {
-    injectedProps.tooltip = tooltip;
-  }
-  if (mergedRequired && child.props.required === undefined) {
-    injectedProps.required = true;
-  }
-  if (firstError && child.props.errorMessage === undefined) {
-    injectedProps.error = true;
-    injectedProps.errorMessage = firstError;
-  }
-  return /*#__PURE__*/_react().default.cloneElement(child, injectedProps);
-};
-exports.FormItem = FormItem;
-FormItem.displayName = 'FormItem';

package/dist/cjs/components/form/FormList.js

@@ -1,70 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FormList = void 0;
-function _react() {
-  const data = _interopRequireDefault(require("react"));
-  _react = function () {
-    return data;
-  };
-  return data;
-}
-var _FormContext = require("./FormContext");
-var _utils = require("./utils");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const FormList = ({
-  name,
-  initialValue,
-  children
-}) => {
-  const context = _react().default.useContext(_FormContext.FormContext);
-  const keyRef = _react().default.useRef(0);
-  const ensureInitial = _react().default.useCallback(() => {
-    if (!context) return;
-    const current = (0, _utils.getValueByName)(context.values, name);
-    if (current === undefined && initialValue !== undefined) {
-      context.setFieldValue(name, initialValue);
-    }
-  }, [context, initialValue, name]);
-  _react().default.useEffect(() => {
-    ensureInitial();
-  }, [ensureInitial]);
-  if (!context) {
-    return null;
-  }
-  const listValueRaw = (0, _utils.getValueByName)(context.values, name);
-  const listValue = Array.isArray(listValueRaw) ? listValueRaw : [];
-  const fields = listValue.map((_, index) => ({
-    name: index,
-    key: keyRef.current + index,
-    isListField: true
-  }));
-  const add = (defaultValue, index) => {
-    const insertIndex = typeof index === 'number' ? index : listValue.length;
-    const next = [...listValue];
-    next.splice(insertIndex, 0, defaultValue);
-    context.setFieldValue(name, next);
-    keyRef.current += 1;
-  };
-  const remove = index => {
-    if (index < 0 || index >= listValue.length) return;
-    const next = listValue.slice(0, index).concat(listValue.slice(index + 1));
-    context.setFieldValue(name, next);
-  };
-  const move = (from, to) => {
-    if (from === to || from < 0 || to < 0 || from >= listValue.length || to >= listValue.length) return;
-    const next = [...listValue];
-    const item = next.splice(from, 1)[0];
-    next.splice(to, 0, item);
-    context.setFieldValue(name, next);
-  };
-  return /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, children(fields, {
-    add,
-    remove,
-    move
-  }));
-};
-exports.FormList = FormList;
-FormList.displayName = 'Form.List';

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

@@ -1,51 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Form = void 0;
-Object.defineProperty(exports, "FormItem", {
-  enumerable: true,
-  get: function () {
-    return _FormItem.FormItem;
-  }
-});
-Object.defineProperty(exports, "FormList", {
-  enumerable: true,
-  get: function () {
-    return _FormList.FormList;
-  }
-});
-Object.defineProperty(exports, "FormSubscribe", {
-  enumerable: true,
-  get: function () {
-    return _Form.FormSubscribe;
-  }
-});
-exports.default = void 0;
-Object.defineProperty(exports, "useWatch", {
-  enumerable: true,
-  get: function () {
-    return _Form.useWatch;
-  }
-});
-function _react() {
-  const data = _interopRequireDefault(require("react"));
-  _react = function () {
-    return data;
-  };
-  return data;
-}
-var _Form = _interopRequireWildcard(require("./Form"));
-var _FormItem = require("./FormItem");
-var _FormList = require("./FormList");
-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 _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const Form = exports.Form = Object.assign(_Form.default, {
-  Item: _FormItem.FormItem,
-  List: _FormList.FormList,
-  useForm: () => _react().default.useRef(null),
-  Subscribe: _Form.FormSubscribe,
-  useWatch: _Form.useWatch
-});
-var _default = exports.default = Form;

package/dist/cjs/components/form/types.d.ts

@@ -1,80 +0,0 @@
-import type { ReactNode } from 'react'
-import type { ViewProps } from 'react-native'
-
-export type FormRuleValidateTrigger = string | string[]
-
-export type FormRuleValidator = (
-  value: any,
-  values: Record<string, any>
-) => void | boolean | string | Promise<void | boolean | string>
-
-export type NamePath = string | number | (string | number)[]
-
-export interface FormItemRule {
-  required?: boolean
-  message?: string
-  pattern?: RegExp
-  len?: number
-  min?: number
-  max?: number
-  whitespace?: boolean
-  validator?: FormRuleValidator
-  validateTrigger?: FormRuleValidateTrigger
-}
-
-export interface RegisteredFieldOptions {
-  rules?: FormItemRule[]
-  dependencies?: NamePath[]
-  initialValue?: any
-  validateTrigger?: FormRuleValidateTrigger
-}
-
-export interface FormInstance {
-  submit: () => Promise<Record<string, any> | undefined>
-  getFieldsValue: () => Record<string, any>
-  setFieldsValue: (values: Record<string, any>) => void
-  resetFields: () => void
-  validateFields: (names?: NamePath[]) => Promise<Record<string, any>>
-  getFieldError: (name: NamePath) => string[]
-}
-
-export interface FormProps extends ViewProps {
-  initialValues?: Record<string, any>
-  colon?: boolean
-  labelWidth?: number
-  showValidateMessage?: boolean
-  footer?: ReactNode
-  onValuesChange?: (values: Record<string, any>, name: string, value: any) => void
-  onFinish?: (values: Record<string, any>) => void
-  children?: ReactNode
-}
-
-export interface FormSubscribeProps {
-  to?: string[]
-  children: (changedValues: Record<string, any>, form: FormInstance | null) => ReactNode
-}
-
-export interface FormItemProps {
-  name?: NamePath
-  label?: ReactNode
-  description?: ReactNode
-  intro?: ReactNode
-  tooltip?: ReactNode
-  rules?: FormItemRule[]
-  dependencies?: NamePath[]
-  valuePropName?: string
-  trigger?: string
-  validateTrigger?: FormRuleValidateTrigger
-  showValidateMessage?: boolean
-  required?: boolean
-  noStyle?: boolean
-  shouldUpdate?: (prev: Record<string, any>, next: Record<string, any>) => boolean
-  initialValue?: any
-  children:
-    | ReactNode
-    | ((payload: {
-        getFieldValue: (name: NamePath) => any
-        getFieldsValue: () => Record<string, any>
-        form: FormInstance | null
-      }) => ReactNode)
-}

package/dist/cjs/components/form/utils.js

@@ -1,51 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.toNamePath = exports.setValueByName = exports.serializeNamePath = exports.normalizeTrigger = exports.getValueByName = void 0;
-var _validate = require("../../utils/validate");
-const normalizeTrigger = trigger => trigger ? Array.isArray(trigger) ? trigger : [trigger] : [];
-exports.normalizeTrigger = normalizeTrigger;
-const toNamePath = name => {
-  if (name === undefined || name === null) return [];
-  if (Array.isArray(name)) return name;
-  if ((0, _validate.isNumber)(name)) return [name];
-  if ((0, _validate.isString)(name)) {
-    return name.split('.');
-  }
-  return [String(name)];
-};
-exports.toNamePath = toNamePath;
-const serializeNamePath = name => {
-  const path = toNamePath(name);
-  return path.join('.');
-};
-exports.serializeNamePath = serializeNamePath;
-const getValueByName = (source, name) => {
-  const path = toNamePath(name);
-  return path.reduce((acc, key) => acc == null ? acc : acc[key], source);
-};
-exports.getValueByName = getValueByName;
-const setValueByName = (source, name, value) => {
-  const path = toNamePath(name);
-  if (!path.length) return value;
-  const clone = Array.isArray(source) ? [...source] : {
-    ...(source ?? {})
-  };
-  let cursor = clone;
-  path.forEach((key, index) => {
-    if (index === path.length - 1) {
-      cursor[key] = value;
-      return;
-    }
-    const nextVal = cursor[key];
-    const nextContainer = nextVal === undefined || nextVal === null ? (0, _validate.isNumber)(path[index + 1]) ? [] : {} : Array.isArray(nextVal) ? [...nextVal] : {
-      ...nextVal
-    };
-    cursor[key] = nextContainer;
-    cursor = nextContainer;
-  });
-  return clone;
-};
-exports.setValueByName = setValueByName;

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

@@ -1,103 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Grid = void 0;
-function _react() {
-  const data = _interopRequireDefault(require("react"));
-  _react = function () {
-    return data;
-  };
-  return data;
-}
-function _reactNative() {
-  const data = require("react-native");
-  _reactNative = function () {
-    return data;
-  };
-  return data;
-}
-var _hairline = require("../../utils/hairline");
-var _GridContext = require("./GridContext");
-var _tokens = require("./tokens");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-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 Grid = props => {
-  const {
-    tokensOverride,
-    children,
-    columnNum: columnNumProp,
-    gutter: gutterProp,
-    border: borderProp,
-    center: centerProp,
-    square: squareProp,
-    direction: directionProp,
-    reverse: reverseProp,
-    clickable: clickableProp,
-    iconSize: iconSizeProp,
-    iconColor,
-    style,
-    ...rest
-  } = props;
-  const tokens = (0, _tokens.useGridTokens)(tokensOverride);
-  const columnNumValue = columnNumProp ?? tokens.defaults.columnNum;
-  const columnNum = Number.isFinite(columnNumValue) && columnNumValue > 0 ? Math.floor(columnNumValue) : tokens.defaults.columnNum;
-  const gutterValue = gutterProp ?? tokens.defaults.gutter;
-  const gutter = Number.isFinite(gutterValue) && gutterValue > 0 ? gutterValue : 0;
-  const border = borderProp ?? tokens.defaults.border;
-  const center = centerProp ?? tokens.defaults.center;
-  const square = squareProp ?? tokens.defaults.square;
-  const direction = directionProp ?? tokens.defaults.direction;
-  const reverse = reverseProp ?? tokens.defaults.reverse;
-  const clickable = clickableProp ?? tokens.defaults.clickable;
-  const iconSizeValue = iconSizeProp ?? tokens.defaults.iconSize;
-  const iconSize = Number.isFinite(iconSizeValue) && iconSizeValue > 0 ? iconSizeValue : tokens.defaults.iconSize;
-  const childArray = _react().default.Children.toArray(children).filter(child => /*#__PURE__*/_react().default.isValidElement(child));
-  const showBorder = border && !gutter;
-  const borderColor = tokens.colors.border;
-  const topBorder = showBorder && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.border, tokens.layout.borderTop, (0, _hairline.createHairlineView)({
-      position: 'top',
-      color: borderColor,
-      left: 0,
-      right: 0,
-      top: 0
-    })]
-  });
-  const bottomBorder = showBorder && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.border, tokens.layout.borderBottom, (0, _hairline.createHairlineView)({
-      position: 'bottom',
-      color: borderColor,
-      left: 0,
-      right: 0,
-      bottom: 0
-    })]
-  });
-  const contextValue = _react().default.useMemo(() => ({
-    columnNum,
-    gutter,
-    border,
-    center,
-    square,
-    direction,
-    reverse,
-    clickable,
-    iconSize,
-    iconColor,
-    count: childArray.length,
-    tokens
-  }), [border, center, childArray.length, clickable, columnNum, direction, gutter, iconColor, iconSize, reverse, square, tokens]);
-  return /*#__PURE__*/_react().default.createElement(_GridContext.GridContext.Provider, {
-    value: contextValue
-  }, /*#__PURE__*/_react().default.createElement(_reactNative().View, _extends({
-    style: [tokens.layout.container, gutter ? {
-      paddingLeft: gutter
-    } : null, style]
-  }, rest), topBorder, childArray.map((child, index) => /*#__PURE__*/_react().default.cloneElement(child, {
-    gridItemIndex: index,
-    key: child.key ?? index
-  })), bottomBorder));
-};
-exports.Grid = Grid;
-Grid.displayName = 'Grid';

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

@@ -1,152 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.GridItem = void 0;
-function _react() {
-  const data = _interopRequireDefault(require("react"));
-  _react = function () {
-    return data;
-  };
-  return data;
-}
-function _reactNative() {
-  const data = require("react-native");
-  _reactNative = function () {
-    return data;
-  };
-  return data;
-}
-var _badge = _interopRequireDefault(require("../badge"));
-var _hairline = require("../../utils/hairline");
-var _validate = require("../../utils/validate");
-var _GridContext = require("./GridContext");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-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 GridItem = props => {
-  const context = _react().default.useContext(_GridContext.GridContext);
-  if (!context) throw new Error('GridItem must be used within Grid');
-  const {
-    gridItemIndex = 0,
-    text,
-    icon,
-    iconColor: iconColorProp,
-    badge,
-    dot,
-    contentStyle,
-    textStyle,
-    children,
-    style,
-    onPress,
-    ...rest
-  } = props;
-  const {
-    tokens,
-    columnNum,
-    gutter,
-    border,
-    center,
-    square,
-    direction,
-    reverse,
-    clickable,
-    iconSize,
-    iconColor,
-    count
-  } = context;
-  const widthPercent = `${100 / columnNum}%`;
-  const isLastColumn = (gridItemIndex + 1) % columnNum === 0;
-  const rowIndex = Math.floor(gridItemIndex / columnNum);
-  const lastRowIndex = Math.floor((count - 1) / columnNum);
-  const contentWrapperStyle = [tokens.layout.itemContentBase, direction === 'horizontal' ? tokens.layout.itemHorizontal : tokens.layout.itemVertical, center && tokens.layout.itemCenter, reverse ? direction === 'horizontal' ? tokens.layout.itemReverseRow : tokens.layout.itemReverseColumn : null, square ? tokens.layout.itemContentSquare : null, {
-    paddingHorizontal: tokens.spacing.paddingHorizontal,
-    paddingVertical: tokens.spacing.paddingVertical,
-    backgroundColor: tokens.colors.background
-  }, contentStyle];
-  const hasText = (0, _validate.isRenderable)(text);
-  const resolvedIconColor = iconColorProp ?? iconColor ?? tokens.colors.text;
-  let innerContent = children;
-  if (!innerContent) {
-    let iconElement = null;
-    if (icon || badge || dot) {
-      const {
-        style: badgeWrapperStyle,
-        ...badgeRest
-      } = badge ?? {};
-      const marginKey = direction === 'vertical' ? reverse ? 'marginTop' : 'marginBottom' : reverse ? 'marginLeft' : 'marginRight';
-      const iconWrapperStyle = [tokens.layout.iconWrapper, hasText && {
-        [marginKey]: tokens.spacing.iconGap
-      }];
-      const iconNode = (0, _validate.isFunction)(icon) ? icon(iconSize, resolvedIconColor) : icon;
-      const content = /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-        style: iconWrapperStyle
-      }, iconNode);
-      iconElement = badge || dot ? /*#__PURE__*/_react().default.createElement(_badge.default, _extends({
-        dot: dot
-      }, badgeRest, {
-        style: center ? [badgeWrapperStyle, {
-          alignSelf: 'center'
-        }] : badgeWrapperStyle
-      }), content) : content;
-    }
-    const textElement = hasText ? (0, _validate.isText)(text) ? /*#__PURE__*/_react().default.createElement(_reactNative().Text, {
-      style: [tokens.layout.text, {
-        color: tokens.colors.text,
-        fontSize: tokens.typography.fontSize,
-        lineHeight: tokens.typography.lineHeight,
-        fontFamily: tokens.typography.fontFamily,
-        fontWeight: tokens.typography.fontWeight
-      }, textStyle],
-      numberOfLines: tokens.defaults.textNumberOfLines
-    }, text) : text : null;
-    innerContent = /*#__PURE__*/_react().default.createElement(_react().default.Fragment, null, iconElement, textElement);
-  }
-  const rightBorder = border && !gutter && !isLastColumn && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.itemBorderRight, (0, _hairline.createHairlineView)({
-      position: 'right',
-      color: tokens.colors.border,
-      top: 0,
-      bottom: 0,
-      right: 0
-    })]
-  });
-  const bottomBorder = border && !gutter && rowIndex < lastRowIndex && /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: [tokens.layout.itemBorderBottom, (0, _hairline.createHairlineView)({
-      position: 'bottom',
-      color: tokens.colors.border,
-      left: 0,
-      right: 0,
-      bottom: 0
-    })]
-  });
-  const content = /*#__PURE__*/_react().default.createElement(_reactNative().View, {
-    style: contentWrapperStyle
-  }, innerContent, rightBorder, bottomBorder);
-  const baseItemStyle = {
-    width: widthPercent,
-    flexGrow: 0,
-    flexShrink: 0,
-    paddingRight: gutter ? gutter : undefined,
-    marginTop: gutter && rowIndex > 0 ? gutter : undefined
-  };
-  const isInteractive = clickable || (0, _validate.isFunction)(onPress);
-  if (isInteractive) {
-    return /*#__PURE__*/_react().default.createElement(_reactNative().Pressable, _extends({
-      style: pressableState => [baseItemStyle, typeof style === 'function' ? style(pressableState) : style, {
-        opacity: pressableState.pressed ? tokens.defaults.pressedOpacity : 1
-      }],
-      android_ripple: {
-        color: tokens.colors.active
-      },
-      onPress: onPress
-    }, rest), content);
-  }
-  return /*#__PURE__*/_react().default.createElement(_reactNative().View, _extends({
-    style: [baseItemStyle, typeof style === 'function' ? style({
-      pressed: false
-    }) : style]
-  }, rest), content);
-};
-exports.GridItem = GridItem;
-GridItem.displayName = 'GridItem';