@seakoi/native-ui 1.0.0

package/dist/commonjs/components/base/calendar/utils/lunar.js

@@ -0,0 +1,308 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getDateCellSubText = getDateCellSubText;
+exports.getGanZhiYear = getGanZhiYear;
+exports.getLunarDayText = getLunarDayText;
+exports.getLunarInfo = getLunarInfo;
+exports.getSolarFestival = getSolarFestival;
+exports.getSolarTerm = getSolarTerm;
+exports.getTraditionalFestival = getTraditionalFestival;
+exports.getZodiac = getZodiac;
+exports.solarToLunar = solarToLunar;
+/**
+ * 农历工具函数
+ * 基于农历算法实现，无需外部依赖
+ */
+
+// 模块级别的缓存
+const lunarCache = new Map();
+const MAX_CACHE_SIZE = 1000;
+
+// 农历数据：1900-2100年
+// 每个元素的含义：前12位表示12个月的大小月（1为30天，0为29天），后4位表示闰月月份（0表示无闰月）
+const LUNAR_INFO = [0x04bd8, 0x04ae0, 0x0a570, 0x054d5, 0x0d260, 0x0d950, 0x16554, 0x056a0, 0x09ad0, 0x055d2, 0x04ae0, 0x0a5b6, 0x0a4d0, 0x0d250, 0x1d255, 0x0b540, 0x0d6a0, 0x0ada2, 0x095b0, 0x14977, 0x04970, 0x0a4b0, 0x0b4b5, 0x06a50, 0x06d40, 0x1ab54, 0x02b60, 0x09570, 0x052f2, 0x04970, 0x06566, 0x0d4a0, 0x0ea50, 0x06e95, 0x05ad0, 0x02b60, 0x186e3, 0x092e0, 0x1c8d7, 0x0c950, 0x0d4a0, 0x1d8a6, 0x0b550, 0x056a0, 0x1a5b4, 0x025d0, 0x092d0, 0x0d2b2, 0x0a950, 0x0b557, 0x06ca0, 0x0b550, 0x15355, 0x04da0, 0x0a5b0, 0x14573, 0x052b0, 0x0a9a8, 0x0e950, 0x06aa0, 0x0aea6, 0x0ab50, 0x04b60, 0x0aae4, 0x0a570, 0x05260, 0x0f263, 0x0d950, 0x05b57, 0x056a0, 0x096d0, 0x04dd5, 0x04ad0, 0x0a4d0, 0x0d4d4, 0x0d250, 0x0d558, 0x0b540, 0x0b6a0, 0x195a6, 0x095b0, 0x049b0, 0x0a974, 0x0a4b0, 0x0b27a, 0x06a50, 0x06d40, 0x0af46, 0x0ab60, 0x09570, 0x04af5, 0x04970, 0x064b0, 0x074a3, 0x0ea50, 0x06b58, 0x055c0, 0x0ab60, 0x096d5, 0x092e0, 0x0c960, 0x0d954, 0x0d4a0, 0x0da50, 0x07552, 0x056a0, 0x0abb7, 0x025d0, 0x092d0, 0x0cab5, 0x0a950, 0x0b4a0, 0x0baa4, 0x0ad50, 0x055d9, 0x04ba0, 0x0a5b0, 0x15176, 0x052b0, 0x0a930, 0x07954, 0x06aa0, 0x0ad50, 0x05b52, 0x04b60, 0x0a6e6, 0x0a4e0, 0x0d260, 0x0ea65, 0x0d530, 0x05aa0, 0x076a3, 0x096d0, 0x04afb, 0x04ad0, 0x0a4d0, 0x1d0b6, 0x0d250, 0x0d520, 0x0dd45, 0x0b5a0, 0x056d0, 0x055b2, 0x049b0, 0x0a577, 0x0a4b0, 0x0aa50, 0x1b255, 0x06d20, 0x0ada0, 0x14b63, 0x09370, 0x049f8, 0x04970, 0x064b0, 0x168a6, 0x0ea50, 0x06b20, 0x1a6c4, 0x0aae0, 0x0a2e0, 0x0d2e3, 0x0c960, 0x0d557, 0x0d4a0, 0x0da50, 0x05d55, 0x056a0, 0x0a6d0, 0x055d4, 0x052d0, 0x0a9b8, 0x0a950, 0x0b4a0, 0x0b6a6, 0x0ad50, 0x055a0, 0x0aba4, 0x0a5b0, 0x052b0, 0x0b273, 0x06930, 0x07337, 0x06aa0, 0x0ad50, 0x14b55, 0x04b60, 0x0a570, 0x054e4, 0x0d160, 0x0e968, 0x0d520, 0x0daa0, 0x16aa6, 0x056d0, 0x04ae0, 0x0a9d4, 0x0a2d0, 0x0d150, 0x0f252, 0x0d520];
+
+// 天干
+const HEAVENLY_STEMS = ['甲', '乙', '丙', '丁', '戊', '己', '庚', '辛', '壬', '癸'];
+
+// 地支
+const EARTHLY_BRANCHES = ['子', '丑', '寅', '卯', '辰', '巳', '午', '未', '申', '酉', '戌', '亥'];
+
+// 生肖
+const ZODIAC = ['鼠', '牛', '虎', '兔', '龙', '蛇', '马', '羊', '猴', '鸡', '狗', '猪'];
+
+// 农历月份
+const LUNAR_MONTHS = ['正', '二', '三', '四', '五', '六', '七', '八', '九', '十', '冬', '腊'];
+
+// 农历日期
+const LUNAR_DAYS = ['初一', '初二', '初三', '初四', '初五', '初六', '初七', '初八', '初九', '初十', '十一', '十二', '十三', '十四', '十五', '十六', '十七', '十八', '十九', '二十', '廿一', '廿二', '廿三', '廿四', '廿五', '廿六', '廿七', '廿八', '廿九', '三十'];
+
+// 节气
+const SOLAR_TERMS = ['小寒', '大寒', '立春', '雨水', '惊蛰', '春分', '清明', '谷雨', '立夏', '小满', '芒种', '夏至', '小暑', '大暑', '立秋', '处暑', '白露', '秋分', '寒露', '霜降', '立冬', '小雪', '大雪', '冬至'];
+
+// 节气数据（简化版，基于1900-2100年）
+const SOLAR_TERM_BASE = [[5, 20], [4, 19], [6, 21], [5, 21], [6, 22], [6, 22], [6, 23], [6, 23], [7, 24], [6, 23], [7, 24], [7, 24], [8, 25], [8, 25], [9, 26], [8, 25], [8, 25], [8, 25], [9, 26], [9, 26], [8, 25], [8, 25], [8, 25], [7, 24]];
+
+// 传统节日
+const TRADITIONAL_FESTIVALS = {
+  '1-1': '春节',
+  '1-15': '元宵',
+  '2-2': '龙抬头',
+  '5-5': '端午',
+  '7-7': '七夕',
+  '7-15': '中元',
+  '8-15': '中秋',
+  '9-9': '重阳',
+  '12-8': '腊八',
+  '12-23': '小年'
+};
+
+// 公历节日
+const SOLAR_FESTIVALS = {
+  '1-1': '元旦',
+  '2-14': '情人节',
+  '3-8': '妇女节',
+  '3-12': '植树节',
+  '4-1': '愚人节',
+  '5-1': '劳动节',
+  '5-4': '青年节',
+  '6-1': '儿童节',
+  '7-1': '建党节',
+  '8-1': '建军节',
+  '9-10': '教师节',
+  '10-1': '国庆节',
+  '12-25': '圣诞节'
+};
+
+/**
+ * 获取农历年份的闰月月份
+ */
+function getLeapMonth(year) {
+  return LUNAR_INFO[year - 1900] & 0xf;
+}
+
+/**
+ * 获取农历年份的闰月天数
+ */
+function getLeapDays(year) {
+  if (getLeapMonth(year)) {
+    return LUNAR_INFO[year - 1900] & 0x10000 ? 30 : 29;
+  }
+  return 0;
+}
+
+/**
+ * 获取农历年份的总天数
+ */
+function getYearDays(year) {
+  let sum = 348;
+  for (let i = 0x8000; i > 0x8; i >>= 1) {
+    sum += LUNAR_INFO[year - 1900] & i ? 1 : 0;
+  }
+  return sum + getLeapDays(year);
+}
+
+/**
+ * 获取农历月份的天数
+ */
+function getMonthDays(year, month) {
+  return LUNAR_INFO[year - 1900] & 0x10000 >> month ? 30 : 29;
+}
+
+/**
+ * 将公历日期转换为农历（内部实现，不带缓存）
+ */
+function solarToLunarInternal(date) {
+  const baseDate = new Date(1900, 0, 31);
+  let offset = Math.floor((date.getTime() - baseDate.getTime()) / 86400000);
+  let lunarYear = 1900;
+  let lunarMonth = 1;
+  let lunarDay = 1;
+  let isLeap = false;
+
+  // 计算农历年份
+  for (let i = 1900; i < 2101 && offset > 0; i++) {
+    const yearDays = getYearDays(i);
+    if (offset < yearDays) {
+      lunarYear = i;
+      break;
+    }
+    offset -= yearDays;
+  }
+
+  // 计算农历月份
+  const leapMonth = getLeapMonth(lunarYear);
+  for (let i = 1; i < 13 && offset > 0; i++) {
+    // 闰月
+    if (leapMonth > 0 && i === leapMonth + 1 && !isLeap) {
+      --i;
+      isLeap = true;
+      const leapDays = getLeapDays(lunarYear);
+      if (offset < leapDays) {
+        lunarMonth = i;
+        break;
+      }
+      offset -= leapDays;
+    } else {
+      const monthDays = getMonthDays(lunarYear, i);
+      if (offset < monthDays) {
+        lunarMonth = i;
+        break;
+      }
+      offset -= monthDays;
+    }
+    if (isLeap && i === leapMonth + 1) {
+      isLeap = false;
+    }
+  }
+  lunarDay = offset + 1;
+  return {
+    year: lunarYear,
+    month: lunarMonth,
+    day: lunarDay,
+    isLeap
+  };
+}
+
+/**
+ * 将公历日期转换为农历（带缓存优化）
+ */
+function solarToLunar(date) {
+  // 使用日期字符串作为缓存键
+  const cacheKey = `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}`;
+
+  // 检查缓存
+  if (lunarCache.has(cacheKey)) {
+    return lunarCache.get(cacheKey);
+  }
+
+  // 计算农历
+  const result = solarToLunarInternal(date);
+
+  // 缓存结果
+  lunarCache.set(cacheKey, result);
+
+  // 限制缓存大小，防止内存泄漏
+  if (lunarCache.size > MAX_CACHE_SIZE) {
+    const firstKey = lunarCache.keys().next().value;
+    if (firstKey) {
+      lunarCache.delete(firstKey);
+    }
+  }
+  return result;
+}
+
+/**
+ * 获取农历日期的显示文本
+ */
+function getLunarDayText(date) {
+  const lunar = solarToLunar(date);
+
+  // 如果是初一，显示月份
+  if (lunar.day === 1) {
+    const monthText = LUNAR_MONTHS[lunar.month - 1];
+    return lunar.isLeap ? `闰${monthText}` : monthText;
+  }
+  return LUNAR_DAYS[lunar.day - 1];
+}
+
+/**
+ * 获取天干地支年份
+ */
+function getGanZhiYear(year) {
+  const ganIndex = (year - 4) % 10;
+  const zhiIndex = (year - 4) % 12;
+  return HEAVENLY_STEMS[ganIndex] + EARTHLY_BRANCHES[zhiIndex];
+}
+
+/**
+ * 获取生肖
+ */
+function getZodiac(year) {
+  return ZODIAC[(year - 4) % 12];
+}
+
+/**
+ * 获取节气
+ */
+function getSolarTerm(date) {
+  const month = date.getMonth();
+  const day = date.getDate();
+
+  // 每个月有两个节气
+  const termIndex = month * 2;
+  const [day1, day2] = SOLAR_TERM_BASE[termIndex];
+  if (day === day1) {
+    return SOLAR_TERMS[termIndex];
+  }
+  if (day === day2 && termIndex + 1 < SOLAR_TERMS.length) {
+    return SOLAR_TERMS[termIndex + 1];
+  }
+  return null;
+}
+
+/**
+ * 获取传统节日
+ */
+function getTraditionalFestival(date) {
+  const lunar = solarToLunar(date);
+  const key = `${lunar.month}-${lunar.day}`;
+  return TRADITIONAL_FESTIVALS[key] || null;
+}
+
+/**
+ * 获取公历节日
+ */
+function getSolarFestival(date) {
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
+  const key = `${month}-${day}`;
+  return SOLAR_FESTIVALS[key] || null;
+}
+
+/**
+ * 获取日期的完整农历信息
+ */
+
+function getLunarInfo(date) {
+  const lunar = solarToLunar(date);
+  return {
+    lunarDay: getLunarDayText(date),
+    solarTerm: getSolarTerm(date),
+    festival: getTraditionalFestival(date),
+    solarFestival: getSolarFestival(date),
+    lunarYear: lunar.year,
+    lunarMonth: lunar.month,
+    isLeap: lunar.isLeap,
+    ganZhiYear: getGanZhiYear(lunar.year),
+    zodiac: getZodiac(lunar.year)
+  };
+}
+
+/**
+ * 获取日期单元格显示的文本（优先级：节日 > 节气 > 农历）
+ */
+function getDateCellSubText(date) {
+  const info = getLunarInfo(date);
+
+  // 优先显示公历节日
+  if (info.solarFestival) {
+    return info.solarFestival;
+  }
+
+  // 其次显示传统节日
+  if (info.festival) {
+    return info.festival;
+  }
+
+  // 再显示节气
+  if (info.solarTerm) {
+    return info.solarTerm;
+  }
+
+  // 最后显示农历日期
+  return info.lunarDay;
+}

