@v-miniapp/ui-react 1.0.45 → 1.0.47

package/dist-storybook/project.json

@@ -1 +1 @@
-{"generatedAt":1770018362811,"hasCustomBabel":false,"hasCustomWebpack":false,"hasStaticDirs":false,"hasStorybookEslint":true,"refCount":0,"testPackages":{"@storybook/addon-vitest":"9.1.16","@vitest/browser":"3.2.4","@vitest/coverage-v8":"3.2.4","playwright":"1.57.0","vitest":"3.2.4"},"hasRouterPackage":false,"packageManager":{"type":"pnpm","version":"10.20.0","agent":"pnpm","nodeLinker":"undefined"},"preview":{"usesGlobals":true},"framework":{"name":"@storybook/react-vite","options":{}},"builder":"@storybook/builder-vite","renderer":"@storybook/react","portableStoriesFileCount":0,"applicationFileCount":57,"storybookVersion":"9.1.17","language":"typescript","storybookPackages":{"@storybook/addon-vitest":{"version":"9.1.16"},"@storybook/react-vite":{"version":"9.1.16"},"eslint-plugin-storybook":{"version":"9.1.16"},"storybook":{"version":"9.1.17"}},"addons":{"@storybook/addon-docs":{"version":"9.1.16"},"@storybook/addon-a11y":{"version":"9.1.16"}}}
+{"generatedAt":1770364548615,"hasCustomBabel":false,"hasCustomWebpack":false,"hasStaticDirs":false,"hasStorybookEslint":true,"refCount":0,"testPackages":{"@storybook/addon-vitest":"9.1.16","@vitest/browser":"3.2.4","@vitest/coverage-v8":"3.2.4","playwright":"1.57.0","vitest":"3.2.4"},"hasRouterPackage":false,"packageManager":{"type":"pnpm","version":"10.20.0","agent":"pnpm","nodeLinker":"undefined"},"preview":{"usesGlobals":true},"framework":{"name":"@storybook/react-vite","options":{}},"builder":"@storybook/builder-vite","renderer":"@storybook/react","portableStoriesFileCount":0,"applicationFileCount":57,"storybookVersion":"9.1.17","language":"typescript","storybookPackages":{"@storybook/addon-vitest":{"version":"9.1.16"},"@storybook/react-vite":{"version":"9.1.16"},"eslint-plugin-storybook":{"version":"9.1.16"},"storybook":{"version":"9.1.17"}},"addons":{"@storybook/addon-docs":{"version":"9.1.16"},"@storybook/addon-a11y":{"version":"9.1.16"}}}

package/dist-storybook/stories-data.json

@@ -11,12 +11,6 @@
     "subtitle": "Cấu hình bottom tab bar cho ứng dụng Mini App.",
     "content": "Bottom Tab Bar Config cho phép cấu hình bottom tab bar với các items, styling và behavior. IAppBottomTabBarState extends IBottomTabBarProps và thêm items với path và hidden property."
   },
-  {
-    "id": "app-framework-dark-mode--docs",
-    "title": "App Framework/Dark Mode",
-    "subtitle": "Cấu hình dark mode cho ứng dụng Mini App.",
-    "content": "Dark Mode Config cho phép cấu hình dark mode mặc định cho ứng dụng. IDarkModeConfig có defaultEnabled để bật/tắt dark mode mặc định."
-  },
   {
     "id": "app-framework-general--docs",
     "title": "App Framework/General",
@@ -53,6 +47,12 @@
     "subtitle": "Hệ thống routing và navigation cung cấp các hooks và utilities để quản lý navigation và lifecycle events.",
     "content": "Routing & Navigation sử dụng exact path matching. Navigation được thực hiện qua function navigate từ hook useNavigate. Có thể navigate bằng pathname hoặc delta. Các hooks bao gồm useNavigate, useLocation, useHistory, useHistories, usePageState, usePageConfig, usePageScroll, useNavigationType, useDidShow, useDidHide, useAppPause, useAppResume, useCustomIconEvent và useSettingsChanged."
   },
