@omit-design/preset-mobile 0.2.1 → 0.2.3

package/components/OmDialog.tsx

@@ -39,7 +39,7 @@ export function OmDialog({
   iconColor = "primary",
   title,
   subtitle,
-  confirmText = "知道了",
+  confirmText = "OK",
   confirmColor = "primary",
   confirmHref,
   onConfirm,
@@ -81,7 +81,7 @@ export function OmDialog({
             <>
               {hasCancel && (
                 <OmButton variant="outline" color="medium" onClick={handleCancel}>
-                  {cancelText ?? "取消"}
+                  {cancelText ?? "Cancel"}
                 </OmButton>
               )}
               <OmButton color={confirmColor} onClick={handleConfirm}>

package/components/OmNumpad.tsx

@@ -63,14 +63,14 @@ export function OmNumpad({
       {/* 右下角 */}
       {clearMode ? (
         <button className="om-numpad__key pos-numpad__key--clear" type="button" onClick={() => onClear?.()}>
-          清空
+          Clear
         </button>
       ) : showBackspace ? (
         <button
           className="om-numpad__key pos-numpad__key--ghost"
           type="button"
           onClick={() => onBackspace?.()}
-          aria-label="退格"
+          aria-label="Backspace"
         >
           <IonIcon icon={backspaceOutline} />
         </button>

package/components/OmOrderFooter.tsx

@@ -43,7 +43,7 @@ export function OmOrderFooter({
         className="om-order-footer__cart"
         type="button"
         onClick={onCartClick}
-        aria-label="购物车"
+        aria-label="Cart"
       >
         <IonIcon icon={cartOutline} />
         {typeof cartCount === "number" && cartCount > 0 && (
@@ -55,7 +55,7 @@ export function OmOrderFooter({
         <button className="om-order-footer__discount" type="button" onClick={onDiscountClick}>
           <span className="om-order-footer__discount-amount">{discountLabel}</span>
           <span className="om-order-footer__discount-label">
-            优惠明细
+            Discount details
             <IonIcon icon={chevronForward} aria-hidden />
           </span>
         </button>

package/components/OmProductCard.tsx

@@ -55,12 +55,12 @@ export function OmProductCard({
               <span className="om-product__price-value">{price.toFixed(2)}</span>
             </span>
             <span className="om-product__unit">/{unit}</span>
-            <span className="om-product__stock">库存{stock}</span>
+            <span className="om-product__stock">Stock {stock}</span>
           </div>
           <button
             className="om-product__add"
             type="button"
-            aria-label={`加购 ${name}`}
+            aria-label={`Add ${name}`}
             onClick={(e) => {
               e.stopPropagation();
               onAdd?.();

package/components/OmSearchBar.tsx

@@ -22,7 +22,7 @@ interface OmSearchBarProps {
  */
 export function OmSearchBar({
   value,
-  placeholder = "搜索",
+  placeholder = "Search",
   onChange,
   onFocus,
   trailing,

package/components/OmSheet.tsx

@@ -37,7 +37,7 @@ export function OmSheet({ title, children, onDismiss, dismissHref, size = "auto"
         {title && (
           <div className="om-sheet__head">
             <span className="om-sheet__title">{title}</span>
-            <button className="om-sheet__close" type="button" onClick={dismiss} aria-label="关闭">
+            <button className="om-sheet__close" type="button" onClick={dismiss} aria-label="Close">
               <IonIcon icon={closeOutline} />
             </button>
           </div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omit-design/preset-mobile",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "type": "module",
   "description": "Mobile design preset for omit-design: Om* whitelist components, --om-* / --ion-* token map, Ionic 8 runtime.",
   "main": "./index.ts",
@@ -26,6 +26,7 @@
     "preset.manifest.ts",
     "catalog.tsx",
     "PATTERNS.md",
+    "patterns.config.json",
     "README.md"
   ],
   "license": "MIT",

package/patterns.config.json

@@ -0,0 +1,13 @@
+{
+  "$schema": "./patterns.schema.json",
+  "patterns": {
+    "list-view": ["OmListRow", "OmCouponCard", "OmSettingRow", "OmProductCard", "OmMenuCard", "OmEmptyState"],
+    "detail-view": ["OmCard"],
+    "form-view": ["OmInput", "OmSelect", "OmNumpad"],
+    "sheet-action": ["OmSheet"],
+    "dialog-view": ["OmDialog"],
+    "welcome-view": ["OmButton"],
+    "dashboard": ["OmStatCard", "OmMenuCard"],
+    "tab-view": ["OmTabBar"]
+  }
+}

package/templates/dashboard.tmpl.tsx

@@ -5,9 +5,9 @@
 //   3. 给 TILES 加合适 ionicons + href
 
 export const meta = {
-  name: "TODO 工作台",
+  name: "TODO Dashboard",
   pattern: "dashboard",
-  description: "TODO 一句话描述",
+  description: "TODO one-line description",
   source: "prd",
 } as const;
 
@@ -41,13 +41,13 @@ interface Tile {
 
 // TODO: 替换为真实 mock import
 const STATS: Stat[] = [
-  { label: "今日营收", value: "¥0.00", caption: "含已结金额" },
-  { label: "客单量", value: "0", caption: "单数" },
+  { label: "Today's revenue", value: "$0.00", caption: "Includes settled amount" },
+  { label: "Order count", value: "0", caption: "orders" },
 ];
 
 const TILES: Tile[] = [
   { id: "pos", icon: cashOutline, label: "POS", href: "/designs/TODO" },
-  { id: "orders", icon: receiptOutline, label: "订单", href: "/designs/TODO" },
+  { id: "orders", icon: receiptOutline, label: "Orders", href: "/designs/TODO" },
 ];
 
 export function TodoDashboardPage() {
@@ -56,7 +56,7 @@ export function TodoDashboardPage() {
       padding="lg"
       header={
         <OmHeader
-          title="TODO 工作台"
+          title="TODO Dashboard"
           start={<IonBackButton defaultHref="/designs/TODO-from" />}
         />
       }

package/templates/detail-view.tmpl.tsx

@@ -6,9 +6,9 @@
 //   4. 主操作改成业务跳转
 
 export const meta = {
-  name: "TODO 详情页名",
+  name: "TODO Detail page",
   pattern: "detail-view",
-  description: "TODO 一句话描述",
+  description: "TODO one-line description",
   source: "prd",
 } as const;
 
@@ -30,9 +30,9 @@ interface Record {
 // TODO: 替换为真实 mock import
 const RECORD: Record = {
   id: "TODO",
-  title: "示例标题",
+  title: "Sample title",
   amount: 0,
-  status: "TODO 状态",
+  status: "TODO status",
 };
 
 export function TodoDetailPage() {
@@ -41,19 +41,19 @@ export function TodoDetailPage() {
       padding="lg"
       header={
         <OmHeader
-          title="TODO 详情"
+          title="TODO Detail"
           start={<IonBackButton defaultHref="/designs/TODO" />}
         />
       }
     >
       <OmCard title={RECORD.title} subtitle={`#${RECORD.id}`}>
-        <p>金额:¥{RECORD.amount.toFixed(2)}</p>
-        <p>状态:{RECORD.status}</p>
+        <p>Amount: ${RECORD.amount.toFixed(2)}</p>
+        <p>Status: {RECORD.status}</p>
       </OmCard>
 
       {/* TODO: 关联信息分块 —— 增加更多 OmCard */}
 
-      <OmButton expand="block">主操作</OmButton>
+      <OmButton expand="block">Primary action</OmButton>
     </OmPage>
   );
 }

package/templates/dialog-view.tmpl.tsx

@@ -6,9 +6,9 @@
 //   4. iconColor / confirmColor 按场景设(danger / warning / success / primary)
 
 export const meta = {
-  name: "TODO 对话框",
+  name: "TODO Dialog",
   pattern: "dialog-view",
-  description: "TODO 一句话描述",
+  description: "TODO one-line description",
   source: "prd",
 } as const;
 
@@ -21,11 +21,11 @@ export function TodoDialogPage() {
       <OmDialog
         icon={informationCircleOutline}
         iconColor="primary"
-        title="TODO 标题"
-        subtitle="TODO 副标题描述。"
-        cancelText="取消"
+        title="TODO Title"
+        subtitle="TODO subtitle description."
+        cancelText="Cancel"
         cancelHref="/designs/TODO-from"
-        confirmText="确认"
+        confirmText="Confirm"
         confirmHref="/designs/TODO-next"
       />
     </OmPage>

package/templates/form-view.tmpl.tsx

@@ -6,9 +6,9 @@
 //   4. IonBackButton defaultHref 改成上一级
 
 export const meta = {
-  name: "TODO 表单页名",
+  name: "TODO Form page",
   pattern: "form-view",
-  description: "TODO 一句话描述",
+  description: "TODO one-line description",
   source: "prd",
 } as const;
 
@@ -32,19 +32,19 @@ export function TodoFormPage() {
       padding="lg"
       header={
         <OmHeader
-          title="TODO 表单"
+          title="TODO Form"
           start={<IonBackButton defaultHref="/designs/TODO" />}
         />
       }
     >
-      <OmInput label="字段一" value={field1} onChange={setField1} />
-      <OmInput label="字段二" value={field2} onChange={setField2} />
+      <OmInput label="Field one" value={field1} onChange={setField1} />
+      <OmInput label="Field two" value={field2} onChange={setField2} />
 
       <OmButton
         expand="block"
         onClick={() => navigate("/designs/TODO-next")}
       >
-        提交
+        Submit
       </OmButton>
     </OmPage>
   );

package/templates/list-view.tmpl.tsx

@@ -6,9 +6,9 @@
 //   4. 调整空态文案
 
 export const meta = {
-  name: "TODO 列表页名",
+  name: "TODO List page",
   pattern: "list-view",
-  description: "TODO 一句话描述",
+  description: "TODO one-line description",
   source: "prd",
 } as const;
 
@@ -28,8 +28,8 @@ interface Item {
 
 // TODO: 替换为 import { items } from ""./mock/<group>" 相对路径";
 const ITEMS: Item[] = [
-  { id: "1", title: "示例条目 1", detail: "副信息" },
-  { id: "2", title: "示例条目 2" },
+  { id: "1", title: "Sample item 1", detail: "Subinfo" },
+  { id: "2", title: "Sample item 2" },
 ];
 
 export function TodoListPage() {
@@ -38,13 +38,13 @@ export function TodoListPage() {
       padding="none"
       header={
         <OmHeader
-          title="TODO 标题"
+          title="TODO Title"
           start={<IonBackButton defaultHref="/designs/TODO" />}
         />
       }
     >
       {ITEMS.length === 0 ? (
-        <OmEmptyState title="暂无数据" description="TODO 空态描述" />
+        <OmEmptyState title="No data" description="TODO empty-state description" />
       ) : (
         <IonList lines="none">
           {ITEMS.map((it) => (

package/templates/sheet-action.tmpl.tsx

@@ -5,9 +5,9 @@
 //   3. dismissHref 改成来源页路径
 
 export const meta = {
-  name: "TODO 操作菜单",
+  name: "TODO Action menu",
   pattern: "sheet-action",
-  description: "TODO 一句话描述",
+  description: "TODO one-line description",
   source: "prd",
 } as const;
 
@@ -24,15 +24,15 @@ interface MenuItem {
 }
 
 const ITEMS: MenuItem[] = [
-  { label: "TODO 项一", icon: ellipsisHorizontalOutline, href: "/designs/TODO" },
-  { label: "TODO 项二", icon: ellipsisHorizontalOutline, href: "/designs/TODO" },
+  { label: "TODO Item one", icon: ellipsisHorizontalOutline, href: "/designs/TODO" },
+  { label: "TODO Item two", icon: ellipsisHorizontalOutline, href: "/designs/TODO" },
 ];
 
 export function TodoSheetActionPage() {
   const navigate = useNavigate();
   return (
     <OmPage padding="none">
-      <OmSheet title="TODO 标题" dismissHref="/designs/TODO-from">
+      <OmSheet title="TODO Title" dismissHref="/designs/TODO-from">
         <div>
           {ITEMS.map((it) => (
             <button

package/templates/tab-view.tmpl.tsx

@@ -8,9 +8,9 @@
 // 本 template 展示扁平结构,首批落地后可重构为 shell。
 
 export const meta = {
-  name: "TODO Tab 页",
+  name: "TODO Tab page",
   pattern: "tab-view",
-  description: "TODO 一句话描述",
+  description: "TODO one-line description",
   source: "prd",
 } as const;
 
@@ -28,21 +28,21 @@ import {
 } from "@omit-design/preset-mobile";
 
 const TABS: OmTabItem[] = [
-  { tab: "stored", href: "/designs/TODO-stored", label: "寄存", icon: cubeOutline },
-  { tab: "orders", href: "/designs/TODO-orders", label: "订单", icon: receiptOutline },
-  { tab: "member", href: "/designs/TODO-member", label: "会员", icon: peopleOutline },
-  { tab: "settings", href: "/designs/TODO-settings", label: "设置", icon: settingsOutline },
+  { tab: "stored", href: "/designs/TODO-stored", label: "Stored", icon: cubeOutline },
+  { tab: "orders", href: "/designs/TODO-orders", label: "Orders", icon: receiptOutline },
+  { tab: "member", href: "/designs/TODO-member", label: "Members", icon: peopleOutline },
+  { tab: "settings", href: "/designs/TODO-settings", label: "Settings", icon: settingsOutline },
 ];
 
 export function TodoTabPage() {
   return (
     <OmPage
       padding="lg"
-      header={<OmAppBar variant="brand" brandTitle="TODO 品牌" />}
+      header={<OmAppBar variant="brand" brandTitle="TODO Brand" />}
     >
       <div>
         {/* TODO: 主体内容 —— 表单 / 列表 / 空态 */}
-        <h1>TODO Tab 页主体</h1>
+        <h1>TODO Tab page body</h1>
       </div>
       <OmTabBar items={TABS} />
     </OmPage>

package/templates/welcome-view.tmpl.tsx

@@ -6,9 +6,9 @@
 //   4. tagline / version 走 mock 或常量
 
 export const meta = {
-  name: "TODO 欢迎页",
+  name: "TODO Welcome page",
   pattern: "welcome-view",
-  description: "TODO 一句话描述",
+  description: "TODO one-line description",
   source: "prd",
 } as const;
 
@@ -23,14 +23,14 @@ export function TodoWelcomePage() {
       {/* TODO: 替换为品牌 logo 组件 */}
       <div>
         <h1>Welcome</h1>
-        <p>TODO 欢迎语</p>
+        <p>TODO welcome message</p>
       </div>
 
       <OmButton
         expand="block"
         onClick={() => navigate("/designs/TODO-next")}
       >
-        开始
+        Get started
       </OmButton>
     </OmPage>
   );