package/dist/commonjs/components/base/calendar/utils/utils.js

@@ -0,0 +1,114 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.timestampToDate = exports.isValidDate = exports.isToday = exports.isSameDate = exports.isDateInRange = exports.groupDatesByWeek = exports.getMonthDates = exports.formatDateForAccessibility = exports.dateToTimestamp = void 0;
+/**
+ * 日历组件工具函数
+ */
+
+/**
+ * 判断两个日期是否相同（忽略时间）
+ */
+const isSameDate = (date1, date2) => {
+  if (!date1 || !date2) return false;
+  return date1.getDate() === date2.getDate() && date1.getMonth() === date2.getMonth() && date1.getFullYear() === date2.getFullYear();
+};
+
+/**
+ * 判断日期是否在范围内（不包括起始和结束日期）
+ */
+exports.isSameDate = isSameDate;
+const isDateInRange = (date, start, end) => {
+  if (!start || !end) return false;
+  const time = date.getTime();
+  const startTime = start.getTime();
+  const endTime = end.getTime();
+  return time > startTime && time < endTime;
+};
+
+/**
+ * 判断是否是今天
+ */
+exports.isDateInRange = isDateInRange;
+const isToday = date => {
+  const today = new Date();
+  return date.getDate() === today.getDate() && date.getMonth() === today.getMonth() && date.getFullYear() === today.getFullYear();
+};
+
+/**
+ * 判断日期是否有效
+ */
+exports.isToday = isToday;
+const isValidDate = date => {
+  return date instanceof Date && !isNaN(date.getTime());
+};
+
+/**
+ * 获取月份的所有日期（包括前后月份填充）
+ */
+exports.isValidDate = isValidDate;
+const getMonthDates = currentDate => {
+  const year = currentDate.getFullYear();
+  const month = currentDate.getMonth();
+
+  // 当月第一天
+  const firstDay = new Date(year, month, 1);
+  // 当月最后一天
+  const lastDay = new Date(year, month + 1, 0);
+
+  // 需要显示的第一天（可能是上个月）
+  const startDay = new Date(firstDay);
+  startDay.setDate(startDay.getDate() - firstDay.getDay());
+
+  // 需要显示的最后一天（可能是下个月）
+  const endDay = new Date(lastDay);
+  endDay.setDate(endDay.getDate() + (6 - lastDay.getDay()));
+  const result = [];
+  const current = new Date(startDay);
+  while (current <= endDay) {
+    result.push(new Date(current));
+    current.setDate(current.getDate() + 1);
+  }
+  return result;
+};
+
+/**
+ * 将日期数组按周分组
+ */
+exports.getMonthDates = getMonthDates;
+const groupDatesByWeek = dates => {
+  const result = [];
+  for (let i = 0; i < dates.length; i += 7) {
+    result.push(dates.slice(i, i + 7));
+  }
+  return result;
+};
+
+/**
+ * 格式化日期为可访问性标签
+ */
+exports.groupDatesByWeek = groupDatesByWeek;
+const formatDateForAccessibility = date => {
+  return `${date.getFullYear()}年${date.getMonth() + 1}月${date.getDate()}日`;
+};
+
+/**
+ * 时间戳转换为 Date 对象
+ */
+exports.formatDateForAccessibility = formatDateForAccessibility;
+const timestampToDate = timestamp => {
+  if (timestamp === undefined || timestamp === null) return undefined;
+  return new Date(timestamp);
+};
+
+/**
+ * Date 对象转换为时间戳
+ */
+exports.timestampToDate = timestampToDate;
+const dateToTimestamp = date => {
+  if (!date) return undefined;
+  return date.getTime();
+};
+exports.dateToTimestamp = dateToTimestamp;