+  {
+    "id": "app-framework-theme-mode--docs",
+    "title": "App Framework/Theme Mode",
+    "subtitle": "Cấu hình theme cho ứng dụng Mini App.",
+    "content": "Theme Config cho phép cấu hình theme mặc định cho ứng dụng. IThemeConfig có defaultMode để thiết lập theme mặc định (light, dark, hoặc system)."
+  },
   {
     "id": "components-alert--docs",
     "title": "Components/Alert",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@v-miniapp/ui-react",
-  "version": "1.0.45",
+  "version": "1.0.47",
   "type": "module",
   "files": [
     "dist",

package/dist-storybook/assets/DARK_MODE-CoHseCDO.js

@@ -1,57 +0,0 @@
-import{j as n}from"./iframe-CQAwSt4E.js";import{useMDXComponents as h}from"./index-CgMRTj-o.js";import{b as c,M as o}from"./blocks-BuaOUtiH.js";import"./preload-helper-PPVm8Dsz.js";import"./index-DHiZ-gXR.js";function t(d){const e={code:"code",h1:"h1",h2:"h2",h3:"h3",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...h(),...d.components};return n.jsxs(n.Fragment,{children:[`
-`,`
-`,n.jsx(c,{title:"App Framework/Dark Mode"}),`
-`,n.jsx(e.h1,{id:"dark-mode",children:"Dark Mode"}),`
-`,n.jsx(e.p,{children:"Dark Mode config cho phép bạn cấu hình dark mode mặc định cho ứng dụng."}),`
-`,n.jsx(e.h2,{id:"cấu-trúc",children:"Cấu trúc"}),`
-`,n.jsx(e.pre,{children:n.jsx(e.code,{className:"language-typescript",children:`type IDarkModeConfig = {
-  defaultEnabled?: boolean
-}
-`})}),`
-`,n.jsx(e.h2,{id:"thuộc-tính",children:"Thuộc tính"}),`
-`,n.jsx(o,{children:"\n| Thuộc tính | Kiểu dữ liệu | Mặc định | Mô tả |\n| :--- | :--- | :--- | :--- |\n| `defaultEnabled` | `boolean` | `false` | Bật dark mode mặc định khi khởi động ứng dụng |\n"}),`
-`,n.jsx(e.h2,{id:"cách-hoạt-động",children:"Cách hoạt động"}),`
-`,n.jsxs(e.p,{children:["Khi ",n.jsx(e.code,{children:"defaultEnabled: true"}),", ứng dụng sẽ tự động set ",n.jsx(e.code,{children:'data-theme="dark"'})," trên ",n.jsx(e.code,{children:"document.documentElement"})," khi khởi động, áp dụng dark mode cho toàn bộ ứng dụng."]}),`
-`,n.jsx(e.h2,{id:"cấu-hình",children:"Cấu hình"}),`
-`,n.jsx(e.h3,{id:"app-level-config",children:"App-level Config"}),`
-`,n.jsx(e.p,{children:"Cấu hình dark mode mặc định:"}),`
-`,n.jsx(e.pre,{children:n.jsx(e.code,{className:"language-tsx",children:`const appConfig: IAppConfig = {
-  darkMode: {
-    defaultEnabled: true, // Bật dark mode mặc định
-  },
-  pages: [
-    // Tất cả pages sẽ hiển thị dark mode
-  ],
-}
-`})}),`
-`,n.jsx(e.h3,{id:"ví-dụ",children:"Ví dụ"}),`
-`,n.jsx(e.pre,{children:n.jsx(e.code,{className:"language-tsx",children:`const appConfig: IAppConfig = {
-  // Bật dark mode mặc định
-  darkMode: {
-    defaultEnabled: true,
-  },
-  pages: [
-    {
-      pathname: '/home',
-      Component: HomePage,
-    },
-    {
-      pathname: '/settings',
-      Component: SettingsPage,
-    },
-  ],
-}
-`})}),`
-`,n.jsx(e.h2,{id:"lưu-ý",children:"Lưu ý"}),`
-`,n.jsxs(e.ul,{children:[`
-`,n.jsxs(e.li,{children:["Dark mode config chỉ có ở ",n.jsx(e.strong,{children:"app-level"}),", không có ở page-level"]}),`
-`,n.jsxs(e.li,{children:["Khi ",n.jsx(e.code,{children:"defaultEnabled: true"}),", dark mode sẽ được áp dụng ngay khi ứng dụng khởi động"]}),`
-`,n.jsxs(e.li,{children:["Dark mode sử dụng CSS variables và ",n.jsx(e.code,{children:"data-theme"})," attribute để thay đổi theme"]}),`
-`,n.jsxs(e.li,{children:["Bạn có thể toggle dark mode động bằng cách thay đổi ",n.jsx(e.code,{children:"data-theme"})," attribute trên ",n.jsx(e.code,{children:"document.documentElement"}),":",`
-`,n.jsx(e.pre,{children:n.jsx(e.code,{className:"language-tsx",children:`// Toggle dark mode
-document.documentElement.setAttribute('data-theme', 'dark')
-// hoặc
-document.documentElement.setAttribute('data-theme', 'light')
-`})}),`
-`]}),`
-`]})]})}function m(d={}){const{wrapper:e}={...h(),...d.components};return e?n.jsx(e,{...d,children:n.jsx(t,{...d})}):t(d)}export{m as default};