package/dist/commonjs/components/base/cell/cell-context.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CellContext = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const CellContext = exports.CellContext = /*#__PURE__*/_react.default.createContext(null);

package/dist/commonjs/components/base/cell/cell-group.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CellGroup = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _index = require("./../index.js");
+var _index2 = require("../../../native-provider/index.js");
+var _index3 = require("../../../shared/utils/index.js");
+var _cellContext = require("./cell-context.js");
+var _index4 = require("./style/index.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const CellGroup = ({
+  variant = 'normal',
+  ...props
+}) => {
+  const theme = (0, _index2.useTheme)();
+  const styles = (0, _index4.useGroupStyles)();
+  const children = _react.default.Children.toArray(props.children);
+  const elevation = props.elevation ?? (variant === 'card' ? 1 : 0);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: [styles.container, props.style],
+    children: [(0, _index3.safetyRenderChildren)(props.title, textValue => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Text, {
+      size: 16,
+      font: "medium",
+      numberOfLines: 1,
+      style: styles.title,
+      color: theme.palette.fontGray1,
+      children: textValue
+    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Surface, {
+      elevation: elevation,
+      style: [styles.contentContainer, props.contentContainerStyle, variant === 'card' && styles.card],
+      children: children.filter(_react.default.isValidElement).map((childNode, index) => {
+        const isBordered = !!props.bordered && index < children.length - 1;
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_cellContext.CellContext.Provider, {
+          value: {
+            bordered: isBordered && props.bordered,
+            borderedColor: props.borderedColor
+          },
+          children: childNode
+        }, index);
+      })
+    })]
+  });
+};
+exports.CellGroup = CellGroup;

package/dist/commonjs/components/base/cell/cell.js

@@ -0,0 +1,91 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Cell = void 0;
+var _svgIcons = require("@seakoi/svg-icons");
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _index = require("../../../native-provider/index.js");
+var _index2 = require("../../../shared/utils/index.js");
+var _index3 = require("../flex/index.js");
+var _index4 = require("../text/index.js");
+var _cellContext = require("./cell-context.js");
+var _index5 = require("./style/index.js");
+var _jsxRuntime = require("react/jsx-runtime");
+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 DEFAULT_INSET_SIZE = 16;
+const Cell = ({
+  titleNumberOfLines = 1,
+  descriptionNumberOfLines = 1,
+  ...props
+}) => {
+  const theme = (0, _index.useTheme)();
+  const styles = (0, _index5.useCellStyles)();
+  const context = (0, _react.useContext)(_cellContext.CellContext);
+  const bordered = props.bordered ?? context?.bordered;
+  const borderedColor = props.borderedColor ?? context?.borderedColor;
+  const borderedInset = (0, _react.useMemo)(() => {
+    if (typeof bordered !== 'object') return;
+    if (typeof bordered.inset !== 'object') {
+      return {
+        left: bordered.inset ?? DEFAULT_INSET_SIZE,
+        right: bordered.inset ?? DEFAULT_INSET_SIZE
+      };
+    }
+    return bordered.inset;
+  }, [bordered]);
+  const showRightContent = !!(props.showArrow || props.extra);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
+    activeOpacity: 0.8,
+    disabled: props.disabledPress || !props.onPress,
+    onPress: props.onPress,
+    onLayout: props.onLayout,
+    onLongPress: props.onLongPress,
+    style: [styles.container, props.style, props.align && {
+      alignItems: props.align
+    }],
+    children: [props.prefix, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index3.Flex, {
+      vertical: true,
+      gap: 4,
+      align: "flex-start",
+      justify: "flex-start",
+      style: [styles.contentContainer, props.contentContainerStyle],
+      children: [(0, _index2.safetyRenderChildren)(props.title, title => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.Text, {
+        size: 16,
+        style: props.titleStyle,
+        color: theme.palette.fontGray1,
+        numberOfLines: titleNumberOfLines,
+        children: title
+      })), (0, _index2.safetyRenderChildren)(props.description, description => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.Text, {
+        size: 14,
+        style: props.descriptionStyle,
+        color: theme.palette.fontGray3,
+        numberOfLines: descriptionNumberOfLines,
+        children: description
+      }))]
+    }), !!showRightContent && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [!!props.extra && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: [styles.extra, props.extraStyle],
+        children: (0, _index2.safetyRenderChildren)(props.extra, content => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.Text, {
+          size: 14,
+          color: theme.palette.fontGray3,
+          numberOfLines: 1,
+          children: content
+        }))
+      }), !!props.showArrow && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: styles.arrow,
+        children: props.renderArrowIcon?.() ?? /*#__PURE__*/(0, _jsxRuntime.jsx)(_svgIcons.RightOutlined, {
+          size: 16,
+          color: theme.palette.fontGray4
+        })
+      })]
+    }), !!bordered && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: [styles.bordered, borderedInset, {
+        backgroundColor: borderedColor ?? theme.palette.blueGray3
+      }]
+    })]
+  });
+};
+exports.Cell = Cell;

package/dist/commonjs/components/base/cell/index.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  Cell: true
+};
+exports.Cell = void 0;
+var _cell = require("./cell.js");
+Object.keys(_cell).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _cell[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _cell[key];
+    }
+  });
+});
+var _cellGroup = require("./cell-group.js");
+Object.keys(_cellGroup).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _cellGroup[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _cellGroup[key];
+    }
+  });
+});
+const Cell = exports.Cell = Object.assign(_cell.Cell, {
+  Group: _cellGroup.CellGroup
+});

package/dist/commonjs/components/base/cell/style/index.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useGroupStyles = exports.useCellStyles = void 0;
+var _index = require("../../../../native-provider/index.js");
+const useCellStyles = exports.useCellStyles = (0, _index.createThemedStyles)(theme => ({
+  container: {
+    width: '100%',
+    padding: 16,
+    gap: theme.spacing.sm,
+    position: 'relative',
+    display: 'flex',
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    borderBottomWidth: 1,
+    borderBottomColor: 'transparent',
+    backgroundColor: theme.palette.white
+  },
+  contentContainer: {
+    flex: 1
+  },
+  bordered: {
+    height: 1,
+    insetInline: 16,
+    insetBlockEnd: 0,
+    position: 'absolute'
+  },
+  extra: {
+    flex: 1,
+    display: 'flex',
+    flexDirection: 'row',
+    justifyContent: 'flex-end'
+  },
+  arrow: {
+    flexGrow: 0,
+    flexShrink: 0,
+    flexBasis: 'auto'
+  }
+}));
+const useGroupStyles = exports.useGroupStyles = (0, _index.createThemedStyles)(theme => ({
+  container: {
+    width: '100%'
+  },
+  title: {
+    marginBottom: 6
+  },
+  contentContainer: {
+    flex: 1,
+    overflow: 'hidden'
+  },
+  card: {
+    borderRadius: theme.roundness.xl
+  }
+}));