├── .husky └── _ │ ├── husky.sh │ ├── pre-push │ ├── applypatch-msg │ ├── commit-msg │ ├── post-checkout │ ├── post-commit │ ├── post-merge │ ├── post-rewrite │ ├── pre-applypatch │ ├── pre-auto-gc │ ├── pre-commit │ ├── pre-rebase │ ├── post-applypatch │ ├── prepare-commit-msg │ └── h ├── .yarnrc ├── src ├── index.ts ├── components │ ├── index.ts │ ├── Button │ │ ├── index.ts │ │ ├── style │ │ │ └── index.module.less │ │ ├── Button.tsx │ │ └── Button.stories.tsx │ ├── Waterfall │ │ ├── index.ts │ │ ├── style │ │ │ ├── index.module.css │ │ │ └── index.module.less │ │ ├── Waterfall.stories.tsx │ │ ├── waterfallClass.ts │ │ └── Waterfall.tsx │ └── VirtualList │ │ ├── index.ts │ │ ├── style │ │ └── index.module.less │ │ └── VirtualList.stories.tsx ├── app.scss ├── utils │ └── index.ts ├── app.tsx ├── index.tsx └── api │ └── index.ts ├── .eslintignore ├── .prettierignore ├── storybook-static ├── sb-addons │ ├── links-2 │ │ ├── manager-bundle.js.LEGAL.txt │ │ └── manager-bundle.js │ ├── onboarding-1 │ │ └── manager-bundle.js.LEGAL.txt │ ├── interactions-11 │ │ └── manager-bundle.js.LEGAL.txt │ ├── essentials-actions-4 │ │ └── manager-bundle.js.LEGAL.txt │ ├── essentials-measure-8 │ │ ├── manager-bundle.js.LEGAL.txt │ │ └── manager-bundle.js │ ├── essentials-outline-9 │ │ ├── manager-bundle.js.LEGAL.txt │ │ └── manager-bundle.js │ ├── essentials-toolbars-7 │ │ ├── manager-bundle.js.LEGAL.txt │ │ └── manager-bundle.js │ ├── essentials-viewport-6 │ │ ├── manager-bundle.js.LEGAL.txt │ │ └── manager-bundle.js │ ├── essentials-backgrounds-5 │ │ ├── manager-bundle.js.LEGAL.txt │ │ └── manager-bundle.js │ ├── storybook-core-server-presets-0 │ │ ├── common-manager-bundle.js.LEGAL.txt │ │ └── common-manager-bundle.js │ ├── essentials-controls-3 │ │ └── manager-bundle.js.LEGAL.txt │ └── chromatic-com-storybook-10 │ │ └── manager-bundle.js.LEGAL.txt ├── assets │ ├── preview-B4GcaC1c.js │ ├── preview-CIRcjyVj.js │ ├── WithTooltip-Y7J54OF7-BCBFXpdY.js │ ├── syntaxhighlighter-JOJW2KGS-BMtj-dJ4.js │ ├── index-z5U8iC57.js │ ├── Button-DkS0gYk8.css │ ├── preview-DzbRFJg_.js │ ├── preview-iTGUmTy2.js │ ├── index-DrFu-skq.js │ ├── preview-Cv3rAi2i.js │ ├── preview-DIVHFgVG.js │ ├── entry-preview-Xn6uC1vK.js │ ├── index-B_J8iUie.js │ ├── Button.stories-Cl2MKhW5.js │ ├── preview-CwqMn10d.js │ ├── preview-DbT1mggi.js │ ├── iframe-CJ3QuUcW.js │ ├── index-BBkUAzwr.js │ ├── preview-Db4Idchh.js │ └── preview-BAz7FMXc.js ├── sb-common-assets │ ├── nunito-sans-bold.woff2 │ ├── nunito-sans-italic.woff2 │ ├── nunito-sans-regular.woff2 │ ├── nunito-sans-bold-italic.woff2 │ └── fonts.css ├── sb-manager │ ├── WithTooltip-Y7J54OF7-3AIPQNGM.js │ ├── index.js │ ├── syntaxhighlighter-JOJW2KGS-7BF26SBB.js │ ├── runtime.js │ ├── globals.js │ ├── chunk-XP3HGWTR.js │ ├── globals-runtime.js │ └── globals-module-info.js ├── project.json ├── index.json ├── favicon.svg ├── sb-preview │ └── globals.js └── index.html ├── .commitlintrc.js ├── javascript.png ├── CHANGELOG.md ├── .lintstagedrc.json ├── .storybook ├── preview.ts └── main.ts ├── scripts ├── config │ ├── webpack.prod.js │ ├── webpack.dev.js │ └── webpack.common.js ├── constants.js └── release.js ├── public_test └── index.html ├── postcss.config.js ├── .editorconfig ├── .babelrc ├── .prettierrc ├── .github └── workflows │ └── storybook.yml ├── .stylelintrc.js ├── LICENSE ├── rollup.config.mjs ├── typings └── file.d.ts ├── tsconfig.json ├── .cz-config.js ├── .eslintrc.js ├── .vscode └── settings.json ├── .gitignore ├── package.json └── README.md /.husky/_/husky.sh: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.yarnrc: -------------------------------------------------------------------------------- 1 | registry "https://registry.npmmirror.com" -------------------------------------------------------------------------------- /src/index.ts: -------------------------------------------------------------------------------- 1 | export * from './components'; 2 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | /node_modules 2 | /build 3 | /dist 4 | -------------------------------------------------------------------------------- /.husky/_/pre-push: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /src/components/index.ts: -------------------------------------------------------------------------------- 1 | export * from './Button'; 2 | -------------------------------------------------------------------------------- /.husky/_/applypatch-msg: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/commit-msg: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/post-checkout: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/post-commit: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/post-merge: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/post-rewrite: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/pre-applypatch: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/pre-auto-gc: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/pre-commit: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/pre-rebase: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | /node_modules 2 | /build 3 | /dist 4 | -------------------------------------------------------------------------------- /.husky/_/post-applypatch: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /.husky/_/prepare-commit-msg: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "${0%/*}/h" -------------------------------------------------------------------------------- /src/components/Button/index.ts: -------------------------------------------------------------------------------- 1 | export * from "./Button"; 2 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/links-2/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/components/Waterfall/index.ts: -------------------------------------------------------------------------------- 1 | export * from './Waterfall'; 2 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/onboarding-1/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/components/VirtualList/index.ts: -------------------------------------------------------------------------------- 1 | export * from './VirtualList'; 2 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/interactions-11/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-actions-4/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-measure-8/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-outline-9/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-toolbars-7/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-viewport-6/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-backgrounds-5/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.commitlintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: ['cz'], 3 | rules: {}, 4 | }; 5 | -------------------------------------------------------------------------------- /javascript.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ObjectX-9/react_demo/HEAD/javascript.png -------------------------------------------------------------------------------- /src/app.scss: -------------------------------------------------------------------------------- 1 | #root { 2 | display: flex; 3 | background-color: aquamarine; 4 | } 5 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/storybook-core-server-presets-0/common-manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /storybook-static/assets/preview-B4GcaC1c.js: -------------------------------------------------------------------------------- 1 | var e={viewport:"reset",viewportRotated:!1};export{e as globals}; 2 | -------------------------------------------------------------------------------- /storybook-static/assets/preview-CIRcjyVj.js: -------------------------------------------------------------------------------- 1 | const e={parameters:{controls:{matchers:{color:/(background|color)$/i,date:/Date$/i}}}};export{e as default}; 2 | -------------------------------------------------------------------------------- /storybook-static/sb-common-assets/nunito-sans-bold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ObjectX-9/react_demo/HEAD/storybook-static/sb-common-assets/nunito-sans-bold.woff2 -------------------------------------------------------------------------------- /storybook-static/sb-common-assets/nunito-sans-italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ObjectX-9/react_demo/HEAD/storybook-static/sb-common-assets/nunito-sans-italic.woff2 -------------------------------------------------------------------------------- /storybook-static/sb-common-assets/nunito-sans-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ObjectX-9/react_demo/HEAD/storybook-static/sb-common-assets/nunito-sans-regular.woff2 -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # 1.0.0 (2024-04-05) 2 | 3 | 4 | ### Features 5 | 6 | * 配置custom commitlint 95c381d 7 | * lint 750dadb 8 | * lint config file ea97d98 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /storybook-static/sb-common-assets/nunito-sans-bold-italic.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ObjectX-9/react_demo/HEAD/storybook-static/sb-common-assets/nunito-sans-bold-italic.woff2 -------------------------------------------------------------------------------- /.lintstagedrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "*.{ts,tsx,js}": ["eslint --config .eslintrc.js"], 3 | "*.{css,less,scss}": ["stylelint --config .stylelintrc.js"], 4 | "*.{ts,tsx,js,json,html,yml,css,less,scss,md}": ["prettier --write"] 5 | } 6 | -------------------------------------------------------------------------------- /src/utils/index.ts: -------------------------------------------------------------------------------- 1 | export const shuffleArray = (array: T[]): T[] => { 2 | for (let i = array.length - 1; i > 0; i--) { 3 | const j = Math.floor(Math.random() * (i + 1)); 4 | [array[i], array[j]] = [array[j], array[i]]; 5 | } 6 | return array; 7 | }; 8 | -------------------------------------------------------------------------------- /storybook-static/sb-manager/WithTooltip-Y7J54OF7-3AIPQNGM.js: -------------------------------------------------------------------------------- 1 | import{WithToolTipState,WithTooltipPure}from"./chunk-VMGB76WP.js";import"./chunk-UOBNU442.js";import"./chunk-XP3HGWTR.js";export{WithToolTipState,WithToolTipState as WithTooltip,WithTooltipPure}; 2 | -------------------------------------------------------------------------------- /storybook-static/sb-manager/index.js: -------------------------------------------------------------------------------- 1 | import{Provider,Root,renderStorybookUI}from"./chunk-O6NCVXC4.js";import"./chunk-RHK3WMPG.js";import"./chunk-TZAR34JC.js";import"./chunk-VMGB76WP.js";import"./chunk-UOBNU442.js";import"./chunk-XP3HGWTR.js";export{Provider,Root,renderStorybookUI}; 2 | -------------------------------------------------------------------------------- /.storybook/preview.ts: -------------------------------------------------------------------------------- 1 | import type {Preview} from '@storybook/react'; 2 | 3 | const preview: Preview = { 4 | parameters: { 5 | controls: { 6 | matchers: { 7 | color: /(background|color)$/i, 8 | date: /Date$/i, 9 | }, 10 | }, 11 | }, 12 | }; 13 | 14 | export default preview; 15 | -------------------------------------------------------------------------------- /scripts/config/webpack.prod.js: -------------------------------------------------------------------------------- 1 | const {merge} = require('webpack-merge'); 2 | const common = require('./webpack.common.js'); 3 | const {CleanWebpackPlugin} = require('clean-webpack-plugin'); 4 | 5 | const PLUGINS = [new CleanWebpackPlugin()]; 6 | module.exports = merge(common, { 7 | plugins: PLUGINS, 8 | }); 9 | -------------------------------------------------------------------------------- /public_test/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | React18 + Ts5 + webpack5 开发模板搭建 7 | 8 | 9 |
10 | 11 | 12 | -------------------------------------------------------------------------------- /storybook-static/sb-manager/syntaxhighlighter-JOJW2KGS-7BF26SBB.js: -------------------------------------------------------------------------------- 1 | import{SyntaxHighlighter2,createCopyToClipboardFunction,supportedLanguages,syntaxhighlighter_default}from"./chunk-TZAR34JC.js";import"./chunk-UOBNU442.js";import"./chunk-XP3HGWTR.js";export{SyntaxHighlighter2 as SyntaxHighlighter,createCopyToClipboardFunction,syntaxhighlighter_default as default,supportedLanguages}; 2 | -------------------------------------------------------------------------------- /src/components/Waterfall/style/index.module.css: -------------------------------------------------------------------------------- 1 | .container { 2 | display: flex; 3 | flex-direction: column; 4 | justify-content: center; 5 | } 6 | .container .item { 7 | display: block; 8 | width: 100px; 9 | object-fit: contain; 10 | overflow: hidden; 11 | aspect-ratio: 1 / 1; 12 | border: 1px solid #ccc; 13 | border-radius: 10px; 14 | margin: 10px; 15 | } 16 | -------------------------------------------------------------------------------- /storybook-static/assets/WithTooltip-Y7J54OF7-BCBFXpdY.js: -------------------------------------------------------------------------------- 1 | import{W as e,W as h,b as l}from"./DocsRenderer-K4EAMTCU-CK-tx-z6.js";import"./iframe-CJ3QuUcW.js";import"../sb-preview/runtime.js";import"./index-BBkUAzwr.js";import"./react-18-DHj1n7xi.js";import"./index-B_J8iUie.js";import"./_getPrototype-BVQBtff3.js";import"./index-DrFu-skq.js";export{e as WithToolTipState,h as WithTooltip,l as WithTooltipPure}; 2 | -------------------------------------------------------------------------------- /scripts/constants.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | const PROJECT_PATH = path.resolve(__dirname, '../'); 3 | const PROJECT_NAME = path.parse(PROJECT_PATH).name; 4 | const isDev = process.env.NODE_ENV !== 'production'; 5 | const SERVER_HOST = '127.0.0.1'; 6 | const SERVER_PORT = 9000; 7 | module.exports = { 8 | SERVER_HOST, 9 | SERVER_PORT, 10 | PROJECT_PATH, 11 | PROJECT_NAME, 12 | isDev, 13 | }; 14 | -------------------------------------------------------------------------------- /src/app.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import img from '../javascript.png'; 3 | import './app.scss'; 4 | import {Button} from '@components/Button/Button'; 5 | function App() { 6 | return ( 7 | <> 8 | 52 | ); 53 | }; 54 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | // 基本配置 4 | "target": "ES5", // 编译成哪个版本的 es 5 | "module": "ESNext", // 指定生成哪个模块系统代码 6 | "lib": ["dom", "dom.iterable", "esnext"], // 编译过程中需要引入的库文件的列表 7 | "allowJs": true, // 允许编译 js 文件 8 | "jsx": "react", // 在 .tsx 文件里支持 JSX 9 | "isolatedModules": true, 10 | "strict": true, // 启用所有严格类型检查选项 11 | 12 | // 模块解析选项 13 | "moduleResolution": "node", // 指定模块解析策略 14 | "esModuleInterop": true, // 支持 CommonJS 和 ES 模块之间的互操作性 15 | "resolveJsonModule": true, // 支持导入 json 模块 16 | "baseUrl": "./", // 根路径 17 | "paths": { 18 | // 路径映射，与 baseUrl 关联 19 | "@src/*": ["src/*"], 20 | "@components/*": ["src/components/*"], 21 | "@utils/*": ["src/utils/*"] 22 | }, 23 | 24 | // 实验性选项 25 | "experimentalDecorators": true, // 启用实验性的ES装饰器 26 | "emitDecoratorMetadata": true, // 给源码里的装饰器声明加上设计类型元数据 27 | 28 | // 其他选项 29 | "forceConsistentCasingInFileNames": true, // 禁止对同一个文件的不一致的引用 30 | "skipLibCheck": true, // 忽略所有的声明文件（ *.d.ts）的类型检查 31 | "allowSyntheticDefaultImports": true, // 允许从没有设置默认导出的模块中默认导入 32 | "noEmit": true // 只想使用tsc的类型检查作为函数时（当其他工具（例如Babel实际编译）时）使用它 33 | }, 34 | "include": [ 35 | "src/**/*", // 这将包括 src 目录下的所有文件 36 | "typings/**/*" 37 | ] 38 | } 39 | -------------------------------------------------------------------------------- /storybook-static/assets/entry-preview-Xn6uC1vK.js: -------------------------------------------------------------------------------- 1 | import{R as o,r as i}from"./index-BBkUAzwr.js";import{u as c,r as h}from"./react-18-DHj1n7xi.js";var u=Object.defineProperty,E=(e,r)=>{for(var t in r)u(e,t,{get:r[t],enumerable:!0})};const{global:_}=__STORYBOOK_MODULE_GLOBAL__;var f={};E(f,{parameters:()=>w,render:()=>v,renderToCanvas:()=>g});var v=(e,r)=>{let{id:t,component:n}=r;if(!n)throw new Error(`Unable to render story ${t} as the component annotation is missing from the default export`);return o.createElement(n,{...e})},{FRAMEWORK_OPTIONS:s}=_,x=class extends i.Component{constructor(){super(...arguments),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidMount(){let{hasError:e}=this.state,{showMain:r}=this.props;e||r()}componentDidCatch(e){let{showException:r}=this.props;r(e)}render(){let{hasError:e}=this.state,{children:r}=this.props;return e?null:r}},m=s!=null&&s.strictMode?i.StrictMode:i.Fragment;async function g({storyContext:e,unboundStoryFn:r,showMain:t,showException:n,forceRemount:d},a){let p=o.createElement(x,{showMain:t,showException:n},o.createElement(r,{...e})),l=m?o.createElement(m,null,p):p;return d&&c(a),await h(l,a),()=>c(a)}var w={renderer:"react"};export{w as parameters,v as render,g as renderToCanvas}; 2 | -------------------------------------------------------------------------------- /storybook-static/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/components/Button/Button.stories.tsx: -------------------------------------------------------------------------------- 1 | import type { Meta, StoryObj } from "@storybook/react"; 2 | import { fn } from "@storybook/test"; 3 | import { Button } from "./Button"; 4 | 5 | const meta = { 6 | title: "通用/Button", 7 | component: Button, 8 | parameters: { 9 | layout: "centered", 10 | }, 11 | tags: ["autodocs"], 12 | // More on argTypes: https://storybook.js.org/docs/api/argtypes 13 | argTypes: { 14 | backgroundColor: { control: "color" }, 15 | }, 16 | // Use `fn` to spy on the onClick arg, which will appear in the actions panel once invoked: https://storybook.js.org/docs/essentials/actions#action-args 17 | args: { onClick: fn() }, 18 | } satisfies Meta; 19 | 20 | export default meta; 21 | type Story = StoryObj; 22 | 23 | // More on writing stories with args: https://storybook.js.org/docs/writing-stories/args 24 | export const Primary: Story = { 25 | args: { 26 | primary: true, 27 | label: "Button", 28 | }, 29 | }; 30 | 31 | export const Secondary: Story = { 32 | args: { 33 | label: "Button", 34 | }, 35 | }; 36 | 37 | export const Large: Story = { 38 | args: { 39 | size: "large", 40 | label: "Button", 41 | }, 42 | }; 43 | 44 | export const Small: Story = { 45 | args: { 46 | size: "small", 47 | label: "Button", 48 | }, 49 | }; 50 | -------------------------------------------------------------------------------- /storybook-static/sb-preview/globals.js: -------------------------------------------------------------------------------- 1 | "use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var globals_exports={};__export(globals_exports,{globalPackages:()=>globalPackages,globalsNameReferenceMap:()=>globalsNameReferenceMap});module.exports=__toCommonJS(globals_exports);var globalsNameReferenceMap={"@storybook/global":"__STORYBOOK_MODULE_GLOBAL__","@storybook/channels":"__STORYBOOK_MODULE_CHANNELS__","@storybook/client-logger":"__STORYBOOK_MODULE_CLIENT_LOGGER__","@storybook/core-events":"__STORYBOOK_MODULE_CORE_EVENTS__","@storybook/core-events/preview-errors":"__STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS__","@storybook/preview-api":"__STORYBOOK_MODULE_PREVIEW_API__","@storybook/types":"__STORYBOOK_MODULE_TYPES__"},globalPackages=Object.keys(globalsNameReferenceMap);0&&(module.exports={globalPackages,globalsNameReferenceMap}); 2 | -------------------------------------------------------------------------------- /storybook-static/sb-manager/globals.js: -------------------------------------------------------------------------------- 1 | var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var globals_exports={};__export(globals_exports,{globalPackages:()=>globalPackages,globalsNameReferenceMap:()=>globalsNameReferenceMap});module.exports=__toCommonJS(globals_exports);var globalsNameReferenceMap={react:"__REACT__","react-dom":"__REACT_DOM__","@storybook/components":"__STORYBOOK_COMPONENTS__","@storybook/channels":"__STORYBOOK_CHANNELS__","@storybook/core-events":"__STORYBOOK_CORE_EVENTS__","@storybook/core-events/manager-errors":"__STORYBOOK_CORE_EVENTS_MANAGER_ERRORS__","@storybook/router":"__STORYBOOK_ROUTER__","@storybook/theming":"__STORYBOOK_THEMING__","@storybook/icons":"__STORYBOOK_ICONS__","@storybook/manager-api":"__STORYBOOK_API__","@storybook/client-logger":"__STORYBOOK_CLIENT_LOGGER__","@storybook/types":"__STORYBOOK_TYPES__"},globalPackages=Object.keys(globalsNameReferenceMap);0&&(module.exports={globalPackages,globalsNameReferenceMap}); 2 | -------------------------------------------------------------------------------- /.cz-config.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | module.exports = { 3 | types: [ 4 | {value: '✨feat', name: '✨新增: 新的内容'}, 5 | {value: '🐛fix', name: '🐛修复: 修复一个Bug'}, 6 | {value: '📝docs', name: '📝文档: 变更的只有文档'}, 7 | {value: '💄style', name: '💄格式: 空格, 分号等格式修复'}, 8 | {value: '♻️refactor', name: '️♻️重构: 代码重构，注意和特性、修复区分开'}, 9 | {value: '⚡️perf', name: '️️⚡️性能: 提升性能'}, 10 | {value: '✅test', name: '✅测试: 添加一个测试'}, 11 | {value: '🔧build', name: '🔧工具: 开发工具变动(构建、脚手架工具等)'}, 12 | {value: '⏪rollback', name: '⏪回滚: 代码回退'}, 13 | {value: '👨🏻‍💻addLog', name: '👨🏻‍💻添加log: 增加log'}, 14 | ], 15 | scopes: [ 16 | {name: 'leetcode'}, 17 | {name: 'javascript'}, 18 | {name: 'typescript'}, 19 | {name: 'Vue'}, 20 | {name: 'node'}, 21 | ], 22 | // it needs to match the value for field type. Eg.: 'fix' 23 | /* scopeOverrides: { 24 | fix: [ 25 | {name: 'merge'}, 26 | {name: 'style'}, 27 | {name: 'e2eTest'}, 28 | {name: 'unitTest'} 29 | ] 30 | }, */ 31 | // override the messages, defaults are as follows 32 | messages: { 33 | type: '选择一种你的提交类型:', 34 | scope: '选择一个scope (可选):', 35 | // used if allowCustomScopes is true 36 | customScope: 'Denote the SCOPE of this change:', 37 | subject: '短说明:\n', 38 | body: '长说明，使用"|"换行(可选)：\n', 39 | breaking: '非兼容性说明 (可选):\n', 40 | footer: '关联关闭的issue，例如：#31, #34(可选):\n', 41 | confirmCommit: '确定提交说明?(yes/no)', 42 | }, 43 | allowCustomScopes: true, 44 | allowBreakingChanges: ['特性', '修复'], 45 | // limit subject length 46 | subjectLimit: 100, 47 | }; 48 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | const OFF = 0; 2 | const WARN = 1; 3 | const ERROR = 2; 4 | 5 | module.exports = { 6 | env: { 7 | browser: true, 8 | es2021: true, 9 | node: true, 10 | }, 11 | extends: [ 12 | 'standard-with-typescript', 13 | 'plugin:react/recommended', 14 | 'prettier', 15 | 'plugin:storybook/recommended', 16 | ], 17 | settings: { 18 | 'react': { 19 | 'version': 'detect', // 自动检测 React 版本 20 | }, 21 | // 这个配置是用于指定模块导入解析器的配置，主要用于告诉 ESLint 如何解析模块导入语句 22 | 'import/resolver': { 23 | // node：指定了使用 Node.js 解析模块导入语句的配置。在这里，配置了支持的文件扩展名，包括 .tsx、.ts、.js 和 .json。 24 | node: { 25 | extensions: ['.tsx', '.ts', '.js', '.json'], 26 | }, 27 | // typescript：指定了使用 TypeScript 解析模块导入语句的配置。这个配置为空对象，表示使用默认配置。 28 | typescript: {}, 29 | }, 30 | }, 31 | overrides: [ 32 | // 检测ts和tsx，注意files要包括文件，否则会报错 33 | { 34 | files: ['./src/**/*.ts', './src/**/*.tsx'], 35 | parser: '@typescript-eslint/parser', 36 | parserOptions: { 37 | sourceType: 'module', 38 | project: './tsconfig.json', // 指定 TypeScript 配置文件 39 | }, 40 | }, 41 | // 不检测js文件的类型, 有ignorePatterns就不需要了 42 | { 43 | extends: ['plugin:@typescript-eslint/disable-type-checked'], 44 | files: ['./**/*.js'], 45 | }, 46 | ], 47 | plugins: ['react'], 48 | rules: { 49 | // 对象的最后一个可以增加【,】 50 | '@typescript-eslint/comma-dangle': OFF, 51 | // 单引号关闭 52 | '@typescript-eslint/quotes': OFF, 53 | // 需要分号 54 | '@typescript-eslint/semi': OFF, 55 | // 不允许使用var 56 | 'no-var': ERROR, 57 | // 函数不需要ts标注返回类型 58 | '@typescript-eslint/explicit-function-return-type': OFF, 59 | 'no-tabs': OFF, 60 | '@typescript-eslint/indent': OFF, 61 | '@typescript-eslint/no-floating-promises': OFF, 62 | '@typescript-eslint/strict-boolean-expressions': OFF, 63 | }, 64 | // 忽略文件 65 | ignorePatterns: [ 66 | '/lib/**/*', // Ignore built files. 67 | '**/*.js', 68 | ], 69 | }; 70 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/chromatic-com-storybook-10/manager-bundle.js.LEGAL.txt: -------------------------------------------------------------------------------- 1 | Bundled license information: 2 | 3 | filesize/dist/filesize.esm.js: 4 | /** 5 | * filesize 6 | * 7 | * @copyright 2024 Jason Mulligan 8 | * @license BSD-3-Clause 9 | * @version 10.1.1 10 | */ 11 | 12 | @chromatic-com/storybook/dist/manager.mjs: 13 | /*! Bundled license information: 14 | 15 | popper.js/dist/esm/popper.js: 16 | (**! 17 | * @fileOverview Kickass library to create and place poppers near their reference elements. 18 | * @version 1.16.1 19 | * @license 20 | * Copyright (c) 2016 Federico Zivolo and contributors 21 | * 22 | * Permission is hereby granted, free of charge, to any person obtaining a copy 23 | * of this software and associated documentation files (the "Software"), to deal 24 | * in the Software without restriction, including without limitation the rights 25 | * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 26 | * copies of the Software, and to permit persons to whom the Software is 27 | * furnished to do so, subject to the following conditions: 28 | * 29 | * The above copyright notice and this permission notice shall be included in all 30 | * copies or substantial portions of the Software. 31 | * 32 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 33 | * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 34 | * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 35 | * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 36 | * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 37 | * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 38 | * SOFTWARE. 39 | *) 40 | */ 41 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | // =======================下面是配置prettier格式化的setting=================== 3 | // 指定哪些文件不参与搜索 4 | "search.exclude": { 5 | "**/node_modules": true, 6 | "dist": true, 7 | "build": true, 8 | "yarn.lock": true 9 | }, 10 | // 保存自动格式化 11 | "editor.formatOnSave": true, 12 | "[javascript]": { 13 | "editor.defaultFormatter": "esbenp.prettier-vscode" 14 | }, 15 | "[javascriptreact]": { 16 | "editor.defaultFormatter": "esbenp.prettier-vscode" 17 | }, 18 | "[typescript]": { 19 | "editor.defaultFormatter": "esbenp.prettier-vscode" 20 | }, 21 | "[typescriptreact]": { 22 | "editor.defaultFormatter": "esbenp.prettier-vscode" 23 | }, 24 | "[json]": { 25 | "editor.defaultFormatter": "esbenp.prettier-vscode" 26 | }, 27 | "[html]": { 28 | "editor.defaultFormatter": "esbenp.prettier-vscode" 29 | }, 30 | "[markdown]": { 31 | "editor.defaultFormatter": "esbenp.prettier-vscode" 32 | }, 33 | "[css]": { 34 | "editor.defaultFormatter": "esbenp.prettier-vscode" 35 | }, 36 | "[less]": { 37 | "editor.defaultFormatter": "esbenp.prettier-vscode" 38 | }, 39 | "[scss]": { 40 | "editor.defaultFormatter": "esbenp.prettier-vscode" 41 | }, 42 | 43 | // ==========================prettier=============================== 44 | 45 | // ========================eslint=================================== 46 | "eslint.validate": [ 47 | "javascript", 48 | "javascriptreact", 49 | "typescript", 50 | "typescriptreact" 51 | ], 52 | "typescript.tsdk": "./node_modules/typescript/lib", // 代替 vscode 的 ts 语法智能提示 53 | // 保存自动修复 54 | "editor.codeActionsOnSave": { 55 | "source.fixAll.eslint": "explicit", 56 | "source.fixAll.stylelint": "explicit" 57 | }, 58 | // ================================================================= 59 | 60 | // ========================stylelint============================== 61 | // 使用 stylelint 自身的校验即可, 关闭vscode验证 62 | "css.validate": false, 63 | "less.validate": false, 64 | "scss.validate": false, 65 | "stylelint.validate": [ 66 | "css", 67 | "less", 68 | "sass", 69 | "scss" 70 | ], 71 | "cSpell.words": [ 72 | "premajor", 73 | "preminor", 74 | "Prepatch" 75 | ] 76 | // 在editor.codeActionsOnSave中增加styleLint修复 77 | // =============================================================== 78 | } 79 | -------------------------------------------------------------------------------- /src/components/Waterfall/style/index.module.less: -------------------------------------------------------------------------------- 1 | .container { 2 | width: 100%; /* 容器宽度 */ 3 | column-count: 5; /* 定义列数 */ 4 | column-gap: 16px; /* 列与列之间的间距 */ 5 | 6 | .item { 7 | break-inside: avoid; /* 防止内容在列内部断开 */ 8 | margin-bottom: 16px; /* 每个项目之间的间距 */ 9 | 10 | img { 11 | width: 100%; /* 图片宽度填满列宽 */ 12 | height: auto; /* 保持图片宽高比 */ 13 | } 14 | } 15 | } 16 | 17 | .flexContainer { 18 | display: flex; 19 | flex-direction: row; 20 | width: 100%; 21 | 22 | .childContainer { 23 | flex: 1 1 1; 24 | margin-left: 10px; 25 | 26 | .item { 27 | flex: '0 0 auto'; 28 | width: '100%'; 29 | 30 | img { 31 | width: 100%; /* 图片宽度填满列宽 */ 32 | height: auto; /* 保持图片宽高比 */ 33 | } 34 | } 35 | } 36 | } 37 | 38 | .gridContainer { 39 | display: grid; 40 | grid-auto-rows: 10px; 41 | grid-gap: 0 10px; 42 | grid-template-columns: repeat(4, 1fr); 43 | align-items: end; 44 | 45 | .item { 46 | display: flex; 47 | align-items: center; 48 | justify-content: center; 49 | background: #f8f8fa; 50 | 51 | img { 52 | width: 100%; /* 图片宽度填满列宽 */ 53 | height: auto; /* 保持图片宽高比 */ 54 | } 55 | } 56 | } 57 | 58 | .jsContainer { 59 | position: relative; 60 | width: 900px; 61 | 62 | .jsItem { 63 | position: absolute; 64 | display: flex; 65 | align-items: center; 66 | justify-content: center; 67 | width: 200px; 68 | margin-bottom: 10px; 69 | overflow: hidden; 70 | color: white; 71 | font-size: 18px; 72 | background: rgb(236 146 10); 73 | transition: all 0.1s; 74 | 75 | .jsTag { 76 | position: absolute; 77 | top: 2px; 78 | left: 2px; 79 | color: white; 80 | } 81 | 82 | img { 83 | width: 100%; 84 | height: auto; 85 | } 86 | } 87 | } 88 | 89 | /* 为了响应式设计，你可以使用媒体查询来改变列数 */ 90 | @media (width <= 1000px) { 91 | /* stylelint-disable-next-line rule-empty-line-before */ 92 | .container { 93 | column-count: 4; 94 | } 95 | } 96 | 97 | @media (width <= 800px) { 98 | /* stylelint-disable-next-line rule-empty-line-before */ 99 | .container { 100 | column-count: 3; 101 | } 102 | } 103 | 104 | @media (width <= 600px) { 105 | /* stylelint-disable-next-line rule-empty-line-before */ 106 | .container { 107 | column-count: 2; 108 | } 109 | } 110 | 111 | @media (width <= 400px) { 112 | /* stylelint-disable-next-line rule-empty-line-before */ 113 | .container { 114 | column-count: 1; 115 | } 116 | } 117 | -------------------------------------------------------------------------------- /storybook-static/assets/index-B_J8iUie.js: -------------------------------------------------------------------------------- 1 | var j=Object.create,g=Object.defineProperty,A=Object.getOwnPropertyDescriptor,h=Object.getOwnPropertyNames,m=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty,P=(r,e)=>()=>(e||r((e={exports:{}}).exports,e),e.exports),d=(r,e,i,u)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of h(e))!x.call(r,a)&&a!==i&&g(r,a,{get:()=>e[a],enumerable:!(u=A(e,a))||u.enumerable});return r},S=(r,e,i)=>(i=r!=null?j(m(r)):{},d(e||!r||!r.__esModule?g(i,"default",{value:r,enumerable:!0}):i,r)),U=P(r=>{Object.defineProperty(r,"__esModule",{value:!0}),r.isEqual=function(){var e=Object.prototype.toString,i=Object.getPrototypeOf,u=Object.getOwnPropertySymbols?function(a){return Object.keys(a).concat(Object.getOwnPropertySymbols(a))}:Object.keys;return function(a,c){return function f(t,n,o){var y,p,l,s=e.call(t),w=e.call(n);if(t===n)return!0;if(t==null||n==null)return!1;if(o.indexOf(t)>-1&&o.indexOf(n)>-1)return!0;if(o.push(t,n),s!=w||(y=u(t),p=u(n),y.length!=p.length||y.some(function(O){return!f(t[O],n[O],o)})))return!1;switch(s.slice(8,-1)){case"Symbol":return t.valueOf()==n.valueOf();case"Date":case"Number":return+t==+n||+t!=+t&&+n!=+n;case"RegExp":case"Function":case"String":case"Boolean":return""+t==""+n;case"Set":case"Map":y=t.entries(),p=n.entries();do if(!f((l=y.next()).value,p.next().value,o))return!1;while(!l.done);return!0;case"ArrayBuffer":t=new Uint8Array(t),n=new Uint8Array(n);case"DataView":t=new Uint8Array(t.buffer),n=new Uint8Array(n.buffer);case"Float32Array":case"Float64Array":case"Int8Array":case"Int16Array":case"Int32Array":case"Uint8Array":case"Uint16Array":case"Uint32Array":case"Uint8ClampedArray":case"Arguments":case"Array":if(t.length!=n.length)return!1;for(l=0;lr.map(e=>typeof e<"u").filter(Boolean).length,q=(r,e)=>{let{exists:i,eq:u,neq:a,truthy:c}=r;if(v([i,u,a,c])>1)throw new Error(`Invalid conditional test ${JSON.stringify({exists:i,eq:u,neq:a})}`);if(typeof u<"u")return(0,b.isEqual)(e,u);if(typeof a<"u")return!(0,b.isEqual)(e,a);if(typeof i<"u"){let f=typeof e<"u";return i?f:!f}return typeof c>"u"||c?!!e:!e},E=(r,e,i)=>{if(!r.if)return!0;let{arg:u,global:a}=r.if;if(v([u,a])!==1)throw new Error(`Invalid conditional value ${JSON.stringify({arg:u,global:a})}`);let c=u?e[u]:i[a];return q(r.if,c)},I=r=>r.toLowerCase().replace(/[ ’–—―′¿'`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi,"-").replace(/-+/g,"-").replace(/^-+/,"").replace(/-+$/,"");export{I as L,E as O}; 2 | -------------------------------------------------------------------------------- /src/components/Waterfall/waterfallClass.ts: -------------------------------------------------------------------------------- 1 | export class WaterFall { 2 | gap: number; // 间距 3 | container: HTMLDivElement; // 容器 4 | heightArr: number[]; // 保存每列的高度信息 5 | items: HTMLCollection; // 子节点 6 | renderIndex: number; // 保存已经渲染了的节点 7 | constructor(container: HTMLDivElement, options: {gap: number}) { 8 | this.gap = options?.gap ?? 0; // 间距 9 | this.container = container; // 容器 10 | this.heightArr = []; // 保存每列的高度信息 11 | this.items = container.children; // 子节点 12 | this.renderIndex = 0; 13 | this.container.addEventListener('resize', () => { 14 | this.heightArr = []; 15 | this.layout(); 16 | }); 17 | // 监听节点生成和卸载 18 | this.container.addEventListener('DOMSubtreeModified', () => { 19 | this.layout(); 20 | }); 21 | } 22 | 23 | getMaxHeight(heightArr: number[]) { 24 | let maxHeight = heightArr[0]; 25 | for (let i = 1; i < heightArr.length; i++) { 26 | if (heightArr[i] > maxHeight) { 27 | maxHeight = heightArr[i]; 28 | } 29 | } 30 | return maxHeight; 31 | } 32 | 33 | // 计算高度最小的列 34 | getMinIndex(heightArr: number[]) { 35 | let minIndex = 0; 36 | let min = heightArr[minIndex]; 37 | for (let i = 1; i < heightArr.length; i++) { 38 | if (heightArr[i] < min) { 39 | min = heightArr[i]; 40 | minIndex = i; 41 | } 42 | } 43 | return minIndex; 44 | } 45 | 46 | layout() { 47 | if (this.items.length === 0) return; 48 | const gap = this.gap; 49 | const pageWidth = this.container?.offsetWidth || 1000; 50 | const itemWidth = (this.items[0] as HTMLDivElement).offsetWidth; 51 | const columns = Math.ceil(pageWidth / (itemWidth + gap)) ?? 5; // 总共有多少列 52 | 53 | // 增量加载 54 | while (this.renderIndex < this.items.length) { 55 | let top, left; 56 | const curItem = this.items[this.renderIndex] as HTMLDivElement; 57 | const curImgItem = curItem.children[0] as HTMLImageElement; 58 | // 之前插入的时候我们给item设置了默认值，这我们需要将图片高度设置给item 59 | curItem.style.height = curImgItem.offsetHeight + 'px'; 60 | curItem.style.width = curImgItem.offsetWidth + 'px'; 61 | if (this.renderIndex < columns) { 62 | // 第一列 63 | top = 0; 64 | left = (itemWidth + gap) * this.renderIndex; 65 | this.heightArr[this.renderIndex] = curImgItem.offsetHeight; 66 | } else { 67 | // 找到高度最小的一列 68 | const minIndex = this.getMinIndex(this.heightArr); 69 | // 属于那一列，获取第一个元素，要获取left 70 | const whichColumnFirstItem = this.items[minIndex] as HTMLDivElement; 71 | 72 | top = this.heightArr[minIndex] + gap; 73 | left = whichColumnFirstItem.offsetLeft; 74 | // 重新计算当前插入列的高度 75 | this.heightArr[minIndex] += curImgItem.offsetHeight + gap; 76 | } 77 | 78 | curItem.style.top = top + 'px'; 79 | curItem.style.left = left + 'px'; 80 | this.renderIndex++; 81 | } 82 | } 83 | } 84 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/storybook-core-server-presets-0/common-manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var u=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var i=(e,t)=>()=>(e&&(t=e(e=0)),t);var P=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports),w=(e,t)=>{for(var r in t)u(e,r,{get:t[r],enumerable:!0})},x=(e,t,r,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of h(t))!v.call(e,o)&&o!==r&&u(e,o,{get:()=>t[o],enumerable:!(a=T(t,o))||a.enumerable});return e};var A=e=>x(u({},"__esModule",{value:!0}),e);var s=i(()=>{});var l=i(()=>{});var n=i(()=>{});var d={};w(d,{ActiveTabs:()=>M,Consumer:()=>j,ManagerContext:()=>C,Provider:()=>I,addons:()=>F,combineParameters:()=>G,controlOrMetaKey:()=>K,controlOrMetaSymbol:()=>N,default:()=>k,eventMatchesShortcut:()=>R,eventToShortcut:()=>q,isMacLike:()=>B,isShortcutTaken:()=>D,keyToSymbol:()=>L,merge:()=>Y,mockChannel:()=>E,optionOrAltSymbol:()=>H,shortcutMatchesShortcut:()=>J,shortcutToHumanString:()=>z,types:()=>Q,useAddonState:()=>U,useArgTypes:()=>V,useArgs:()=>W,useChannel:()=>X,useGlobalTypes:()=>Z,useGlobals:()=>$,useParameter:()=>ee,useSharedState:()=>te,useStoryPrepared:()=>re,useStorybookApi:()=>oe,useStorybookState:()=>ae});var k,M,j,C,I,F,G,K,N,R,q,B,D,L,Y,E,H,J,z,Q,U,V,W,X,Z,$,ee,te,re,oe,ae,g=i(()=>{s();l();n();k=__STORYBOOK_API__,{ActiveTabs:M,Consumer:j,ManagerContext:C,Provider:I,addons:F,combineParameters:G,controlOrMetaKey:K,controlOrMetaSymbol:N,eventMatchesShortcut:R,eventToShortcut:q,isMacLike:B,isShortcutTaken:D,keyToSymbol:L,merge:Y,mockChannel:E,optionOrAltSymbol:H,shortcutMatchesShortcut:J,shortcutToHumanString:z,types:Q,useAddonState:U,useArgTypes:V,useArgs:W,useChannel:X,useGlobalTypes:Z,useGlobals:$,useParameter:ee,useSharedState:te,useStoryPrepared:re,useStorybookApi:oe,useStorybookState:ae}=__STORYBOOK_API__});var O=P((Pe,f)=>{"use strict";s();l();n();var b=Object.defineProperty,se=Object.getOwnPropertyDescriptor,le=Object.getOwnPropertyNames,ne=Object.prototype.hasOwnProperty,ie=(e,t)=>{for(var r in t)b(e,r,{get:t[r],enumerable:!0})},ue=(e,t,r,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of le(t))!ne.call(e,o)&&o!==r&&b(e,o,{get:()=>t[o],enumerable:!(a=se(t,o))||a.enumerable});return e},pe=e=>ue(b({},"__esModule",{value:!0}),e),y={};ie(y,{global:()=>_e});f.exports=pe(y);var _e=(()=>{let e;return typeof window<"u"?e=window:typeof globalThis<"u"?e=globalThis:typeof window<"u"?e=window:typeof self<"u"?e=self:e={},e})()});s();l();n();s();l();n();var ce=(g(),A(d)),be=O(),S="static-filter";ce.addons.register(S,e=>{let t=Object.entries(be.global.TAGS_OPTIONS??{}).reduce((r,a)=>{let[o,m]=a;return m.excludeFromSidebar&&(r[o]=!0),r},{});e.experimental_setFilter(S,r=>(r.tags||[]).filter(a=>t[a]).length===0)});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/assets/Button.stories-Cl2MKhW5.js: -------------------------------------------------------------------------------- 1 | import{f as T}from"./index-2ywIqtt-.js";import{R as q}from"./index-BBkUAzwr.js";const e={"storybook-button":"_storybook-button_1m9v8_2","storybook-button--primary":"_storybook-button--primary_1m9v8_11","storybook-button--secondary":"_storybook-button--secondary_1m9v8_15","storybook-button--small":"_storybook-button--small_1m9v8_20","storybook-button--medium":"_storybook-button--medium_1m9v8_24","storybook-button--large":"_storybook-button--large_1m9v8_28"},k=({primary:_=!1,size:f="medium",backgroundColor:v,label:B,...h})=>{const S=_?e["storybook-button--primary"]:e["storybook-button--secondary"];return q.createElement("button",{type:"button",className:[e["storybook-button"],e[`storybook-button--${f}`],S].join(" "),style:{backgroundColor:v},...h},B)};k.__docgenInfo={description:"Primary UI component for user interaction",methods:[],displayName:"Button",props:{primary:{required:!1,tsType:{name:"boolean"},description:"Is this the principal call to action on the page?",defaultValue:{value:"false",computed:!1}},backgroundColor:{required:!1,tsType:{name:"string"},description:"What background color to use"},size:{required:!1,tsType:{name:"union",raw:"'small' | 'medium' | 'large'",elements:[{name:"literal",value:"'small'"},{name:"literal",value:"'medium'"},{name:"literal",value:"'large'"}]},description:"How large should the button be?",defaultValue:{value:"'medium'",computed:!1}},label:{required:!0,tsType:{name:"string"},description:"Button contents"},onClick:{required:!1,tsType:{name:"signature",type:"function",raw:"() => void",signature:{arguments:[],return:{name:"void"}}},description:"Optional click handler"}}};const w={title:"通用/Button",component:k,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{backgroundColor:{control:"color"}},args:{onClick:T()}},o={args:{primary:!0,label:"Button"}},t={args:{label:"Button"}},r={args:{size:"large",label:"Button"}},a={args:{size:"small",label:"Button"}};var s,n,l;o.parameters={...o.parameters,docs:{...(s=o.parameters)==null?void 0:s.docs,source:{originalSource:`{ 2 | args: { 3 | primary: true, 4 | label: "Button" 5 | } 6 | }`,...(l=(n=o.parameters)==null?void 0:n.docs)==null?void 0:l.source}}};var u,m,i;t.parameters={...t.parameters,docs:{...(u=t.parameters)==null?void 0:u.docs,source:{originalSource:`{ 7 | args: { 8 | label: "Button" 9 | } 10 | }`,...(i=(m=t.parameters)==null?void 0:m.docs)==null?void 0:i.source}}};var c,d,p;r.parameters={...r.parameters,docs:{...(c=r.parameters)==null?void 0:c.docs,source:{originalSource:`{ 11 | args: { 12 | size: "large", 13 | label: "Button" 14 | } 15 | }`,...(p=(d=r.parameters)==null?void 0:d.docs)==null?void 0:p.source}}};var b,y,g;a.parameters={...a.parameters,docs:{...(b=a.parameters)==null?void 0:b.docs,source:{originalSource:`{ 16 | args: { 17 | size: "small", 18 | label: "Button" 19 | } 20 | }`,...(g=(y=a.parameters)==null?void 0:y.docs)==null?void 0:g.source}}};const I=["Primary","Secondary","Large","Small"];export{r as Large,o as Primary,t as Secondary,a as Small,I as __namedExportsOrder,w as default}; 21 | -------------------------------------------------------------------------------- /src/api/index.ts: -------------------------------------------------------------------------------- 1 | import axios from 'axios'; 2 | import {IMG_DATA} from './imgData'; 3 | export const UNSPLASH_ACCESS_KEY = 4 | '-hYErx6z6tZevGWFjgXRtZQGURheNVLWeNdcU_jx0w8'; 5 | export interface UnsplashImage { 6 | id: string; 7 | created_at: string; 8 | updated_at: string; 9 | width: number; 10 | height: number; 11 | color: string; 12 | blur_hash: string; 13 | description: string | null; 14 | alt_description: string; 15 | urls: { 16 | raw: string; 17 | full: string; 18 | regular: string; 19 | small: string; 20 | thumb: string; 21 | small_s3: string; 22 | }; 23 | links: { 24 | self: string; 25 | html: string; 26 | download: string; 27 | download_location: string; 28 | }; 29 | topic_submissions: { 30 | experimental: { 31 | 'status': string; 32 | }; 33 | wallpapers: { 34 | 'status': string; 35 | }; 36 | '3d-renders': { 37 | 'status': string; 38 | 'approved_on': string; 39 | }; 40 | }; 41 | slug: string; 42 | breadcrumbs: string[]; 43 | current_user_collections: string[]; 44 | promoted_at: string; 45 | sponsorship: string | null; 46 | alternative_slugs: { 47 | en: string; 48 | es: string; 49 | ja: string; 50 | fr: string; 51 | it: string; 52 | ko: string; 53 | de: string; 54 | pt: string; 55 | }; 56 | likes: number; 57 | liked_by_user: boolean; 58 | user: { 59 | id: string; 60 | username: string; 61 | name: string; 62 | first_name: string; 63 | last_name: string; 64 | portfolio_url: string | null; 65 | bio: string | null; 66 | location: string | null; 67 | total_likes: number; 68 | total_photos: number; 69 | total_collections: number; 70 | profile_image: { 71 | small: string; 72 | medium: string; 73 | large: string; 74 | }; 75 | instagram_username: string | null; 76 | twitter_username: string | null; 77 | updated_at: string; 78 | total_promoted_photos: number; 79 | total_illustrations: number; 80 | for_hire: boolean; 81 | accepted_tos: boolean; 82 | total_promoted_illustrations: number; 83 | links: { 84 | self: string; 85 | html: string; 86 | photos: string; 87 | likes: string; 88 | portfolio: string; 89 | following: string; 90 | followers: string; 91 | }; 92 | social: { 93 | instagram_username: string | null; 94 | portfolio_url: string | null; 95 | twitter_username: string | null; 96 | paypal_email: string | null; 97 | }; 98 | }; 99 | } 100 | interface I_ImgRes { 101 | config: any; 102 | data: UnsplashImage[]; 103 | status: number; 104 | statusText: string; 105 | } 106 | /** 107 | * 请求任意200张图片 108 | * @returns 109 | */ 110 | export const fetchRandomImage = async (imgNums: number) => { 111 | return IMG_DATA; 112 | // eslint-disable-next-line no-unreachable 113 | try { 114 | const res: I_ImgRes = await axios.get( 115 | 'https://api.unsplash.com/photos/random', 116 | { 117 | params: { 118 | client_id: UNSPLASH_ACCESS_KEY, // 替换为你的Access Key 119 | count: imgNums, 120 | }, 121 | }, 122 | ); 123 | return res.data.length !== 0 ? res?.data : []; 124 | } catch (error) { 125 | console.error('Error fetching image from Unsplash:', error); 126 | } 127 | }; 128 | -------------------------------------------------------------------------------- /storybook-static/assets/preview-CwqMn10d.js: -------------------------------------------------------------------------------- 1 | import{d as E}from"./index-DrFu-skq.js";const{useMemo:f,useEffect:v}=__STORYBOOK_MODULE_PREVIEW_API__,{global:M}=__STORYBOOK_MODULE_GLOBAL__,{logger:h}=__STORYBOOK_MODULE_CLIENT_LOGGER__;var p="backgrounds",{document:l,window:B}=M,x=()=>B.matchMedia("(prefers-reduced-motion: reduce)").matches,O=(r,e=[],a)=>{if(r==="transparent")return"transparent";if(e.find(n=>n.value===r))return r;let d=e.find(n=>n.name===a);if(d)return d.value;if(a){let n=e.map(o=>o.name).join(", ");h.warn(E` 2 | Backgrounds Addon: could not find the default color "${a}". 3 | These are the available colors for your story based on your configuration: 4 | ${n}. 5 | `)}return"transparent"},k=r=>{(Array.isArray(r)?r:[r]).forEach(S)},S=r=>{var a;let e=l.getElementById(r);e&&((a=e.parentElement)==null||a.removeChild(e))},w=(r,e)=>{let a=l.getElementById(r);if(a)a.innerHTML!==e&&(a.innerHTML=e);else{let d=l.createElement("style");d.setAttribute("id",r),d.innerHTML=e,l.head.appendChild(d)}},A=(r,e,a)=>{var n;let d=l.getElementById(r);if(d)d.innerHTML!==e&&(d.innerHTML=e);else{let o=l.createElement("style");o.setAttribute("id",r),o.innerHTML=e;let i=`addon-backgrounds-grid${a?`-docs-${a}`:""}`,t=l.getElementById(i);t?(n=t.parentElement)==null||n.insertBefore(o,t):l.head.appendChild(o)}},L=(r,e)=>{var c;let{globals:a,parameters:d}=e,n=(c=a[p])==null?void 0:c.value,o=d[p],i=f(()=>o.disable?"transparent":O(n,o.values,o.default),[o,n]),t=f(()=>i&&i!=="transparent",[i]),s=e.viewMode==="docs"?`#anchor--${e.id} .docs-story`:".sb-show-main",u=f(()=>` 6 | ${s} { 7 | background: ${i} !important; 8 | ${x()?"":"transition: background-color 0.3s;"} 9 | } 10 | `,[i,s]);return v(()=>{let g=e.viewMode==="docs"?`addon-backgrounds-docs-${e.id}`:"addon-backgrounds-color";if(!t){k(g);return}A(g,u,e.viewMode==="docs"?e.id:null)},[t,u,e]),r()},T=(r,e)=>{var y;let{globals:a,parameters:d}=e,n=d[p].grid,o=((y=a[p])==null?void 0:y.grid)===!0&&n.disable!==!0,{cellAmount:i,cellSize:t,opacity:s}=n,u=e.viewMode==="docs",c=d.layout===void 0||d.layout==="padded"?16:0,g=n.offsetX??(u?20:c),m=n.offsetY??(u?20:c),$=f(()=>{let b=e.viewMode==="docs"?`#anchor--${e.id} .docs-story`:".sb-show-main",_=[`${t*i}px ${t*i}px`,`${t*i}px ${t*i}px`,`${t}px ${t}px`,`${t}px ${t}px`].join(", ");return` 11 | ${b} { 12 | background-size: ${_} !important; 13 | background-position: ${g}px ${m}px, ${g}px ${m}px, ${g}px ${m}px, ${g}px ${m}px !important; 14 | background-blend-mode: difference !important; 15 | background-image: linear-gradient(rgba(130, 130, 130, ${s}) 1px, transparent 1px), 16 | linear-gradient(90deg, rgba(130, 130, 130, ${s}) 1px, transparent 1px), 17 | linear-gradient(rgba(130, 130, 130, ${s/2}) 1px, transparent 1px), 18 | linear-gradient(90deg, rgba(130, 130, 130, ${s/2}) 1px, transparent 1px) !important; 19 | } 20 | `},[t]);return v(()=>{let b=e.viewMode==="docs"?`addon-backgrounds-grid-docs-${e.id}`:"addon-backgrounds-grid";if(!o){k(b);return}w(b,$)},[o,$,e]),r()},I=[T,L],R={[p]:{grid:{cellSize:20,opacity:.5,cellAmount:5},values:[{name:"light",value:"#F8F8F8"},{name:"dark",value:"#333333"}]}},G={[p]:null};export{I as decorators,G as globals,R as parameters}; 21 | -------------------------------------------------------------------------------- /scripts/config/webpack.common.js: -------------------------------------------------------------------------------- 1 | const {resolve} = require('path'); 2 | const {PROJECT_PATH, isDev} = require('../constants'); 3 | const HtmlWebpackPlugin = require('html-webpack-plugin'); 4 | 5 | const PLUGINS = [ 6 | // 配置html，自动引入打包出的js文件 7 | new HtmlWebpackPlugin({ 8 | template: resolve(PROJECT_PATH, './public_test/index.html'), 9 | filename: 'index.html', 10 | cache: false, 11 | minify: isDev 12 | ? false 13 | : { 14 | removeAttributeQuotes: true, 15 | collapseWhitespace: true, 16 | removeComments: true, 17 | collapseBooleanAttributes: true, 18 | collapseInlineTagWhitespace: true, 19 | removeRedundantAttributes: true, 20 | removeScriptTypeAttributes: true, 21 | removeStyleLinkTypeAttributes: true, 22 | minifyCSS: true, 23 | minifyJS: true, 24 | minifyURLs: true, 25 | useShortDoctype: true, 26 | }, 27 | }), 28 | ]; 29 | 30 | const getCssLoaders = (importLoaders) => [ 31 | 'style-loader', 32 | { 33 | loader: 'css-loader', 34 | options: { 35 | modules: { 36 | localIdentName: '[local]__[hash:base64:5]', 37 | }, 38 | sourceMap: isDev, 39 | importLoaders, 40 | }, 41 | }, 42 | 'postcss-loader', 43 | ]; 44 | 45 | module.exports = { 46 | mode: isDev ? 'development' : 'production', 47 | entry: { 48 | app: resolve(PROJECT_PATH, './src/index.tsx'), 49 | }, 50 | output: { 51 | filename: `js/[name]${isDev ? '' : '.[hash:8]'}.js`, 52 | path: resolve(PROJECT_PATH, './dist'), 53 | }, 54 | resolve: { 55 | extensions: ['.tsx', '.ts', '.js', '.json'], 56 | alias: { 57 | '@src': resolve(PROJECT_PATH, './src'), 58 | '@components': resolve(PROJECT_PATH, './src/components'), 59 | '@utils': resolve(PROJECT_PATH, './src/utils'), 60 | }, 61 | }, 62 | plugins: PLUGINS, 63 | module: { 64 | rules: [ 65 | { 66 | test: /\.(tsx?|js)$/, 67 | loader: 'babel-loader', 68 | options: {cacheDirectory: true}, 69 | exclude: /node_modules/, 70 | }, 71 | { 72 | test: /\.css$/, 73 | use: getCssLoaders(1), 74 | }, 75 | { 76 | test: /\.less$/, 77 | use: [ 78 | ...getCssLoaders(2), 79 | { 80 | loader: 'less-loader', 81 | options: { 82 | sourceMap: isDev, 83 | }, 84 | }, 85 | ], 86 | }, 87 | { 88 | test: /\.scss$/, 89 | use: [ 90 | ...getCssLoaders(2), 91 | { 92 | loader: 'sass-loader', 93 | options: { 94 | sourceMap: isDev, 95 | }, 96 | }, 97 | ], 98 | }, 99 | // 处理图片、文件、字体 100 | { 101 | test: /\.(png|svg|jpg|jpeg|gif)$/i, 102 | type: 'asset/resource', 103 | }, 104 | { 105 | test: /\.(woff|woff2|eot|ttf|otf)$/i, 106 | type: 'asset/resource', 107 | }, 108 | { 109 | test: /\.txt/, 110 | type: 'asset/source', 111 | }, 112 | { 113 | // 通用文件则使用 asset，此时会按照默认条件自动决定是否转换为 Data URI 114 | test: /\.(?:ico|gif|png|jpg|jpeg)$/i, 115 | type: 'asset', 116 | parser: { 117 | // 如果文件大小小于 8kb，那么会转换为 data URI，否则为单独文件。 118 | // 8kb 是默认值，你可以根据需要进行调整 119 | dataUrlCondition: { 120 | maxSize: 8 * 1024, // 8kb 121 | }, 122 | }, 123 | }, 124 | ], 125 | }, 126 | }; 127 | -------------------------------------------------------------------------------- /storybook-static/assets/preview-DbT1mggi.js: -------------------------------------------------------------------------------- 1 | let l;const S=new Uint8Array(16);function D(){if(!l&&(l=typeof crypto<"u"&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto),!l))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return l(S)}const c=[];for(let t=0;t<256;++t)c.push((t+256).toString(16).slice(1));function T(t,e=0){return c[t[e+0]]+c[t[e+1]]+c[t[e+2]]+c[t[e+3]]+"-"+c[t[e+4]]+c[t[e+5]]+"-"+c[t[e+6]]+c[t[e+7]]+"-"+c[t[e+8]]+c[t[e+9]]+"-"+c[t[e+10]]+c[t[e+11]]+c[t[e+12]]+c[t[e+13]]+c[t[e+14]]+c[t[e+15]]}const w=typeof crypto<"u"&&crypto.randomUUID&&crypto.randomUUID.bind(crypto),m={randomUUID:w};function U(t,e,i){if(m.randomUUID&&!e&&!t)return m.randomUUID();t=t||{};const n=t.random||(t.rng||D)();if(n[6]=n[6]&15|64,n[8]=n[8]&63|128,e){i=i||0;for(let o=0;o<16;++o)e[i+o]=n[o];return e}return T(n)}const{addons:j}=__STORYBOOK_MODULE_PREVIEW_API__,{global:R}=__STORYBOOK_MODULE_GLOBAL__,{ImplicitActionsDuringRendering:x}=__STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS__;var V="storybook/actions",f=`${V}/action-event`,P={depth:10,clearOnStoryChange:!0,limit:50},E=(t,e)=>{let i=Object.getPrototypeOf(t);return!i||e(i)?i:E(i,e)},F=t=>!!(typeof t=="object"&&t&&E(t,e=>/^Synthetic(?:Base)?Event$/.test(e.constructor.name))&&typeof t.persist=="function"),M=t=>{if(F(t)){let e=Object.create(t.constructor.prototype,Object.getOwnPropertyDescriptors(t));e.persist();let i=Object.getOwnPropertyDescriptor(e,"view"),n=i==null?void 0:i.value;return typeof n=="object"&&(n==null?void 0:n.constructor.name)==="Window"&&Object.defineProperty(e,"view",{...i,value:Object.create(n.constructor.prototype)}),e}return t},B=()=>typeof crypto=="object"&&typeof crypto.getRandomValues=="function"?U():Date.now().toString(36)+Math.random().toString(36).substring(2);function y(t,e={}){let i={...P,...e},n=function(...o){var g,u;if(e.implicit){let _=(g="__STORYBOOK_PREVIEW__"in R?R.__STORYBOOK_PREVIEW__:void 0)==null?void 0:g.storyRenders.find(d=>d.phase==="playing"||d.phase==="rendering");if(_){let d=!((u=window==null?void 0:window.FEATURES)!=null&&u.disallowImplicitActionsInRenderV8),O=new x({phase:_.phase,name:t,deprecated:d});if(d)console.warn(O);else throw O}}let r=j.getChannel(),a=B(),p=5,s=o.map(M),I=o.length>1?s:s[0],b={id:a,count:0,data:{name:t,args:I},options:{...i,maxDepth:p+(i.depth||3),allowFunction:i.allowFunction||!1}};r.emit(f,b)};return n.isAction=!0,n.implicit=e.implicit,n}var A=(t,e)=>typeof e[t]>"u"&&!(t in e),v=t=>{let{initialArgs:e,argTypes:i,id:n,parameters:{actions:o}}=t;if(!o||o.disable||!o.argTypesRegex||!i)return{};let r=new RegExp(o.argTypesRegex);return Object.entries(i).filter(([a])=>!!r.test(a)).reduce((a,[p,s])=>(A(p,e)&&(a[p]=y(p,{implicit:!0,id:n})),a),{})},k=t=>{let{initialArgs:e,argTypes:i,parameters:{actions:n}}=t;return n!=null&&n.disable||!i?{}:Object.entries(i).filter(([o,r])=>!!r.action).reduce((o,[r,a])=>(A(r,e)&&(o[r]=y(typeof a.action=="string"?a.action:r)),o),{})},L=[k,v],h=Symbol.for("tinyspy:spy"),K=t=>{let{args:e,parameters:{actions:i}}=t;i!=null&&i.disable||Object.entries(e).filter(([,n])=>typeof n=="function"&&"_isMockFunction"in n&&n._isMockFunction).forEach(([n,o])=>{var a;let r=o.getMockImplementation()??(h in o?(a=o[h])==null?void 0:a.getOriginal():void 0);if((r==null?void 0:r._actionAttached)!==!0&&(r==null?void 0:r.isAction)!==!0){let p=(...s)=>(y(n)(...s),r==null?void 0:r(...s));p._actionAttached=!0,o.mockImplementation(p)}})},W=[K];export{L as argsEnhancers,W as loaders,h as tinySpyInternalState}; 2 | -------------------------------------------------------------------------------- /storybook-static/assets/iframe-CJ3QuUcW.js: -------------------------------------------------------------------------------- 1 | function __vite__mapDeps(indexes) { 2 | if (!__vite__mapDeps.viteFileDeps) { 3 | __vite__mapDeps.viteFileDeps = ["./Button.stories-Cl2MKhW5.js","./index-2ywIqtt-.js","./index-BBkUAzwr.js","./Button-DkS0gYk8.css","./entry-preview-Xn6uC1vK.js","./react-18-DHj1n7xi.js","./entry-preview-docs-B-PZEOng.js","./_getPrototype-BVQBtff3.js","./index-DrFu-skq.js","./preview-DzbRFJg_.js","./index-B_J8iUie.js","./preview-CwqMn10d.js","./preview-BAz7FMXc.js","./preview-iTGUmTy2.js"] 4 | } 5 | return indexes.map((i) => __vite__mapDeps.viteFileDeps[i]) 6 | } 7 | import"../sb-preview/runtime.js";(function(){const s=document.createElement("link").relList;if(s&&s.supports&&s.supports("modulepreload"))return;for(const e of document.querySelectorAll('link[rel="modulepreload"]'))l(e);new MutationObserver(e=>{for(const t of e)if(t.type==="childList")for(const r of t.addedNodes)r.tagName==="LINK"&&r.rel==="modulepreload"&&l(r)}).observe(document,{childList:!0,subtree:!0});function c(e){const t={};return e.integrity&&(t.integrity=e.integrity),e.referrerPolicy&&(t.referrerPolicy=e.referrerPolicy),e.crossOrigin==="use-credentials"?t.credentials="include":e.crossOrigin==="anonymous"?t.credentials="omit":t.credentials="same-origin",t}function l(e){if(e.ep)return;e.ep=!0;const t=c(e);fetch(e.href,t)}})();const f="modulepreload",R=function(_,s){return new URL(_,s).href},E={},o=function(s,c,l){let e=Promise.resolve();if(c&&c.length>0){const t=document.getElementsByTagName("link"),r=document.querySelector("meta[property=csp-nonce]"),O=(r==null?void 0:r.nonce)||(r==null?void 0:r.getAttribute("nonce"));e=Promise.all(c.map(i=>{if(i=R(i,l),i in E)return;E[i]=!0;const u=i.endsWith(".css"),p=u?'[rel="stylesheet"]':"";if(!!l)for(let m=t.length-1;m>=0;m--){const a=t[m];if(a.href===i&&(!u||a.rel==="stylesheet"))return}else if(document.querySelector(`link[href="${i}"]${p}`))return;const n=document.createElement("link");if(n.rel=u?"stylesheet":f,u||(n.as="script",n.crossOrigin=""),n.href=i,O&&n.setAttribute("nonce",O),document.head.appendChild(n),u)return new Promise((m,a)=>{n.addEventListener("load",m),n.addEventListener("error",()=>a(new Error(`Unable to preload CSS for ${i}`)))})}))}return e.then(()=>s()).catch(t=>{const r=new Event("vite:preloadError",{cancelable:!0});if(r.payload=t,window.dispatchEvent(r),!r.defaultPrevented)throw t})},{createBrowserChannel:P}=__STORYBOOK_MODULE_CHANNELS__,{addons:T}=__STORYBOOK_MODULE_PREVIEW_API__,d=P({page:"preview"});T.setChannel(d);window.__STORYBOOK_ADDONS_CHANNEL__=d;window.CONFIG_TYPE==="DEVELOPMENT"&&(window.__STORYBOOK_SERVER_CHANNEL__=d);const w={"./src/components/Button/Button.stories.tsx":async()=>o(()=>import("./Button.stories-Cl2MKhW5.js"),__vite__mapDeps([0,1,2,3]),import.meta.url)};async function L(_){return w[_]()}const{composeConfigs:v,PreviewWeb:h,ClientApi:I}=__STORYBOOK_MODULE_PREVIEW_API__,A=async()=>{const _=await Promise.all([o(()=>import("./entry-preview-Xn6uC1vK.js"),__vite__mapDeps([4,2,5]),import.meta.url),o(()=>import("./entry-preview-docs-B-PZEOng.js"),__vite__mapDeps([6,7,2,8]),import.meta.url),o(()=>import("./preview-DzbRFJg_.js"),__vite__mapDeps([9,10]),import.meta.url),o(()=>import("./preview-DIVHFgVG.js"),[],import.meta.url),o(()=>import("./preview-DbT1mggi.js"),[],import.meta.url),o(()=>import("./preview-CwqMn10d.js"),__vite__mapDeps([11,8]),import.meta.url),o(()=>import("./preview-B4GcaC1c.js"),[],import.meta.url),o(()=>import("./preview-Db4Idchh.js"),[],import.meta.url),o(()=>import("./preview-BAz7FMXc.js"),__vite__mapDeps([12,8]),import.meta.url),o(()=>import("./preview-Cv3rAi2i.js"),[],import.meta.url),o(()=>import("./preview-iTGUmTy2.js"),__vite__mapDeps([13,1]),import.meta.url),o(()=>import("./preview-CIRcjyVj.js"),[],import.meta.url)]);return v(_)};window.__STORYBOOK_PREVIEW__=window.__STORYBOOK_PREVIEW__||new h(L,A);window.__STORYBOOK_STORY_STORE__=window.__STORYBOOK_STORY_STORE__||window.__STORYBOOK_PREVIEW__.storyStore;export{o as _}; 8 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # File created using '.gitignore Generator' for Visual Studio Code: https://bit.ly/vscode-gig 2 | # Created by https://www.toptal.com/developers/gitignore/api/visualstudiocode,macos,node,react 3 | # Edit at https://www.toptal.com/developers/gitignore?templates=visualstudiocode,macos,node,react 4 | 5 | ### macOS ### 6 | # General 7 | .DS_Store 8 | .AppleDouble 9 | .LSOverride 10 | 11 | # Icon must end with two \r 12 | Icon 13 | 14 | # Thumbnails 15 | ._* 16 | 17 | # Files that might appear in the root of a volume 18 | .DocumentRevisions-V100 19 | .fseventsd 20 | .Spotlight-V100 21 | .TemporaryItems 22 | .Trashes 23 | .VolumeIcon.icns 24 | .com.apple.timemachine.donotpresent 25 | 26 | # Directories potentially created on remote AFP share 27 | .AppleDB 28 | .AppleDesktop 29 | Network Trash Folder 30 | Temporary Items 31 | .apdisk 32 | 33 | ### macOS Patch ### 34 | # iCloud generated files 35 | *.icloud 36 | 37 | ### Node ### 38 | # Logs 39 | logs 40 | *.log 41 | npm-debug.log* 42 | yarn-debug.log* 43 | yarn-error.log* 44 | lerna-debug.log* 45 | .pnpm-debug.log* 46 | 47 | # Diagnostic reports (https://nodejs.org/api/report.html) 48 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 49 | 50 | # Runtime data 51 | pids 52 | *.pid 53 | *.seed 54 | *.pid.lock 55 | 56 | # Directory for instrumented libs generated by jscoverage/JSCover 57 | lib-cov 58 | 59 | # Coverage directory used by tools like istanbul 60 | coverage 61 | *.lcov 62 | 63 | # nyc test coverage 64 | .nyc_output 65 | 66 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 67 | .grunt 68 | 69 | # Bower dependency directory (https://bower.io/) 70 | bower_components 71 | 72 | # node-waf configuration 73 | .lock-wscript 74 | 75 | # Compiled binary addons (https://nodejs.org/api/addons.html) 76 | build/Release 77 | 78 | # Dependency directories 79 | node_modules/ 80 | jspm_packages/ 81 | 82 | # Snowpack dependency directory (https://snowpack.dev/) 83 | web_modules/ 84 | 85 | # TypeScript cache 86 | *.tsbuildinfo 87 | 88 | # Optional npm cache directory 89 | .npm 90 | 91 | # Optional eslint cache 92 | .eslintcache 93 | 94 | # Optional stylelint cache 95 | .stylelintcache 96 | 97 | # Microbundle cache 98 | .rpt2_cache/ 99 | .rts2_cache_cjs/ 100 | .rts2_cache_es/ 101 | .rts2_cache_umd/ 102 | 103 | # Optional REPL history 104 | .node_repl_history 105 | 106 | # Output of 'npm pack' 107 | *.tgz 108 | 109 | # Yarn Integrity file 110 | .yarn-integrity 111 | 112 | # dotenv environment variable files 113 | .env 114 | .env.development.local 115 | .env.test.local 116 | .env.production.local 117 | .env.local 118 | 119 | # parcel-bundler cache (https://parceljs.org/) 120 | .cache 121 | .parcel-cache 122 | 123 | # Next.js build output 124 | .next 125 | out 126 | 127 | # Nuxt.js build / generate output 128 | .nuxt 129 | dist 130 | 131 | # Gatsby files 132 | .cache/ 133 | # Comment in the public line in if your project uses Gatsby and not Next.js 134 | # https://nextjs.org/blog/next-9-1#public-directory-support 135 | # public 136 | 137 | # vuepress build output 138 | .vuepress/dist 139 | 140 | # vuepress v2.x temp and cache directory 141 | .temp 142 | 143 | # Docusaurus cache and generated files 144 | .docusaurus 145 | 146 | # Serverless directories 147 | .serverless/ 148 | 149 | # FuseBox cache 150 | .fusebox/ 151 | 152 | # DynamoDB Local files 153 | .dynamodb/ 154 | 155 | # TernJS port file 156 | .tern-port 157 | 158 | # Stores VSCode versions used for testing VSCode extensions 159 | .vscode-test 160 | 161 | # yarn v2 162 | .yarn/cache 163 | .yarn/unplugged 164 | .yarn/build-state.yml 165 | .yarn/install-state.gz 166 | .pnp.* 167 | 168 | ### Node Patch ### 169 | # Serverless Webpack directories 170 | .webpack/ 171 | 172 | # Optional stylelint cache 173 | 174 | # SvelteKit build / generate output 175 | .svelte-kit 176 | 177 | ### react ### 178 | .DS_* 179 | **/*.backup.* 180 | **/*.back.* 181 | 182 | node_modules 183 | 184 | *.sublime* 185 | 186 | psd 187 | thumb 188 | sketch 189 | 190 | ### VisualStudioCode ### 191 | .vscode/* 192 | !.vscode/settings.json 193 | !.vscode/tasks.json 194 | !.vscode/launch.json 195 | !.vscode/extensions.json 196 | !.vscode/*.code-snippets 197 | 198 | # Local History for Visual Studio Code 199 | .history/ 200 | 201 | # Built Visual Studio Code Extensions 202 | *.vsix 203 | 204 | ### VisualStudioCode Patch ### 205 | # Ignore all local history of files 206 | .history 207 | .ionide 208 | 209 | # End of https://www.toptal.com/developers/gitignore/api/visualstudiocode,macos,node,react 210 | 211 | # Custom rules (everything added below won't be overriden by 'Generate .gitignore File' if you use 'Update' option) 212 | 213 | 214 | *storybook.log -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-toolbars-7/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var n=__REACT__,{Children:le,Component:ne,Fragment:se,Profiler:ie,PureComponent:ue,StrictMode:ce,Suspense:pe,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:me,cloneElement:de,createContext:be,createElement:Se,createFactory:Te,createRef:ye,forwardRef:_e,isValidElement:fe,lazy:Ce,memo:Ie,startTransition:ve,unstable_act:Oe,useCallback:I,useContext:Ee,useDebugValue:xe,useDeferredValue:ge,useEffect:x,useId:he,useImperativeHandle:ke,useInsertionEffect:Ae,useLayoutEffect:Le,useMemo:Re,useReducer:Be,useRef:L,useState:R,useSyncExternalStore:Pe,useTransition:Me,version:Ne}=__REACT__;var Fe=__STORYBOOK_API__,{ActiveTabs:We,Consumer:Ge,ManagerContext:Ke,Provider:Ye,addons:g,combineParameters:$e,controlOrMetaKey:ze,controlOrMetaSymbol:Ue,eventMatchesShortcut:je,eventToShortcut:qe,isMacLike:Ze,isShortcutTaken:Je,keyToSymbol:Qe,merge:Xe,mockChannel:et,optionOrAltSymbol:tt,shortcutMatchesShortcut:ot,shortcutToHumanString:rt,types:B,useAddonState:at,useArgTypes:lt,useArgs:nt,useChannel:st,useGlobalTypes:P,useGlobals:h,useParameter:it,useSharedState:ut,useStoryPrepared:ct,useStorybookApi:M,useStorybookState:pt}=__STORYBOOK_API__;var Tt=__STORYBOOK_COMPONENTS__,{A:yt,ActionBar:_t,AddonPanel:ft,Badge:Ct,Bar:It,Blockquote:vt,Button:Ot,ClipboardCode:Et,Code:xt,DL:gt,Div:ht,DocumentWrapper:kt,EmptyTabContent:At,ErrorFormatter:Lt,FlexBar:Rt,Form:Bt,H1:Pt,H2:Mt,H3:Nt,H4:wt,H5:Vt,H6:Dt,HR:Ht,IconButton:N,IconButtonSkeleton:Ft,Icons:k,Img:Wt,LI:Gt,Link:Kt,ListItem:Yt,Loader:$t,OL:zt,P:Ut,Placeholder:jt,Pre:qt,ResetWrapper:Zt,ScrollArea:Jt,Separator:w,Spaced:Qt,Span:Xt,StorybookIcon:eo,StorybookLogo:to,Symbols:oo,SyntaxHighlighter:ro,TT:ao,TabBar:lo,TabButton:no,TabWrapper:so,Table:io,Tabs:uo,TabsState:co,TooltipLinkList:V,TooltipMessage:po,TooltipNote:mo,UL:bo,WithTooltip:D,WithTooltipPure:So,Zoom:To,codeCommon:yo,components:_o,createCopyToClipboardFunction:fo,getStoryHref:Co,icons:Io,interleaveSeparators:vo,nameSpaceClassNames:Oo,resetComponents:Eo,withReset:xo}=__STORYBOOK_COMPONENTS__;var W=({active:o,title:t,icon:e,description:r,onClick:a})=>n.createElement(N,{active:o,title:r,onClick:a},e&&n.createElement(k,{icon:e,__suppressDeprecationWarning:!0}),t?`\xA0${t}`:null),G=["reset"],K=o=>o.filter(t=>!G.includes(t.type)).map(t=>t.value),b="addon-toolbars",Y=async(o,t,e)=>{e&&e.next&&await o.setAddonShortcut(b,{label:e.next.label,defaultShortcut:e.next.keys,actionName:`${t}:next`,action:e.next.action}),e&&e.previous&&await o.setAddonShortcut(b,{label:e.previous.label,defaultShortcut:e.previous.keys,actionName:`${t}:previous`,action:e.previous.action}),e&&e.reset&&await o.setAddonShortcut(b,{label:e.reset.label,defaultShortcut:e.reset.keys,actionName:`${t}:reset`,action:e.reset.action})},$=o=>t=>{let{id:e,toolbar:{items:r,shortcuts:a}}=t,d=M(),[S,s]=h(),l=L([]),p=S[e],v=I(()=>{s({[e]:""})},[s]),O=I(()=>{let m=l.current,i=m.indexOf(p),c=i===m.length-1?0:i+1,T=l.current[c];s({[e]:T})},[l,p,s]),u=I(()=>{let m=l.current,i=m.indexOf(p),c=i>-1?i:0,T=c===0?m.length-1:c-1,y=l.current[T];s({[e]:y})},[l,p,s]);return x(()=>{a&&Y(d,e,{next:{...a.next,action:O},previous:{...a.previous,action:u},reset:{...a.reset,action:v}})},[d,e,a,O,u,v]),x(()=>{l.current=K(r)},[]),n.createElement(o,{cycleValues:l.current,...t})},H=({currentValue:o,items:t})=>o!=null&&t.find(e=>e.value===o&&e.type!=="reset"),z=({currentValue:o,items:t})=>{let e=H({currentValue:o,items:t});if(e)return e.icon},U=({currentValue:o,items:t})=>{let e=H({currentValue:o,items:t});if(e)return e.title},j=({right:o,title:t,value:e,icon:r,hideIcon:a,onClick:d,currentValue:S})=>{let s=r&&n.createElement(k,{style:{opacity:1},icon:r}),l={id:e??"_reset",active:S===e,right:o,title:t,icon:r,onClick:d};return r&&!a&&(l.icon=s),l},q=$(({id:o,name:t,description:e,toolbar:{icon:r,items:a,title:d,preventDynamicIcon:S,dynamicTitle:s}})=>{let[l,p]=h(),[v,O]=R(!1),u=l[o],m=!!u,i=r,c=d;S||(i=z({currentValue:u,items:a})||i),s&&(c=U({currentValue:u,items:a})||c),!c&&!i&&console.warn(`Toolbar '${t}' has no title or icon`);let T=I(y=>{p({[o]:y})},[u,p]);return n.createElement(D,{placement:"top",tooltip:({onHide:y})=>{let F=a.filter(({type:E})=>{let A=!0;return E==="reset"&&!u&&(A=!1),A}).map(E=>j({...E,currentValue:u,onClick:()=>{T(E.value),y()}}));return n.createElement(V,{links:F})},closeOnOutsideClick:!0,onVisibleChange:O},n.createElement(W,{active:v||m,description:e||"",icon:i,title:c||""}))}),Z={type:"item",value:""},J=(o,t)=>({...t,name:t.name||o,description:t.description||o,toolbar:{...t.toolbar,items:t.toolbar.items.map(e=>{let r=typeof e=="string"?{value:e,title:e}:e;return r.type==="reset"&&t.toolbar.icon&&(r.icon=t.toolbar.icon,r.hideIcon=!0),{...Z,...r}})}}),Q=()=>{let o=P(),t=Object.keys(o).filter(e=>!!o[e].toolbar);return t.length?n.createElement(n.Fragment,null,n.createElement(w,null),t.map(e=>{let r=J(e,o[e]);return n.createElement(q,{key:e,id:e,...r})})):null};g.register(b,()=>g.add(b,{title:b,type:B.TOOL,match:({tabId:o})=>!o,render:()=>n.createElement(Q,null)}));})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | @storybook/cli - Storybook 7 | 8 | 9 | 10 | 11 | 12 | 19 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 61 | 62 | 63 | 64 | 65 |
66 | 67 | 68 | 129 | 130 | 131 | 162 | 163 | 164 | 165 | 166 | 167 | 168 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "lint_demo", 3 | "version": "1.0.17", 4 | "description": "a lint demo ", 5 | "main": "./dist/cjs/index.js", 6 | "module": "./dist/esm/index.js", 7 | "types": "./dist/index.d.ts", 8 | "exports": { 9 | ".": { 10 | "import": "./dist/esm/index.js", 11 | "require": "./dist/cjs/index.js" 12 | } 13 | }, 14 | "files": [ 15 | "dist" 16 | ], 17 | "author": "xxx", 18 | "license": "MIT", 19 | "private": false, 20 | "browserslist": [ 21 | ">0.2%", 22 | "not dead", 23 | "ie >= 9", 24 | "not op_mini all" 25 | ], 26 | "engines": { 27 | "node": ">=18" 28 | }, 29 | "scripts": { 30 | "commit": "git-cz", 31 | "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s", 32 | "prepare": "husky install", 33 | "lint": "npm run lint-eslint && npm run lint-stylelint", 34 | "lint-eslint": "eslint -c .eslintrc.js --ext .ts,.tsx,.js src", 35 | "lint-stylelint": "stylelint --config .stylelintrc.js src/**/*.{less,css,scss}", 36 | "start": "cross-env NODE_ENV=development webpack-dev-server --config ./scripts/config/webpack.dev.js", 37 | "build": "cross-env NODE_ENV=production webpack --config ./scripts/config/webpack.prod.js", 38 | "storybook": "storybook dev -p 6006", 39 | "build-storybook": "storybook build", 40 | "buildRc": "rollup -c", 41 | "release": "node ./scripts/release.js" 42 | }, 43 | "husky": { 44 | "hooks": { 45 | "pre-commit": "lint-staged", 46 | "commit-msg": "commitlint --config .commitlintrc.js -E HUSKY_GIT_PARAMS" 47 | } 48 | }, 49 | "lint-staged": { 50 | "*.{ts,tsx,js}": [ 51 | "eslint --config .eslintrc.js" 52 | ], 53 | "*.{css,less,scss}": [ 54 | "stylelint --config .stylelintrc.js" 55 | ], 56 | "*.{ts,tsx,js,json,html,yml,css,less,scss,md}": [ 57 | "prettier --write" 58 | ] 59 | }, 60 | "devDependencies": { 61 | "@babel/core": "7.24.0", 62 | "@babel/plugin-transform-runtime": "7.24.0", 63 | "@babel/preset-env": "7.24.0", 64 | "@babel/preset-react": "7.23.3", 65 | "@babel/preset-typescript": "7.23.3", 66 | "@chromatic-com/storybook": "^1.3.1", 67 | "@commitlint/cli": "19.2.0", 68 | "@commitlint/config-conventional": "19.1.0", 69 | "@rollup/plugin-commonjs": "25.0.7", 70 | "@rollup/plugin-node-resolve": "15.2.3", 71 | "@rollup/plugin-typescript": "11.1.6", 72 | "@storybook/addon-essentials": "^8.0.6", 73 | "@storybook/addon-interactions": "^8.0.6", 74 | "@storybook/addon-links": "^8.0.6", 75 | "@storybook/addon-onboarding": "^8.0.6", 76 | "@storybook/blocks": "^8.0.6", 77 | "@storybook/react": "^8.0.6", 78 | "@storybook/react-vite": "^8.0.6", 79 | "@storybook/test": "^8.0.6", 80 | "@types/react": "18.2.66", 81 | "@types/react-dom": "18.2.22", 82 | "@typescript-eslint/eslint-plugin": "^6.4.0", 83 | "@typescript-eslint/parser": "7.2.0", 84 | "autoprefixer": "10.4.18", 85 | "babel-loader": "9.1.3", 86 | "clean-webpack-plugin": "4.0.0", 87 | "commitizen": "^4.3.0", 88 | "commitlint-config-cz": "^0.13.3", 89 | "conventional-changelog-cli": "4.1.0", 90 | "cross-env": "7.0.3", 91 | "css-loader": "6.10.0", 92 | "cz-conventional-changelog": "^3.3.0", 93 | "cz-customizable": "^7.0.0", 94 | "eslint": "^8.0.1", 95 | "eslint-config-prettier": "9.1.0", 96 | "eslint-config-standard-with-typescript": "^43.0.1", 97 | "eslint-import-resolver-typescript": "3.6.1", 98 | "eslint-plugin-import": "^2.25.2", 99 | "eslint-plugin-n": "^15.0.0 || ^16.0.0 ", 100 | "eslint-plugin-promise": "^6.0.0", 101 | "eslint-plugin-react": "^7.34.1", 102 | "eslint-plugin-storybook": "^0.8.0", 103 | "html-webpack-plugin": "5.6.0", 104 | "husky": "9.0.11", 105 | "less": "4.2.0", 106 | "less-loader": "12.2.0", 107 | "lint-staged": "15.2.2", 108 | "node-sass": "9.0.0", 109 | "postcss": "8.4.35", 110 | "postcss-flexbugs-fixes": "5.0.2", 111 | "postcss-loader": "8.1.1", 112 | "postcss-normalize": "10.0.1", 113 | "postcss-preset-env": "9.5.1", 114 | "prettier": "3.2.5", 115 | "rollup": "4.13.0", 116 | "rollup-plugin-dts": "6.1.0", 117 | "rollup-plugin-postcss": "4.0.2", 118 | "sass-loader": "14.1.1", 119 | "storybook": "^8.0.6", 120 | "style-loader": "3.3.4", 121 | "stylelint": "16.2.1", 122 | "stylelint-config-prettier": "9.0.5", 123 | "stylelint-config-rational-order": "0.1.2", 124 | "stylelint-config-standard": "36.0.0", 125 | "stylelint-declaration-block-no-ignored-properties": "2.8.0", 126 | "stylelint-prettier": "5.0.0", 127 | "typescript": "5.4.2", 128 | "vite": "^5.2.8", 129 | "webpack": "5.90.3", 130 | "webpack-cli": "5.1.4", 131 | "webpack-dev-server": "5.0.3", 132 | "webpack-merge": "5.10.0" 133 | }, 134 | "config": { 135 | "commitizen": { 136 | "path": "node_modules/cz-customizable" 137 | } 138 | }, 139 | "dependencies": { 140 | "@babel/runtime-corejs3": "7.24.0", 141 | "axios": "^1.6.8", 142 | "react": "18.2.0", 143 | "react-dom": "18.2.0" 144 | } 145 | } 146 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-measure-8/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var t=__REACT__,{Children:B,Component:f,Fragment:R,Profiler:P,PureComponent:L,StrictMode:E,Suspense:D,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:w,cloneElement:M,createContext:v,createElement:x,createFactory:H,createRef:U,forwardRef:F,isValidElement:N,lazy:G,memo:W,startTransition:K,unstable_act:Y,useCallback:u,useContext:V,useDebugValue:q,useDeferredValue:Z,useEffect:d,useId:z,useImperativeHandle:J,useInsertionEffect:Q,useLayoutEffect:$,useMemo:j,useReducer:X,useRef:oo,useState:no,useSyncExternalStore:eo,useTransition:co,version:to}=__REACT__;var io=__STORYBOOK_API__,{ActiveTabs:so,Consumer:uo,ManagerContext:mo,Provider:po,addons:l,combineParameters:So,controlOrMetaKey:Co,controlOrMetaSymbol:ho,eventMatchesShortcut:bo,eventToShortcut:To,isMacLike:_o,isShortcutTaken:Ao,keyToSymbol:go,merge:yo,mockChannel:Oo,optionOrAltSymbol:ko,shortcutMatchesShortcut:Bo,shortcutToHumanString:fo,types:m,useAddonState:Ro,useArgTypes:Po,useArgs:Lo,useChannel:Eo,useGlobalTypes:Do,useGlobals:p,useParameter:wo,useSharedState:Mo,useStoryPrepared:vo,useStorybookApi:S,useStorybookState:xo}=__STORYBOOK_API__;var Go=__STORYBOOK_COMPONENTS__,{A:Wo,ActionBar:Ko,AddonPanel:Yo,Badge:Vo,Bar:qo,Blockquote:Zo,Button:zo,ClipboardCode:Jo,Code:Qo,DL:$o,Div:jo,DocumentWrapper:Xo,EmptyTabContent:on,ErrorFormatter:nn,FlexBar:en,Form:cn,H1:tn,H2:rn,H3:In,H4:an,H5:ln,H6:sn,HR:un,IconButton:C,IconButtonSkeleton:dn,Icons:mn,Img:pn,LI:Sn,Link:Cn,ListItem:hn,Loader:bn,OL:Tn,P:_n,Placeholder:An,Pre:gn,ResetWrapper:yn,ScrollArea:On,Separator:kn,Spaced:Bn,Span:fn,StorybookIcon:Rn,StorybookLogo:Pn,Symbols:Ln,SyntaxHighlighter:En,TT:Dn,TabBar:wn,TabButton:Mn,TabWrapper:vn,Table:xn,Tabs:Hn,TabsState:Un,TooltipLinkList:Fn,TooltipMessage:Nn,TooltipNote:Gn,UL:Wn,WithTooltip:Kn,WithTooltipPure:Yn,Zoom:Vn,codeCommon:qn,components:Zn,createCopyToClipboardFunction:zn,getStoryHref:Jn,icons:Qn,interleaveSeparators:$n,nameSpaceClassNames:jn,resetComponents:Xn,withReset:oe}=__STORYBOOK_COMPONENTS__;var re=__STORYBOOK_ICONS__,{AccessibilityAltIcon:Ie,AccessibilityIcon:ae,AddIcon:le,AdminIcon:ie,AlertAltIcon:se,AlertIcon:ue,AlignLeftIcon:de,AlignRightIcon:me,AppleIcon:pe,ArrowDownIcon:Se,ArrowLeftIcon:Ce,ArrowRightIcon:he,ArrowSolidDownIcon:be,ArrowSolidLeftIcon:Te,ArrowSolidRightIcon:_e,ArrowSolidUpIcon:Ae,ArrowUpIcon:ge,AzureDevOpsIcon:ye,BackIcon:Oe,BasketIcon:ke,BatchAcceptIcon:Be,BatchDenyIcon:fe,BeakerIcon:Re,BellIcon:Pe,BitbucketIcon:Le,BoldIcon:Ee,BookIcon:De,BookmarkHollowIcon:we,BookmarkIcon:Me,BottomBarIcon:ve,BottomBarToggleIcon:xe,BoxIcon:He,BranchIcon:Ue,BrowserIcon:Fe,ButtonIcon:Ne,CPUIcon:Ge,CalendarIcon:We,CameraIcon:Ke,CategoryIcon:Ye,CertificateIcon:Ve,ChangedIcon:qe,ChatIcon:Ze,CheckIcon:ze,ChevronDownIcon:Je,ChevronLeftIcon:Qe,ChevronRightIcon:$e,ChevronSmallDownIcon:je,ChevronSmallLeftIcon:Xe,ChevronSmallRightIcon:oc,ChevronSmallUpIcon:nc,ChevronUpIcon:ec,ChromaticIcon:cc,ChromeIcon:tc,CircleHollowIcon:rc,CircleIcon:Ic,ClearIcon:ac,CloseAltIcon:lc,CloseIcon:ic,CloudHollowIcon:sc,CloudIcon:uc,CogIcon:dc,CollapseIcon:mc,CommandIcon:pc,CommentAddIcon:Sc,CommentIcon:Cc,CommentsIcon:hc,CommitIcon:bc,CompassIcon:Tc,ComponentDrivenIcon:_c,ComponentIcon:Ac,ContrastIcon:gc,ControlsIcon:yc,CopyIcon:Oc,CreditIcon:kc,CrossIcon:Bc,DashboardIcon:fc,DatabaseIcon:Rc,DeleteIcon:Pc,DiamondIcon:Lc,DirectionIcon:Ec,DiscordIcon:Dc,DocChartIcon:wc,DocListIcon:Mc,DocumentIcon:vc,DownloadIcon:xc,DragIcon:Hc,EditIcon:Uc,EllipsisIcon:Fc,EmailIcon:Nc,ExpandAltIcon:Gc,ExpandIcon:Wc,EyeCloseIcon:Kc,EyeIcon:Yc,FaceHappyIcon:Vc,FaceNeutralIcon:qc,FaceSadIcon:Zc,FacebookIcon:zc,FailedIcon:Jc,FastForwardIcon:Qc,FigmaIcon:$c,FilterIcon:jc,FlagIcon:Xc,FolderIcon:ot,FormIcon:nt,GDriveIcon:et,GithubIcon:ct,GitlabIcon:tt,GlobeIcon:rt,GoogleIcon:It,GraphBarIcon:at,GraphLineIcon:lt,GraphqlIcon:it,GridAltIcon:st,GridIcon:ut,GrowIcon:dt,HeartHollowIcon:mt,HeartIcon:pt,HomeIcon:St,HourglassIcon:Ct,InfoIcon:ht,ItalicIcon:bt,JumpToIcon:Tt,KeyIcon:_t,LightningIcon:At,LightningOffIcon:gt,LinkBrokenIcon:yt,LinkIcon:Ot,LinkedinIcon:kt,LinuxIcon:Bt,ListOrderedIcon:ft,ListUnorderedIcon:Rt,LocationIcon:Pt,LockIcon:Lt,MarkdownIcon:Et,MarkupIcon:Dt,MediumIcon:wt,MemoryIcon:Mt,MenuIcon:vt,MergeIcon:xt,MirrorIcon:Ht,MobileIcon:Ut,MoonIcon:Ft,NutIcon:Nt,OutboxIcon:Gt,OutlineIcon:Wt,PaintBrushIcon:Kt,PaperClipIcon:Yt,ParagraphIcon:Vt,PassedIcon:qt,PhoneIcon:Zt,PhotoDragIcon:zt,PhotoIcon:Jt,PinAltIcon:Qt,PinIcon:$t,PlayBackIcon:jt,PlayIcon:Xt,PlayNextIcon:or,PlusIcon:nr,PointerDefaultIcon:er,PointerHandIcon:cr,PowerIcon:tr,PrintIcon:rr,ProceedIcon:Ir,ProfileIcon:ar,PullRequestIcon:lr,QuestionIcon:ir,RSSIcon:sr,RedirectIcon:ur,ReduxIcon:dr,RefreshIcon:mr,ReplyIcon:pr,RepoIcon:Sr,RequestChangeIcon:Cr,RewindIcon:hr,RulerIcon:h,SearchIcon:br,ShareAltIcon:Tr,ShareIcon:_r,ShieldIcon:Ar,SideBySideIcon:gr,SidebarAltIcon:yr,SidebarAltToggleIcon:Or,SidebarIcon:kr,SidebarToggleIcon:Br,SpeakerIcon:fr,StackedIcon:Rr,StarHollowIcon:Pr,StarIcon:Lr,StickerIcon:Er,StopAltIcon:Dr,StopIcon:wr,StorybookIcon:Mr,StructureIcon:vr,SubtractIcon:xr,SunIcon:Hr,SupportIcon:Ur,SwitchAltIcon:Fr,SyncIcon:Nr,TabletIcon:Gr,ThumbsUpIcon:Wr,TimeIcon:Kr,TimerIcon:Yr,TransferIcon:Vr,TrashIcon:qr,TwitterIcon:Zr,TypeIcon:zr,UbuntuIcon:Jr,UndoIcon:Qr,UnfoldIcon:$r,UnlockIcon:jr,UnpinIcon:Xr,UploadIcon:oI,UserAddIcon:nI,UserAltIcon:eI,UserIcon:cI,UsersIcon:tI,VSCodeIcon:rI,VerifiedIcon:II,VideoIcon:aI,WandIcon:lI,WatchIcon:iI,WindowsIcon:sI,WrenchIcon:uI,YoutubeIcon:dI,ZoomIcon:mI,ZoomOutIcon:pI,ZoomResetIcon:SI,iconList:CI}=__STORYBOOK_ICONS__;var i="storybook/measure-addon",b=`${i}/tool`,T=()=>{let[r,c]=p(),{measureEnabled:I}=r,s=S(),a=u(()=>c({measureEnabled:!I}),[c,I]);return d(()=>{s.setAddonShortcut(i,{label:"Toggle Measure [M]",defaultShortcut:["M"],actionName:"measure",showInMenu:!1,action:a})},[a,s]),t.createElement(C,{key:b,active:I,title:"Enable measure",onClick:a},t.createElement(h,null))};l.register(i,()=>{l.add(b,{type:m.TOOL,title:"Measure",match:({viewMode:r,tabId:c})=>r==="story"&&!c,render:()=>t.createElement(T,null)})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-outline-9/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var t=__REACT__,{Children:f,Component:P,Fragment:R,Profiler:L,PureComponent:D,StrictMode:E,Suspense:w,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:v,cloneElement:x,createContext:H,createElement:M,createFactory:U,createRef:F,forwardRef:N,isValidElement:G,lazy:W,memo:u,startTransition:K,unstable_act:Y,useCallback:d,useContext:V,useDebugValue:q,useDeferredValue:Z,useEffect:m,useId:z,useImperativeHandle:J,useInsertionEffect:Q,useLayoutEffect:$,useMemo:j,useReducer:X,useRef:oo,useState:no,useSyncExternalStore:eo,useTransition:co,version:to}=__REACT__;var io=__STORYBOOK_API__,{ActiveTabs:so,Consumer:uo,ManagerContext:mo,Provider:po,addons:l,combineParameters:So,controlOrMetaKey:Co,controlOrMetaSymbol:ho,eventMatchesShortcut:Ao,eventToShortcut:bo,isMacLike:_o,isShortcutTaken:To,keyToSymbol:go,merge:yo,mockChannel:Oo,optionOrAltSymbol:ko,shortcutMatchesShortcut:Bo,shortcutToHumanString:fo,types:p,useAddonState:Po,useArgTypes:Ro,useArgs:Lo,useChannel:Do,useGlobalTypes:Eo,useGlobals:S,useParameter:wo,useSharedState:vo,useStoryPrepared:xo,useStorybookApi:C,useStorybookState:Ho}=__STORYBOOK_API__;var Go=__STORYBOOK_COMPONENTS__,{A:Wo,ActionBar:Ko,AddonPanel:Yo,Badge:Vo,Bar:qo,Blockquote:Zo,Button:zo,ClipboardCode:Jo,Code:Qo,DL:$o,Div:jo,DocumentWrapper:Xo,EmptyTabContent:on,ErrorFormatter:nn,FlexBar:en,Form:cn,H1:tn,H2:rn,H3:In,H4:an,H5:ln,H6:sn,HR:un,IconButton:h,IconButtonSkeleton:dn,Icons:mn,Img:pn,LI:Sn,Link:Cn,ListItem:hn,Loader:An,OL:bn,P:_n,Placeholder:Tn,Pre:gn,ResetWrapper:yn,ScrollArea:On,Separator:kn,Spaced:Bn,Span:fn,StorybookIcon:Pn,StorybookLogo:Rn,Symbols:Ln,SyntaxHighlighter:Dn,TT:En,TabBar:wn,TabButton:vn,TabWrapper:xn,Table:Hn,Tabs:Mn,TabsState:Un,TooltipLinkList:Fn,TooltipMessage:Nn,TooltipNote:Gn,UL:Wn,WithTooltip:Kn,WithTooltipPure:Yn,Zoom:Vn,codeCommon:qn,components:Zn,createCopyToClipboardFunction:zn,getStoryHref:Jn,icons:Qn,interleaveSeparators:$n,nameSpaceClassNames:jn,resetComponents:Xn,withReset:oe}=__STORYBOOK_COMPONENTS__;var re=__STORYBOOK_ICONS__,{AccessibilityAltIcon:Ie,AccessibilityIcon:ae,AddIcon:le,AdminIcon:ie,AlertAltIcon:se,AlertIcon:ue,AlignLeftIcon:de,AlignRightIcon:me,AppleIcon:pe,ArrowDownIcon:Se,ArrowLeftIcon:Ce,ArrowRightIcon:he,ArrowSolidDownIcon:Ae,ArrowSolidLeftIcon:be,ArrowSolidRightIcon:_e,ArrowSolidUpIcon:Te,ArrowUpIcon:ge,AzureDevOpsIcon:ye,BackIcon:Oe,BasketIcon:ke,BatchAcceptIcon:Be,BatchDenyIcon:fe,BeakerIcon:Pe,BellIcon:Re,BitbucketIcon:Le,BoldIcon:De,BookIcon:Ee,BookmarkHollowIcon:we,BookmarkIcon:ve,BottomBarIcon:xe,BottomBarToggleIcon:He,BoxIcon:Me,BranchIcon:Ue,BrowserIcon:Fe,ButtonIcon:Ne,CPUIcon:Ge,CalendarIcon:We,CameraIcon:Ke,CategoryIcon:Ye,CertificateIcon:Ve,ChangedIcon:qe,ChatIcon:Ze,CheckIcon:ze,ChevronDownIcon:Je,ChevronLeftIcon:Qe,ChevronRightIcon:$e,ChevronSmallDownIcon:je,ChevronSmallLeftIcon:Xe,ChevronSmallRightIcon:oc,ChevronSmallUpIcon:nc,ChevronUpIcon:ec,ChromaticIcon:cc,ChromeIcon:tc,CircleHollowIcon:rc,CircleIcon:Ic,ClearIcon:ac,CloseAltIcon:lc,CloseIcon:ic,CloudHollowIcon:sc,CloudIcon:uc,CogIcon:dc,CollapseIcon:mc,CommandIcon:pc,CommentAddIcon:Sc,CommentIcon:Cc,CommentsIcon:hc,CommitIcon:Ac,CompassIcon:bc,ComponentDrivenIcon:_c,ComponentIcon:Tc,ContrastIcon:gc,ControlsIcon:yc,CopyIcon:Oc,CreditIcon:kc,CrossIcon:Bc,DashboardIcon:fc,DatabaseIcon:Pc,DeleteIcon:Rc,DiamondIcon:Lc,DirectionIcon:Dc,DiscordIcon:Ec,DocChartIcon:wc,DocListIcon:vc,DocumentIcon:xc,DownloadIcon:Hc,DragIcon:Mc,EditIcon:Uc,EllipsisIcon:Fc,EmailIcon:Nc,ExpandAltIcon:Gc,ExpandIcon:Wc,EyeCloseIcon:Kc,EyeIcon:Yc,FaceHappyIcon:Vc,FaceNeutralIcon:qc,FaceSadIcon:Zc,FacebookIcon:zc,FailedIcon:Jc,FastForwardIcon:Qc,FigmaIcon:$c,FilterIcon:jc,FlagIcon:Xc,FolderIcon:ot,FormIcon:nt,GDriveIcon:et,GithubIcon:ct,GitlabIcon:tt,GlobeIcon:rt,GoogleIcon:It,GraphBarIcon:at,GraphLineIcon:lt,GraphqlIcon:it,GridAltIcon:st,GridIcon:ut,GrowIcon:dt,HeartHollowIcon:mt,HeartIcon:pt,HomeIcon:St,HourglassIcon:Ct,InfoIcon:ht,ItalicIcon:At,JumpToIcon:bt,KeyIcon:_t,LightningIcon:Tt,LightningOffIcon:gt,LinkBrokenIcon:yt,LinkIcon:Ot,LinkedinIcon:kt,LinuxIcon:Bt,ListOrderedIcon:ft,ListUnorderedIcon:Pt,LocationIcon:Rt,LockIcon:Lt,MarkdownIcon:Dt,MarkupIcon:Et,MediumIcon:wt,MemoryIcon:vt,MenuIcon:xt,MergeIcon:Ht,MirrorIcon:Mt,MobileIcon:Ut,MoonIcon:Ft,NutIcon:Nt,OutboxIcon:Gt,OutlineIcon:A,PaintBrushIcon:Wt,PaperClipIcon:Kt,ParagraphIcon:Yt,PassedIcon:Vt,PhoneIcon:qt,PhotoDragIcon:Zt,PhotoIcon:zt,PinAltIcon:Jt,PinIcon:Qt,PlayBackIcon:$t,PlayIcon:jt,PlayNextIcon:Xt,PlusIcon:or,PointerDefaultIcon:nr,PointerHandIcon:er,PowerIcon:cr,PrintIcon:tr,ProceedIcon:rr,ProfileIcon:Ir,PullRequestIcon:ar,QuestionIcon:lr,RSSIcon:ir,RedirectIcon:sr,ReduxIcon:ur,RefreshIcon:dr,ReplyIcon:mr,RepoIcon:pr,RequestChangeIcon:Sr,RewindIcon:Cr,RulerIcon:hr,SearchIcon:Ar,ShareAltIcon:br,ShareIcon:_r,ShieldIcon:Tr,SideBySideIcon:gr,SidebarAltIcon:yr,SidebarAltToggleIcon:Or,SidebarIcon:kr,SidebarToggleIcon:Br,SpeakerIcon:fr,StackedIcon:Pr,StarHollowIcon:Rr,StarIcon:Lr,StickerIcon:Dr,StopAltIcon:Er,StopIcon:wr,StorybookIcon:vr,StructureIcon:xr,SubtractIcon:Hr,SunIcon:Mr,SupportIcon:Ur,SwitchAltIcon:Fr,SyncIcon:Nr,TabletIcon:Gr,ThumbsUpIcon:Wr,TimeIcon:Kr,TimerIcon:Yr,TransferIcon:Vr,TrashIcon:qr,TwitterIcon:Zr,TypeIcon:zr,UbuntuIcon:Jr,UndoIcon:Qr,UnfoldIcon:$r,UnlockIcon:jr,UnpinIcon:Xr,UploadIcon:oI,UserAddIcon:nI,UserAltIcon:eI,UserIcon:cI,UsersIcon:tI,VSCodeIcon:rI,VerifiedIcon:II,VideoIcon:aI,WandIcon:lI,WatchIcon:iI,WindowsIcon:sI,WrenchIcon:uI,YoutubeIcon:dI,ZoomIcon:mI,ZoomOutIcon:pI,ZoomResetIcon:SI,iconList:CI}=__STORYBOOK_ICONS__;var i="storybook/outline",b="outline",_=u(function(){let[c,r]=S(),s=C(),I=[!0,"true"].includes(c[b]),a=d(()=>r({[b]:!I}),[I]);return m(()=>{s.setAddonShortcut(i,{label:"Toggle Outline",defaultShortcut:["alt","O"],actionName:"outline",showInMenu:!1,action:a})},[a,s]),t.createElement(h,{key:"outline",active:I,title:"Apply outlines to the preview",onClick:a},t.createElement(A,null))});l.register(i,()=>{l.add(i,{title:"Outline",type:p.TOOL,match:({viewMode:c,tabId:r})=>!!(c&&c.match(/^(story|docs)$/))&&!r,render:()=>t.createElement(_,null)})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | -------------------------------------------------------------------------------- /storybook-static/sb-manager/chunk-XP3HGWTR.js: -------------------------------------------------------------------------------- 1 | var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty;var __require=(x=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(x,{get:(a,b)=>(typeof require<"u"?require:a)[b]}):x)(function(x){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+x+'" is not supported')});var __commonJS=(cb,mod)=>function(){return mod||(0,cb[__getOwnPropNames(cb)[0]])((mod={exports:{}}).exports,mod),mod.exports};var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod));var require_memoizerific=__commonJS({"../../node_modules/memoizerific/memoizerific.js"(exports,module){(function(f){if(typeof exports=="object"&&typeof module<"u")module.exports=f();else if(typeof define=="function"&&define.amd)define([],f);else{var g;typeof window<"u"?g=window:typeof global<"u"?g=global:typeof self<"u"?g=self:g=this,g.memoizerific=f()}})(function(){var define2,module2,exports2;return function e(t,n,r){function s(o2,u){if(!n[o2]){if(!t[o2]){var a=typeof __require=="function"&&__require;if(!u&&a)return a(o2,!0);if(i)return i(o2,!0);var f=new Error("Cannot find module '"+o2+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o2]={exports:{}};t[o2][0].call(l.exports,function(e2){var n2=t[o2][1][e2];return s(n2||e2)},l,l.exports,e,t,n,r)}return n[o2].exports}for(var i=typeof __require=="function"&&__require,o=0;o=0)return this.lastItem=this.list[index],this.list[index].val},Similar.prototype.set=function(key,val){var index;return this.lastItem&&this.isEqual(this.lastItem.key,key)?(this.lastItem.val=val,this):(index=this.indexOf(key),index>=0?(this.lastItem=this.list[index],this.list[index].val=val,this):(this.lastItem={key,val},this.list.push(this.lastItem),this.size++,this))},Similar.prototype.delete=function(key){var index;if(this.lastItem&&this.isEqual(this.lastItem.key,key)&&(this.lastItem=void 0),index=this.indexOf(key),index>=0)return this.size--,this.list.splice(index,1)[0]},Similar.prototype.has=function(key){var index;return this.lastItem&&this.isEqual(this.lastItem.key,key)?!0:(index=this.indexOf(key),index>=0?(this.lastItem=this.list[index],!0):!1)},Similar.prototype.forEach=function(callback,thisArg){var i;for(i=0;i0&&(lruPath[argsLengthMinusOne]={cacheItem:currentCache,arg:arguments[argsLengthMinusOne]},isMemoized?moveToMostRecentLru(lru,lruPath):lru.push(lruPath),lru.length>limit&&removeCachedResult(lru.shift())),memoizerific.wasMemoized=isMemoized,memoizerific.numArgs=argsLengthMinusOne+1,fnResult};return memoizerific.limit=limit,memoizerific.wasMemoized=!1,memoizerific.cache=cache,memoizerific.lru=lru,memoizerific}};function moveToMostRecentLru(lru,lruPath){var lruLen=lru.length,lruPathLen=lruPath.length,isMatch,i,ii;for(i=0;i=0&&(currentLru=removedLru[i],tmp=currentLru.cacheItem.get(currentLru.arg),!tmp||!tmp.size);i--)currentLru.cacheItem.delete(currentLru.arg)}function isEqual(val1,val2){return val1===val2||val1!==val1&&val2!==val2}},{"map-or-similar":1}]},{},[3])(3)})}});var __create2=Object.create,__defProp2=Object.defineProperty,__getOwnPropDesc2=Object.getOwnPropertyDescriptor,__getOwnPropNames2=Object.getOwnPropertyNames,__getProtoOf2=Object.getPrototypeOf,__hasOwnProp2=Object.prototype.hasOwnProperty,__commonJS2=(cb,mod)=>function(){return mod||(0,cb[__getOwnPropNames2(cb)[0]])((mod={exports:{}}).exports,mod),mod.exports},__copyProps2=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames2(from))!__hasOwnProp2.call(to,key)&&key!==except&&__defProp2(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc2(from,key))||desc.enumerable});return to},__toESM2=(mod,isNodeMode,target)=>(target=mod!=null?__create2(__getProtoOf2(mod)):{},__copyProps2(isNodeMode||!mod||!mod.__esModule?__defProp2(target,"default",{value:mod,enumerable:!0}):target,mod));export{__commonJS,__export,__toESM,require_memoizerific,__commonJS2,__toESM2}; 2 | -------------------------------------------------------------------------------- /storybook-static/sb-manager/globals-runtime.js: -------------------------------------------------------------------------------- 1 | import{TELEMETRY_ERROR,UncaughtManagerError,dist_exports as dist_exports2,dist_exports2 as dist_exports3,dist_exports3 as dist_exports4,dist_exports4 as dist_exports5,dist_exports5 as dist_exports6,dist_exports6 as dist_exports7,dist_exports7 as dist_exports9,manager_errors_exports}from"./chunk-RHK3WMPG.js";import"./chunk-TZAR34JC.js";import"./chunk-VMGB76WP.js";import{dist_exports,dist_exports2 as dist_exports8,require_react,require_react_dom,scope}from"./chunk-UOBNU442.js";import{__commonJS,__toESM}from"./chunk-XP3HGWTR.js";var require_browser_dtector_umd_min=__commonJS({"../../node_modules/browser-dtector/browser-dtector.umd.min.js"(exports,module){(function(e,o){typeof exports=="object"&&typeof module<"u"?module.exports=o():typeof define=="function"&&define.amd?define(o):(e=typeof globalThis<"u"?globalThis:e||self).BrowserDetector=o()})(exports,function(){"use strict";function e(e2,o2){for(var r2=0;r21&&arguments[1]!==void 0?arguments[1]:-1,"})?")),r2=Number(e2).toString().match(o2);return r2?r2[0]:null},i=function(){return typeof window<"u"?window.navigator:null},t=function(){function t2(e2){var o2;(function(e3,o3){if(!(e3 instanceof o3))throw new TypeError("Cannot call a class as a function")})(this,t2),this.userAgent=e2||((o2=i())===null||o2===void 0?void 0:o2.userAgent)||null}var a,l,s;return a=t2,l=[{key:"parseUserAgent",value:function(e2){var t3,a2,l2,s2={},c=e2||this.userAgent||"",d=c.toLowerCase().replace(/\s\s+/g," "),u=/(edge)\/([\w.]+)/.exec(d)||/(edg)[/]([\w.]+)/.exec(d)||/(opr)[/]([\w.]+)/.exec(d)||/(opt)[/]([\w.]+)/.exec(d)||/(fxios)[/]([\w.]+)/.exec(d)||/(edgios)[/]([\w.]+)/.exec(d)||/(jsdom)[/]([\w.]+)/.exec(d)||/(samsungbrowser)[/]([\w.]+)/.exec(d)||/(electron)[/]([\w.]+)/.exec(d)||/(chrome)[/]([\w.]+)/.exec(d)||/(crios)[/]([\w.]+)/.exec(d)||/(opios)[/]([\w.]+)/.exec(d)||/(version)(applewebkit)[/]([\w.]+).*(safari)[/]([\w.]+)/.exec(d)||/(webkit)[/]([\w.]+).*(version)[/]([\w.]+).*(safari)[/]([\w.]+)/.exec(d)||/(applewebkit)[/]([\w.]+).*(safari)[/]([\w.]+)/.exec(d)||/(webkit)[/]([\w.]+)/.exec(d)||/(opera)(?:.*version|)[/]([\w.]+)/.exec(d)||/(msie) ([\w.]+)/.exec(d)||/(fennec)[/]([\w.]+)/.exec(d)||d.indexOf("trident")>=0&&/(rv)(?::| )([\w.]+)/.exec(d)||d.indexOf("compatible")<0&&/(mozilla)(?:.*? rv:([\w.]+)|)/.exec(d)||[],f=/(ipad)/.exec(d)||/(ipod)/.exec(d)||/(iphone)/.exec(d)||/(jsdom)/.exec(d)||/(windows phone)/.exec(d)||/(xbox)/.exec(d)||/(win)/.exec(d)||/(tablet)/.exec(d)||/(android)/.test(d)&&/(mobile)/.test(d)===!1&&["androidTablet"]||/(android)/.exec(d)||/(mac)/.exec(d)||/(linux)/.exec(d)||/(cros)/.exec(d)||[],p=u[5]||u[3]||u[1]||null,w=f[0]||null,x=u[4]||u[2]||null,b=i();p==="chrome"&&typeof(b==null||(t3=b.brave)===null||t3===void 0?void 0:t3.isBrave)=="function"&&(p="brave"),p&&(s2[p]=!0),w&&(s2[w]=!0);var v=!!(s2.tablet||s2.android||s2.androidTablet),m=!!(s2.ipad||s2.tablet||s2.androidTablet),g=!!(s2.android||s2.androidTablet||s2.tablet||s2.ipad||s2.ipod||s2.iphone||s2["windows phone"]),h=!!(s2.cros||s2.mac||s2.linux||s2.win),y=!!(s2.brave||s2.chrome||s2.crios||s2.opr||s2.safari||s2.edg||s2.electron),A=!!(s2.msie||s2.rv);return{name:(a2=o[p])!==null&&a2!==void 0?a2:null,platform:(l2=r[w])!==null&&l2!==void 0?l2:null,userAgent:c,version:x,shortVersion:x?n(parseFloat(x),2):null,isAndroid:v,isTablet:m,isMobile:g,isDesktop:h,isWebkit:y,isIE:A}}},{key:"getBrowserInfo",value:function(){var e2=this.parseUserAgent();return{name:e2.name,platform:e2.platform,userAgent:e2.userAgent,version:e2.version,shortVersion:e2.shortVersion}}}],s=[{key:"VERSION",get:function(){return"3.4.0"}}],l&&e(a.prototype,l),s&&e(a,s),Object.defineProperty(a,"prototype",{writable:!1}),t2}();return t})}});var REACT=__toESM(require_react()),REACT_DOM=__toESM(require_react_dom());var globalsNameValueMap={react:REACT,"react-dom":REACT_DOM,"@storybook/components":dist_exports9,"@storybook/channels":dist_exports6,"@storybook/core-events":dist_exports3,"@storybook/core-events/manager-errors":manager_errors_exports,"@storybook/router":dist_exports2,"@storybook/theming":dist_exports8,"@storybook/icons":dist_exports5,"@storybook/manager-api":dist_exports7,"@storybook/client-logger":dist_exports,"@storybook/types":dist_exports4};var globalsNameReferenceMap={react:"__REACT__","react-dom":"__REACT_DOM__","@storybook/components":"__STORYBOOK_COMPONENTS__","@storybook/channels":"__STORYBOOK_CHANNELS__","@storybook/core-events":"__STORYBOOK_CORE_EVENTS__","@storybook/core-events/manager-errors":"__STORYBOOK_CORE_EVENTS_MANAGER_ERRORS__","@storybook/router":"__STORYBOOK_ROUTER__","@storybook/theming":"__STORYBOOK_THEMING__","@storybook/icons":"__STORYBOOK_ICONS__","@storybook/manager-api":"__STORYBOOK_API__","@storybook/client-logger":"__STORYBOOK_CLIENT_LOGGER__","@storybook/types":"__STORYBOOK_TYPES__"},globalPackages=Object.keys(globalsNameReferenceMap);var import_browser_dtector=__toESM(require_browser_dtector_umd_min()),browserInfo;function getBrowserInfo(){return browserInfo||(browserInfo=new import_browser_dtector.default(scope.navigator?.userAgent).getBrowserInfo()),browserInfo}var errorMessages=["ResizeObserver loop completed with undelivered notifications.","ResizeObserver loop limit exceeded","Script error."],shouldSkipError=error=>errorMessages.includes(error?.message);function prepareForTelemetry(originalError){let error=originalError;return(originalError.target===scope||originalError.currentTarget===scope||originalError.srcElement===scope)&&(error=new Error(originalError.message),error.name=originalError.name||error.name),originalError.fromStorybook||(error=new UncaughtManagerError({error})),error.browserInfo=getBrowserInfo(),error}globalPackages.forEach(key=>{scope[globalsNameReferenceMap[key]]=globalsNameValueMap[key]});scope.sendTelemetryError=error=>{shouldSkipError(error)||scope.__STORYBOOK_ADDONS_CHANNEL__.emit(TELEMETRY_ERROR,prepareForTelemetry(error))};scope.addEventListener("error",args=>{let error=args.error||args;scope.sendTelemetryError(error)});scope.addEventListener("unhandledrejection",({reason})=>{scope.sendTelemetryError(reason)}); 2 | -------------------------------------------------------------------------------- /storybook-static/assets/index-BBkUAzwr.js: -------------------------------------------------------------------------------- 1 | function A(e,t){for(var r=0;rn[u]})}}}return Object.freeze(Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}))}var X=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function D(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}function Z(e){if(e.__esModule)return e;var t=e.default;if(typeof t=="function"){var r=function n(){return this instanceof n?Reflect.construct(t,arguments,this.constructor):t.apply(this,arguments)};r.prototype=t.prototype}else r={};return Object.defineProperty(r,"__esModule",{value:!0}),Object.keys(e).forEach(function(n){var u=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,u.get?u:{enumerable:!0,get:function(){return e[n]}})}),r}var R={exports:{}},o={};/** 2 | * @license React 3 | * react.production.min.js 4 | * 5 | * Copyright (c) Facebook, Inc. and its affiliates. 6 | * 7 | * This source code is licensed under the MIT license found in the 8 | * LICENSE file in the root directory of this source tree. 9 | */var y=Symbol.for("react.element"),M=Symbol.for("react.portal"),V=Symbol.for("react.fragment"),F=Symbol.for("react.strict_mode"),N=Symbol.for("react.profiler"),U=Symbol.for("react.provider"),q=Symbol.for("react.context"),L=Symbol.for("react.forward_ref"),z=Symbol.for("react.suspense"),B=Symbol.for("react.memo"),H=Symbol.for("react.lazy"),w=Symbol.iterator;function G(e){return e===null||typeof e!="object"?null:(e=w&&e[w]||e["@@iterator"],typeof e=="function"?e:null)}var O={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},k=Object.assign,$={};function p(e,t,r){this.props=e,this.context=t,this.refs=$,this.updater=r||O}p.prototype.isReactComponent={};p.prototype.setState=function(e,t){if(typeof e!="object"&&typeof e!="function"&&e!=null)throw Error("setState(...): takes an object of state variables to update or a function which returns an object of state variables.");this.updater.enqueueSetState(this,e,t,"setState")};p.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,"forceUpdate")};function C(){}C.prototype=p.prototype;function v(e,t,r){this.props=e,this.context=t,this.refs=$,this.updater=r||O}var b=v.prototype=new C;b.constructor=v;k(b,p.prototype);b.isPureReactComponent=!0;var E=Array.isArray,P=Object.prototype.hasOwnProperty,S={current:null},x={key:!0,ref:!0,__self:!0,__source:!0};function I(e,t,r){var n,u={},c=null,s=null;if(t!=null)for(n in t.ref!==void 0&&(s=t.ref),t.key!==void 0&&(c=""+t.key),t)P.call(t,n)&&!x.hasOwnProperty(n)&&(u[n]=t[n]);var f=arguments.length-2;if(f===1)u.children=r;else if(10,a=0,s=0,u=r?1:.5,g=r?n*2:0;return e==="padding"?f=m=>i[m]*u+g:e==="border"?f=m=>i[m]+l[m]*u+g:e==="margin"&&(f=m=>i[m]+l[m]+o[m]*u+g),t==="top"?s=-f("top"):t==="right"?a=f("right"):t==="bottom"?s=f("bottom"):t==="left"&&(a=-f("left")),{offsetX:a,offsetY:s}}function x(e,t){return Math.abs(e.x-t.x){let f=l&&n.position==="center"?it(e,t,n):et(e,t,n,i[r-1],l);i[r]=f})}function lt(e,t,o,l){let i=o.reduce((n,r)=>{var f;return Object.prototype.hasOwnProperty.call(n,r.position)||(n[r.position]=[]),(f=n[r.position])==null||f.push(r),n},{});i.top&&E(e,t,i.top,l),i.right&&E(e,t,i.right,l),i.bottom&&E(e,t,i.bottom,l),i.left&&E(e,t,i.left,l),i.center&&E(e,t,i.center,l)}var L={margin:"#f6b26ba8",border:"#ffe599a8",padding:"#93c47d8c",content:"#6fa8dca8"},B=30;function p(e){return parseInt(e.replace("px",""),10)}function b(e){return Number.isInteger(e)?e:e.toFixed(2)}function P(e){return e.filter(t=>t.text!==0&&t.text!=="0")}function nt(e){let t={top:d.window.scrollY,bottom:d.window.scrollY+d.window.innerHeight,left:d.window.scrollX,right:d.window.scrollX+d.window.innerWidth},o={top:Math.abs(t.top-e.top),bottom:Math.abs(t.bottom-e.bottom),left:Math.abs(t.left-e.left),right:Math.abs(t.right-e.right)};return{x:o.left>o.right?"left":"right",y:o.top>o.bottom?"top":"bottom"}}function ft(e){let t=d.getComputedStyle(e),{top:o,left:l,right:i,bottom:n,width:r,height:f}=e.getBoundingClientRect(),{marginTop:a,marginBottom:s,marginLeft:u,marginRight:g,paddingTop:m,paddingBottom:v,paddingLeft:k,paddingRight:F,borderBottomWidth:I,borderTopWidth:D,borderLeftWidth:$,borderRightWidth:N}=t;o=o+d.window.scrollY,l=l+d.window.scrollX,n=n+d.window.scrollY,i=i+d.window.scrollX;let y={top:p(a),bottom:p(s),left:p(u),right:p(g)},q={top:p(m),bottom:p(v),left:p(k),right:p(F)},z={top:p(D),bottom:p(I),left:p($),right:p(N)},_={top:o-y.top,bottom:n+y.bottom,left:l-y.left,right:i+y.right};return{margin:y,padding:q,border:z,top:o,left:l,bottom:n,right:i,width:r,height:f,extremities:_,floatingAlignment:nt(_)}}function rt(e,{margin:t,width:o,height:l,top:i,left:n,bottom:r,right:f}){let a=l+t.bottom+t.top;e.fillStyle=L.margin,e.fillRect(n,i-t.top,o,t.top),e.fillRect(f,i-t.top,t.right,a),e.fillRect(n,r,o,t.bottom),e.fillRect(n-t.left,i-t.top,t.left,a);let s=[{type:"margin",text:b(t.top),position:"top"},{type:"margin",text:b(t.right),position:"right"},{type:"margin",text:b(t.bottom),position:"bottom"},{type:"margin",text:b(t.left),position:"left"}];return P(s)}function at(e,{padding:t,border:o,width:l,height:i,top:n,left:r,bottom:f,right:a}){let s=l-o.left-o.right,u=i-t.top-t.bottom-o.top-o.bottom;e.fillStyle=L.padding,e.fillRect(r+o.left,n+o.top,s,t.top),e.fillRect(a-t.right-o.right,n+t.top+o.top,t.right,u),e.fillRect(r+o.left,f-t.bottom-o.bottom,s,t.bottom),e.fillRect(r+o.left,n+t.top+o.top,t.left,u);let g=[{type:"padding",text:t.top,position:"top"},{type:"padding",text:t.right,position:"right"},{type:"padding",text:t.bottom,position:"bottom"},{type:"padding",text:t.left,position:"left"}];return P(g)}function st(e,{border:t,width:o,height:l,top:i,left:n,bottom:r,right:f}){let a=l-t.top-t.bottom;e.fillStyle=L.border,e.fillRect(n,i,o,t.top),e.fillRect(n,r-t.bottom,o,t.bottom),e.fillRect(n,i+t.top,t.left,a),e.fillRect(f-t.right,i+t.top,t.right,a);let s=[{type:"border",text:t.top,position:"top"},{type:"border",text:t.right,position:"right"},{type:"border",text:t.bottom,position:"bottom"},{type:"border",text:t.left,position:"left"}];return P(s)}function ht(e,{padding:t,border:o,width:l,height:i,top:n,left:r}){let f=l-o.left-o.right-t.left-t.right,a=i-t.top-t.bottom-o.top-o.bottom;return e.fillStyle=L.content,e.fillRect(r+o.left+t.left,n+o.top+t.top,f,a),[{type:"content",position:"center",text:`${b(f)} x ${b(a)}`}]}function ut(e){return t=>{if(e&&t){let o=ft(e),l=rt(t,o),i=at(t,o),n=st(t,o),r=ht(t,o),f=o.width<=B*3||o.height<=B;lt(t,o,[...r,...i,...n,...l],f)}}}function dt(e){V(ut(e))}var mt=(e,t)=>{let o=d.document.elementFromPoint(e,t),l=i=>{if(i&&i.shadowRoot){let n=i.shadowRoot.elementFromPoint(e,t);return i.isEqualNode(n)?i:n.shadowRoot?l(n):n}return i};return l(o)||o},O,M={x:0,y:0};function R(e,t){O=mt(e,t),dt(O)}var gt=(e,t)=>{let{measureEnabled:o}=t.globals;return T(()=>{let l=i=>{window.requestAnimationFrame(()=>{i.stopPropagation(),M.x=i.clientX,M.y=i.clientY})};return document.addEventListener("pointermove",l),()=>{document.removeEventListener("pointermove",l)}},[]),T(()=>{let l=n=>{window.requestAnimationFrame(()=>{n.stopPropagation(),R(n.clientX,n.clientY)})},i=()=>{window.requestAnimationFrame(()=>{Z()})};return t.viewMode==="story"&&o&&(document.addEventListener("pointerover",l),U(),window.addEventListener("resize",i),R(M.x,M.y)),()=>{window.removeEventListener("resize",i),G()}},[o,t.viewMode]),e()},pt="measureEnabled",ct=[gt],wt={[pt]:!1};export{ct as decorators,wt as globals}; 2 | -------------------------------------------------------------------------------- /storybook-static/sb-manager/globals-module-info.js: -------------------------------------------------------------------------------- 1 | var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var globals_module_info_exports={};__export(globals_module_info_exports,{globalsModuleInfoMap:()=>globalsModuleInfoMap});module.exports=__toCommonJS(globals_module_info_exports);var exports_default={react:["Children","Component","Fragment","Profiler","PureComponent","StrictMode","Suspense","__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED","cloneElement","createContext","createElement","createFactory","createRef","forwardRef","isValidElement","lazy","memo","startTransition","unstable_act","useCallback","useContext","useDebugValue","useDeferredValue","useEffect","useId","useImperativeHandle","useInsertionEffect","useLayoutEffect","useMemo","useReducer","useRef","useState","useSyncExternalStore","useTransition","version"],"react-dom":["__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED","createPortal","createRoot","findDOMNode","flushSync","hydrate","hydrateRoot","render","unmountComponentAtNode","unstable_batchedUpdates","unstable_renderSubtreeIntoContainer","version"],"@storybook/components":["A","ActionBar","AddonPanel","Badge","Bar","Blockquote","Button","ClipboardCode","Code","DL","Div","DocumentWrapper","EmptyTabContent","ErrorFormatter","FlexBar","Form","H1","H2","H3","H4","H5","H6","HR","IconButton","IconButtonSkeleton","Icons","Img","LI","Link","ListItem","Loader","OL","P","Placeholder","Pre","ResetWrapper","ScrollArea","Separator","Spaced","Span","StorybookIcon","StorybookLogo","Symbols","SyntaxHighlighter","TT","TabBar","TabButton","TabWrapper","Table","Tabs","TabsState","TooltipLinkList","TooltipMessage","TooltipNote","UL","WithTooltip","WithTooltipPure","Zoom","codeCommon","components","createCopyToClipboardFunction","getStoryHref","icons","interleaveSeparators","nameSpaceClassNames","resetComponents","withReset"],"@storybook/channels":["Channel","PostMessageTransport","WebsocketTransport","createBrowserChannel"],"@storybook/core-events":["CHANNEL_CREATED","CHANNEL_WS_DISCONNECT","CONFIG_ERROR","CURRENT_STORY_WAS_SET","DOCS_PREPARED","DOCS_RENDERED","FORCE_REMOUNT","FORCE_RE_RENDER","GLOBALS_UPDATED","NAVIGATE_URL","PLAY_FUNCTION_THREW_EXCEPTION","PRELOAD_ENTRIES","PREVIEW_BUILDER_PROGRESS","PREVIEW_KEYDOWN","REGISTER_SUBSCRIPTION","REQUEST_WHATS_NEW_DATA","RESET_STORY_ARGS","RESULT_WHATS_NEW_DATA","SELECT_STORY","SET_CONFIG","SET_CURRENT_STORY","SET_GLOBALS","SET_INDEX","SET_STORIES","SET_WHATS_NEW_CACHE","SHARED_STATE_CHANGED","SHARED_STATE_SET","STORIES_COLLAPSE_ALL","STORIES_EXPAND_ALL","STORY_ARGS_UPDATED","STORY_CHANGED","STORY_ERRORED","STORY_INDEX_INVALIDATED","STORY_MISSING","STORY_PREPARED","STORY_RENDERED","STORY_RENDER_PHASE_CHANGED","STORY_SPECIFIED","STORY_THREW_EXCEPTION","STORY_UNCHANGED","TELEMETRY_ERROR","TOGGLE_WHATS_NEW_NOTIFICATIONS","UNHANDLED_ERRORS_WHILE_PLAYING","UPDATE_GLOBALS","UPDATE_QUERY_PARAMS","UPDATE_STORY_ARGS"],"@storybook/core-events/manager-errors":["Category","ProviderDoesNotExtendBaseProviderError","UncaughtManagerError"],"@storybook/router":["BaseLocationProvider","DEEPLY_EQUAL","Link","Location","LocationProvider","Match","Route","buildArgsParam","deepDiff","getMatch","parsePath","queryFromLocation","queryFromString","stringifyQuery","useNavigate"],"@storybook/theming":["CacheProvider","ClassNames","Global","ThemeProvider","background","color","convert","create","createCache","createGlobal","createReset","css","darken","ensure","ignoreSsrWarning","isPropValid","jsx","keyframes","lighten","styled","themes","typography","useTheme","withTheme"],"@storybook/icons":["AccessibilityAltIcon","AccessibilityIcon","AddIcon","AdminIcon","AlertAltIcon","AlertIcon","AlignLeftIcon","AlignRightIcon","AppleIcon","ArrowDownIcon","ArrowLeftIcon","ArrowRightIcon","ArrowSolidDownIcon","ArrowSolidLeftIcon","ArrowSolidRightIcon","ArrowSolidUpIcon","ArrowUpIcon","AzureDevOpsIcon","BackIcon","BasketIcon","BatchAcceptIcon","BatchDenyIcon","BeakerIcon","BellIcon","BitbucketIcon","BoldIcon","BookIcon","BookmarkHollowIcon","BookmarkIcon","BottomBarIcon","BottomBarToggleIcon","BoxIcon","BranchIcon","BrowserIcon","ButtonIcon","CPUIcon","CalendarIcon","CameraIcon","CategoryIcon","CertificateIcon","ChangedIcon","ChatIcon","CheckIcon","ChevronDownIcon","ChevronLeftIcon","ChevronRightIcon","ChevronSmallDownIcon","ChevronSmallLeftIcon","ChevronSmallRightIcon","ChevronSmallUpIcon","ChevronUpIcon","ChromaticIcon","ChromeIcon","CircleHollowIcon","CircleIcon","ClearIcon","CloseAltIcon","CloseIcon","CloudHollowIcon","CloudIcon","CogIcon","CollapseIcon","CommandIcon","CommentAddIcon","CommentIcon","CommentsIcon","CommitIcon","CompassIcon","ComponentDrivenIcon","ComponentIcon","ContrastIcon","ControlsIcon","CopyIcon","CreditIcon","CrossIcon","DashboardIcon","DatabaseIcon","DeleteIcon","DiamondIcon","DirectionIcon","DiscordIcon","DocChartIcon","DocListIcon","DocumentIcon","DownloadIcon","DragIcon","EditIcon","EllipsisIcon","EmailIcon","ExpandAltIcon","ExpandIcon","EyeCloseIcon","EyeIcon","FaceHappyIcon","FaceNeutralIcon","FaceSadIcon","FacebookIcon","FailedIcon","FastForwardIcon","FigmaIcon","FilterIcon","FlagIcon","FolderIcon","FormIcon","GDriveIcon","GithubIcon","GitlabIcon","GlobeIcon","GoogleIcon","GraphBarIcon","GraphLineIcon","GraphqlIcon","GridAltIcon","GridIcon","GrowIcon","HeartHollowIcon","HeartIcon","HomeIcon","HourglassIcon","InfoIcon","ItalicIcon","JumpToIcon","KeyIcon","LightningIcon","LightningOffIcon","LinkBrokenIcon","LinkIcon","LinkedinIcon","LinuxIcon","ListOrderedIcon","ListUnorderedIcon","LocationIcon","LockIcon","MarkdownIcon","MarkupIcon","MediumIcon","MemoryIcon","MenuIcon","MergeIcon","MirrorIcon","MobileIcon","MoonIcon","NutIcon","OutboxIcon","OutlineIcon","PaintBrushIcon","PaperClipIcon","ParagraphIcon","PassedIcon","PhoneIcon","PhotoDragIcon","PhotoIcon","PinAltIcon","PinIcon","PlayBackIcon","PlayIcon","PlayNextIcon","PlusIcon","PointerDefaultIcon","PointerHandIcon","PowerIcon","PrintIcon","ProceedIcon","ProfileIcon","PullRequestIcon","QuestionIcon","RSSIcon","RedirectIcon","ReduxIcon","RefreshIcon","ReplyIcon","RepoIcon","RequestChangeIcon","RewindIcon","RulerIcon","SearchIcon","ShareAltIcon","ShareIcon","ShieldIcon","SideBySideIcon","SidebarAltIcon","SidebarAltToggleIcon","SidebarIcon","SidebarToggleIcon","SpeakerIcon","StackedIcon","StarHollowIcon","StarIcon","StickerIcon","StopAltIcon","StopIcon","StorybookIcon","StructureIcon","SubtractIcon","SunIcon","SupportIcon","SwitchAltIcon","SyncIcon","TabletIcon","ThumbsUpIcon","TimeIcon","TimerIcon","TransferIcon","TrashIcon","TwitterIcon","TypeIcon","UbuntuIcon","UndoIcon","UnfoldIcon","UnlockIcon","UnpinIcon","UploadIcon","UserAddIcon","UserAltIcon","UserIcon","UsersIcon","VSCodeIcon","VerifiedIcon","VideoIcon","WandIcon","WatchIcon","WindowsIcon","WrenchIcon","YoutubeIcon","ZoomIcon","ZoomOutIcon","ZoomResetIcon","iconList"],"@storybook/manager-api":["ActiveTabs","Consumer","ManagerContext","Provider","addons","combineParameters","controlOrMetaKey","controlOrMetaSymbol","eventMatchesShortcut","eventToShortcut","isMacLike","isShortcutTaken","keyToSymbol","merge","mockChannel","optionOrAltSymbol","shortcutMatchesShortcut","shortcutToHumanString","types","useAddonState","useArgTypes","useArgs","useChannel","useGlobalTypes","useGlobals","useParameter","useSharedState","useStoryPrepared","useStorybookApi","useStorybookState"],"@storybook/client-logger":["deprecate","logger","once","pretty"],"@storybook/types":["Addon_TypesEnum"]};var globalsNameReferenceMap={react:"__REACT__","react-dom":"__REACT_DOM__","@storybook/components":"__STORYBOOK_COMPONENTS__","@storybook/channels":"__STORYBOOK_CHANNELS__","@storybook/core-events":"__STORYBOOK_CORE_EVENTS__","@storybook/core-events/manager-errors":"__STORYBOOK_CORE_EVENTS_MANAGER_ERRORS__","@storybook/router":"__STORYBOOK_ROUTER__","@storybook/theming":"__STORYBOOK_THEMING__","@storybook/icons":"__STORYBOOK_ICONS__","@storybook/manager-api":"__STORYBOOK_API__","@storybook/client-logger":"__STORYBOOK_CLIENT_LOGGER__","@storybook/types":"__STORYBOOK_TYPES__"},globalPackages=Object.keys(globalsNameReferenceMap);var globalsModuleInfoMap=globalPackages.reduce((acc,key)=>(acc[key]={type:"esm",varName:globalsNameReferenceMap[key],namedExports:exports_default[key],defaultExport:!0},acc),{});0&&(module.exports={globalsModuleInfoMap}); 2 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ## 🧑‍💻 写在开头 2 | 3 | --- 4 | 5 | > 本项目使用的是 node18.18.0，使用的都是较新版本的包，在配置 lint 的时候 stylelint 的插件容易抽风，特别是配置顺序修正的时候，重启 vscode 即可，并非配置有问题。 6 | 7 | ## 你能学到什么？ 8 | 9 | 希望在你阅读本篇文章之后，不会觉得浪费了时间。如果你跟着读下来，你将会学到： 10 | 11 | - 🧑‍ 一个标准化的项目初始化、代码规范、提交规范的配置流程 12 | - 🍑 eslint、stylelint 及 prettier 的配置 13 | - 🍒 代码提交规范的第三方工具强制约束方式实现 14 | 15 | ## 同系列文章列举 16 | 17 | ### 项目初始化相关 18 | 19 | - [package.json 详解](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 20 | - [LICENSE 文件都有啥?](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 21 | - [.gitignore?](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 22 | - [项目 install 不够快? 配置下 npmrc | yarnrc 吧!](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 23 | 24 | ### 解决代码风格问题 25 | 26 | - [EditorConfig 统一编辑器风格](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 27 | - [Prettier&保存自动格式化](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 28 | 29 | ### 代码质量问题 30 | 31 | - [ESLint&保存自动修复](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 32 | - [StyleLint&保存自动修复](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 33 | - [ESLint、Stylelint 和 Prettier 的冲突](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 34 | - [lint-staged&husky](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 35 | - [commitlint + changelog](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 36 | 37 | ### 项目配置流程 38 | 39 | - [React18+ts5+webpack5 项目模板配置](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 40 | - [React18+ts5+Storybook 组件库搭建](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 41 | - [webpack 基本配置解析](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 42 | - [webpack 基本优化](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 43 | - [webpack 原理解析](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 44 | - [你不得不知道的 babel](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 45 | - [0 基础上手 rollup 打包](https://editor.mdnice.com/?outId=d6c05ad8402e4665bb8e51d1216ca584) 46 | 47 | ## 🍐 一、项目初始化及配置 48 | 49 | ### package.json 50 | 51 | package.json 是基于 Node.js 生态系统的任何项目（尤其是前端项目）的核心文件之一。它在项目中扮演了多个重要角色： 52 | 53 | - **项目元数据（Metadata）**: 它包含了项目的元数据，如项目名称、版本、描述、作者、许可证等。 54 | - **依赖管理（Dependency Management）**: 它列出了项目所依赖的 npm 包及其版本，这包括 dependencies 和 devDependencies 等。 55 | - **脚本（Scripts）**: scripts 字段允许定义可以通过 npm run 命令执行的脚本，使得启动、构建、测试和部署等操作可以自动化。 56 | - **版本控制（Version control）**: 通过 version 字段指定，可以帮助管理项目的发布和版本控制。 57 | - **配置平台（Platform Config）**: 它可以指明项目运行所需的 Node.js 或 npm 版本，有助于确保一致的开发环境。 58 | 59 | ```js 60 | yarn init -y 61 | ``` 62 | 63 | ```json 64 | { 65 | "name": "lint_demo", 66 | "version": "1.0.0", 67 | "description": "a lint demo ", 68 | "main": "dist/boundle.js", 69 | "author": "xxx", 70 | "license": "MIT", 71 | "private": false 72 | } 73 | ``` 74 | 75 | ### LICENSE 76 | 77 | LICENSE 文件是指软件项目中包含的许可证文件，用于规定该软件在何种条件下可以被使用、复制、修改和分发。LICENSE 文件通常包含了开源许可证的全文或摘要，以及适用该许可证的条款和条件。在开源软件项目中，LICENSE 文件是非常重要的，它定义了开发者和用户之间的权利和责任，确保了代码的合法使用和共享。 78 | 79 | 常见的开源许可证包括 MIT 许可证、GNU 通用公共许可证（GPL）、Apache 许可证等。每种许可证都有不同的要求和限制，开发者在选择和使用许可证时需要仔细考虑项目的需求和目标。 80 | 81 | 可以在[choosealicense](https://choosealicense.com/)网站选择一个合适的 82 | 83 | ### .gitignore 84 | 85 | `.gitignore`文件是用来指定哪些文件或目录不应该被 Git 版本控制系统跟踪的配置文件。在项目中，有些文件（如编译生成的文件、日志文件、临时文件等）不应该被包含在版本控制中，因为它们可能包含敏感信息、过时的内容或者不必要的文件。通过.gitignore 文件，可以告诉 Git 哪些文件应该被忽略，不会被提交到代码仓库中。 86 | 87 | 使用 vscode 的 gitignore 插件，下载安装该插件之后， ctrl+shift+p 召唤命令面板，输入 Add gitignore 命令，即可在输入框输入系统或编辑器名字，来自动添加需要忽略的文件或文件夹至 .gitignore 中。 88 | 89 | ### .npmrc | .yarnrc 90 | 91 | `npmrc` 和 `yarnrc` 是两个配置文件，用于配置 npm 和 Yarn 包管理器的行为和设置。它们分别用于配置 npm 和 Yarn 的命令行工具的行为，例如设置镜像源、代理、缓存路径等。 92 | 93 | **npmrc** 94 | 95 | `npmrc` 是 npm 的配置文件，通常是 `.npmrc` 文件。你可以在项目级别或全局级别创建 `.npmrc` 文件来配置 npm 的行为。 96 | 97 | **配置方式：** 98 | 99 | 1. **项目级别配置：** 在项目根目录下创建 `.npmrc` 文件，并添加所需配置。 100 | 2. **全局级别配置：** 使用命令 `npm config edit` 打开全局配置文件，并添加所需配置。 101 | 102 | **常见配置项：** 103 | 104 | - `registry`：设置包的下载源。 105 | - `proxy` 和 `https-proxy`：设置代理服务器。 106 | - `cache`：设置包的缓存路径。 107 | - `prefix`：设置全局安装包的路径。 108 | - `strict-ssl`：是否强制使用 SSL。 109 | 110 | 示例 111 | 112 | ```js 113 | # .npmrc 114 | 115 | # 设置下载源为淘宝镜像，淘宝证书到期了，换了 116 | registry=https://registry.npm.taobao.org/ 117 | 118 | # 设置代理服务器 119 | proxy=http://proxy.example.com:8080 120 | https-proxy=http://proxy.example.com:8080 121 | 122 | # 设置包的缓存路径 123 | cache=/path/to/npm-cache 124 | 125 | # 设置全局安装包的路径 126 | prefix=/path/to/npm-global 127 | ``` 128 | 129 | **yarnrc** 130 | 131 | `yarnrc` 是 Yarn 的配置文件，通常是 `.yarnrc` 或 `.yarnrc.yml` 文件。你可以在项目级别或全局级别创建 `.yarnrc` 文件来配置 Yarn 的行为。 132 | 133 | **配置方式：** 134 | 135 | 1. **项目级别配置：** 在项目根目录下创建 `.yarnrc` 文件，并添加所需配置。 136 | 2. **全局级别配置：** 使用命令 `yarn config set` 添加全局配置。 137 | 138 | **常见配置项：** 139 | 140 | - `registry`：设置包的下载源。 141 | - `proxy` 和 `https-proxy`：设置代理服务器。 142 | - `cache-folder`：设置包的缓存路径。 143 | - `preferred-cache-folder`：设置首选缓存路径。 144 | - `nodeLinker`：设置 Node 模块链接器。 145 | 146 | **示例：** 147 | 148 | ``` 149 | # .yarnrc 150 | 151 | # 设置下载源为淘宝镜像，淘宝证书到期了，换了 152 | registry "https://registry.npm.taobao.org/" 153 | 154 | # 设置代理服务器 155 | proxy "http://proxy.example.com:8080" 156 | https-proxy "http://proxy.example.com:8080" 157 | 158 | # 设置包的缓存路径 159 | cache-folder "/path/to/yarn-cache" 160 | 161 | # 设置首选缓存路径 162 | preferred-cache-folder "/path/to/preferred-cache" 163 | ``` 164 | 165 | 配置文件中的每一行都应该是一个配置项，以 `key value` 的格式表示。你可以根据需要添加或修改这些配置项来定制 npm 和 Yarn 的行为。 166 | 167 | ### README.md 168 | 169 | README.md 文件通常是一个项目的说明文档，用于向其他开发者或用户介绍项目的内容、使用方法、贡献指南等信息。.md 代表 Markdown 格式，Markdown 是一种轻量级的标记语言，用于简单地排版文档。 170 | 171 | README.md 文件通常包含以下内容： 172 | 173 | - 项目名称和简介：简要介绍项目的名称、功能和用途。 174 | - 安装说明：指导用户如何安装项目的依赖或部署项目。 175 | - 使用方法：说明如何使用项目，包括配置、运行命令等。 176 | - 示例：提供一些示例代码或截图，展示项目的功能。 177 | - 贡献指南：说明如何贡献代码或报告问题。 178 | - 版本历史：列出项目的版本历史和更新内容。 179 | - 许可证信息：说明项目的许可证类型和使用限制。 180 | 181 | ## 🍎 二、规范代码与提交 182 | 183 | ### EditorConfig 184 | 185 | .editorconfig 文件是用来帮助开发人员在不同的编辑器和 IDE 中保持一致的代码风格和格式的配置文件。它可以定义一些基本的编辑器设置，如缩进风格、换行符类型、字符编码等，以确保团队成员在不同的编辑器中编写的代码具有一致的风格。 186 | 187 | .editorconfig 文件的语法很简单，通常由一系列键值对组成，每个键值对表示一项编辑器配置。以下是一个示例.editorconfig 文件的内容： 188 | 189 | ```js 190 | # EditorConfig 文件示例 191 | 192 | # 表示这是项目根目录下的顶级 .editorconfig 文件，编辑器在查找配置时会停止向上查找 193 | root = true 194 | 195 | # 匹配所有文件 196 | [*] 197 | # 使用 Unix 风格的换行符 198 | end_of_line = lf 199 | # 文件末尾会插入一个空行 200 | insert_final_newline = true 201 | 202 | # 匹配 JavaScript 文件 203 | [*.js] 204 | # 使用空格缩进 205 | indent_style = space 206 | # 缩进大小为 4 207 | indent_size = 4 208 | 209 | # 匹配 Markdown 文件 210 | [*.md] 211 | # 使用制表符缩进 212 | indent_style = tab 213 | ``` 214 | 215 | 常见配置项 .editorconfig 文件支持的配置项有很多，常见的包括： 216 | 217 | - root：是否是项目根目录下的顶级 .editorconfig 文件。 218 | - indent_style：缩进风格，可以是 tab（制表符）或 space（空格）。 219 | - indent_size：缩进大小，对于 tab 缩进风格无效。 220 | - tab_width：制表符宽度，用于 tab 缩进风格。 221 | - end_of_line：换行符类型，可以是 lf（Unix 风格）、crlf（Windows 风格）或 cr（旧版 Mac 风格）。 222 | - charset：字符编码，通常设置为 utf-8。 223 | - trim_trailing_whitespace：是否去除行末多余的空格。 224 | - insert_final_newline：文件末尾是否插入空行。以上是一些常见的配置项，具体可以根据项目需要进行配置。详细的配置项列表和说明可以参考 EditorConfig 官方文档。 225 | 226 | 这里解释下空格为什么需要统一，为什么有几种风格？换行符类型的不同风格主要是由于不同操作系统对换行符的处理方式不同所导致的。 227 | 228 | `LF（Line Feed）`：在 Unix 和类 Unix 系统（如 Linux、macOS、FreeBSD 等）中使用的换行符。在文本文件中，每行结尾只有 LF 字符。 229 | 230 | `CRLF（Carriage Return + Line Feed）`：在 Windows 系统中使用的换行符。在文本文件中，每行结尾有 CR 和 LF 两个字符组成。 231 | 232 | `CR（Carriage Return）`：在旧版 Mac 系统中使用的换行符。在文本文件中，每行结尾只有 CR 字符。 233 | 234 | 这些不同的换行符类型源于早期计算机系统中不同的文本处理方式，如今在不同的操作系统和文本编辑器中仍然会存在这些差异。因此，.editorconfig 文件中的 end_of_line 配置选项允许你指定在项目中使用的换行符类型，以便在不同的环境中保持一致的换行符风格。 235 | 236 | 如果在一个项目中不同的文件使用了不同的换行符类型，可能会导致一些问题，主要包括： 237 | 238 | - 跨平台兼容性问题：不同的操作系统对换行符的处理方式不同，如果文件中混合使用了不同的换行符类型，可能会导致在不同操作系统下的编辑器或工具处理文件时出现问题，如显示异常或解析错误。 239 | 240 | - 版本控制问题：版本控制系统（如 Git）可能会在提交和比较文件时将换行符转换为统一的格式，如果文件中混合使用了不同的换行符类型，可能会导致版本控制系统不正确地处理换行符，导致代码冲突或历史记录混乱。 241 | 242 | - 可读性问题：混合使用不同的换行符类型会使代码在不同的编辑器或工具中显示不一致，降低代码的可读性和维护性。 243 | 244 | ## 🍓 二、主体内容 2 245 | 246 | 🧑‍💻☀️🍐🍎🍑🍉🍒🥑🥝 247 | 248 | ## 🍋 写在最后 249 | 250 | 如果你看到这里了，并且觉得这篇文章对你有所帮助，希望你能够点赞 👍 和收藏 ⭐ 支持一下作者 🙇🙇🙇，感谢 🍺🍺！如果文中有任何不准确之处，也欢迎您指正，共同进步。感谢您的阅读，期待您的点赞 👍 和收藏 ⭐！ 251 | 252 | - [个人作品集](https://editor.mdnice.com/?outId=e007c3dbe88248f2856075e1ab4de3c0) 253 | - [个人博客](https://editor.mdnice.com/?outId=e007c3dbe88248f2856075e1ab4de3c0) 254 | - [知识库](https://editor.mdnice.com/?outId=e007c3dbe88248f2856075e1ab4de3c0) 255 | 256 | 往期文章 257 | 258 | - [文章 1](https://editor.mdnice.com/?outId=e007c3dbe88248f2856075e1ab4de3c0) 259 | - [文章 2](https://editor.mdnice.com/?outId=e007c3dbe88248f2856075e1ab4de3c0) 260 | - [文章 3](https://editor.mdnice.com/?outId=e007c3dbe88248f2856075e1ab4de3c0) 261 | - [文章 4](https://editor.mdnice.com/?outId=e007c3dbe88248f2856075e1ab4de3c0) 262 | 263 | 感兴趣的同学可以关注下我的公众号 ObjectX 前端实验室 ![](https://files.mdnice.com/user/62323/f700dfe9-e2b9-4697-abc3-79ebb2df6fac.png =50%x) 264 | 265 | 🌟 少走弯路 | ObjectX 前端实验室 🛠️「精选资源｜实战经验｜技术洞见」 266 | -------------------------------------------------------------------------------- /src/components/Waterfall/Waterfall.tsx: -------------------------------------------------------------------------------- 1 | import React, {useCallback, useEffect, useRef, useState} from 'react'; 2 | import type {ReactNode} from 'react'; 3 | import style from './style/index.module.less'; 4 | import {fetchRandomImage} from '../../api'; 5 | import type {UnsplashImage} from '../../api'; 6 | import {shuffleArray} from '../../utils'; 7 | import {WaterFall} from './waterfallClass'; 8 | export interface WaterfallProps { 9 | waterfallType?: 'column' | 'flex' | 'grid' | 'js'; 10 | /** 11 | * 图片数据列表 12 | */ 13 | items?: UnsplashImage[]; 14 | /** 15 | * 图片列宽度，不传入则按列数，每一列宽度是容器的【1 / maxColumns】 16 | */ 17 | columnWidth?: number; 18 | /** 19 | * 图片间距 20 | */ 21 | gapSize?: number; 22 | /** 23 | * 最大列数 24 | */ 25 | maxColumns?: number; 26 | } 27 | 28 | const columnTypeRender = (options: WaterfallProps) => { 29 | const {items = []} = options; 30 | return ( 31 |
32 | {shuffleArray(items)?.map((image: UnsplashImage, index: number) => { 33 | console.log('✅ ~ image:', image); 34 | 35 | return ( 36 |
37 | {`Image 38 |
39 | ); 40 | })} 41 |
42 | ); 43 | }; 44 | 45 | const flexTypeRender = (options: WaterfallProps) => { 46 | const {items = [], maxColumns} = options; 47 | const [newMaxColumns, setNewMaxColumns] = useState(maxColumns ?? 5); 48 | const handleResize = () => { 49 | if (window.innerWidth < 600) { 50 | setNewMaxColumns(2); 51 | } else if (window.innerWidth < 800) { 52 | setNewMaxColumns(3); 53 | } else if (window.innerWidth < 1000) { 54 | setNewMaxColumns(4); 55 | } else if (window.innerWidth < 1200) { 56 | setNewMaxColumns(5); 57 | } 58 | }; 59 | useEffect(() => { 60 | window.addEventListener('resize', handleResize); 61 | handleResize(); 62 | return () => { 63 | window.removeEventListener('resize', handleResize); 64 | }; 65 | }, []); 66 | 67 | return ( 68 |
69 | {Array(newMaxColumns) 70 | .fill(0) 71 | ?.map((item, index) => { 72 | return ( 73 |
74 | {shuffleArray(items)?.map( 75 | (image: UnsplashImage, index: number) => { 76 | return ( 77 |
78 | {`Image 79 |
80 | ); 81 | }, 82 | )} 83 |
84 | ); 85 | })} 86 |
87 | ); 88 | }; 89 | 90 | const gridTypeRender = (options: WaterfallProps) => { 91 | const {items = []} = options; 92 | const gridContainer = useRef(null); 93 | const [imagesLoaded, setImagesLoaded] = useState(false); 94 | 95 | // 缓存计算，避免重复计算 96 | const calcRows = useCallback(() => { 97 | const gridContainerNode = gridContainer.current; 98 | if (gridContainerNode === null) return; 99 | 100 | const itemNodes = gridContainerNode.querySelectorAll(`.${style.item}`); 101 | const cols = 102 | getComputedStyle(gridContainerNode).gridTemplateColumns.split(' ').length; 103 | // 计算每个项目占据的位置 104 | itemNodes.forEach((item, index) => { 105 | const gapRows = index >= cols ? 8 : 0; 106 | const rows = Math.ceil((item.clientHeight + gapRows) / 10); 107 | (item as HTMLDivElement).style.gridRowEnd = `span ${rows}`; 108 | }); 109 | }, []); 110 | 111 | useEffect(() => { 112 | // 确保图片加载完成后再去计算布局 113 | if (imagesLoaded) { 114 | calcRows(); 115 | const handleResize = () => { 116 | // 浏览器空闲计算布局 117 | requestAnimationFrame(calcRows); 118 | }; 119 | 120 | window.addEventListener('resize', handleResize); 121 | return () => { 122 | window.removeEventListener('resize', handleResize); 123 | }; 124 | } 125 | }, [imagesLoaded, calcRows]); 126 | 127 | // 图片加载完成后再去计算布局，useCallback避免重复计算 128 | const handleImageLoad = useCallback(() => { 129 | const totalImages = items.length; 130 | let loadedImages = 0; 131 | 132 | return () => { 133 | loadedImages++; 134 | if (loadedImages === totalImages) { 135 | setImagesLoaded(true); 136 | } 137 | }; 138 | }, [items.length]); 139 | 140 | const onLoad = handleImageLoad(); 141 | 142 | return ( 143 |
144 | {shuffleArray(items).map((image: UnsplashImage, index: number) => ( 145 |
146 | {`Image 147 |
148 | ))} 149 |
150 | ); 151 | }; 152 | 153 | const jsTypeRender = (options: WaterfallProps) => { 154 | let loading = false; 155 | const {items = []} = options; 156 | const jsContainer = useRef(null); 157 | 158 | // 获取1-400之间的任意高度 159 | const getRandomHeight = (min = 1, max = 4) => { 160 | return (Math.floor(Math.random() * (max - min + 1)) + min) * 100; 161 | }; 162 | 163 | // 生成随机的柔和颜色 164 | const getRandomColor = () => { 165 | const hue = Math.floor(Math.random() * 360); // 0到360度 166 | const saturation = Math.floor(Math.random() * 20) + 70; // 70%到90%的饱和度 167 | const lightness = Math.floor(Math.random() * 20) + 70; // 70%到90%的亮度 168 | return `hsl(${hue}, ${saturation}%, ${lightness}%)`; 169 | }; 170 | 171 | // 模拟异步请求数据 172 | async function getData(num = 5) { 173 | console.log('✅ ~ 请求数据num:', num); 174 | const jsContainerNode = jsContainer.current; 175 | if (jsContainerNode === null) return; 176 | const images = (await fetchRandomImage(num)) as UnsplashImage[]; 177 | for (let i = 0; i < images.length; i++) { 178 | const div = document.createElement('div'); 179 | div.className = `${style.jsItem}`; 180 | const img = new Image(); 181 | img.src = images[i].urls.full; 182 | // 等待图片加载完成，将图片依次插入到容器中 183 | img.onload = () => { 184 | const fragment = document.createDocumentFragment(); 185 | div.className = `${style.jsItem}`; 186 | div.style.height = getRandomHeight(4, 1) + 'px'; 187 | div.style.backgroundColor = getRandomColor(); // 设置随机颜色 188 | div.style.backgroundColor = getRandomColor(); // 设置随机颜色 189 | div.appendChild(img); 190 | fragment.appendChild(div); 191 | jsContainerNode.appendChild(fragment); 192 | }; 193 | img.onerror = () => { 194 | console.error('Image failed to load'); 195 | }; 196 | } 197 | } 198 | 199 | // 触底增加数据 200 | const handScorllAddData = async () => { 201 | const scrollTop = document.documentElement.scrollTop; 202 | const clientHeight = document.documentElement.clientHeight; 203 | const scrollHeight = document.body.scrollHeight; 204 | const buffer = 50; // 缓冲区距离 205 | console.log( 206 | `Scroll Top: ${scrollTop}, Client Height: ${clientHeight}, Scroll Height: ${scrollHeight}`, 207 | ); 208 | 209 | if (scrollTop + clientHeight >= scrollHeight - buffer && !loading) { 210 | loading = true; 211 | console.log('触底，开始加载数据...'); 212 | await getData(5); 213 | loading = false; 214 | console.log('数据加载完成'); 215 | } 216 | }; 217 | 218 | // 先获取20条数据 219 | useEffect(() => { 220 | getData(20); 221 | }, []); 222 | 223 | // 渲染绘制 224 | useEffect(() => { 225 | const jsContainerNode = jsContainer.current; 226 | if (jsContainerNode === null) return; 227 | const water = new WaterFall(jsContainerNode, {gap: 10}); 228 | water.layout(); 229 | }, [items]); 230 | 231 | // 触底增加 232 | useEffect(() => { 233 | const onScroll = () => { 234 | console.log('滚动事件触发'); 235 | handScorllAddData(); 236 | }; 237 | 238 | window.addEventListener('scroll', onScroll); 239 | 240 | return () => { 241 | window.removeEventListener('scroll', onScroll); 242 | }; 243 | }, []); 244 | 245 | return
; 246 | }; 247 | 248 | interface GetRenderFunc { 249 | column: (options: WaterfallProps) => ReactNode; 250 | flex: (options: WaterfallProps) => ReactNode; 251 | grid: (options: WaterfallProps) => ReactNode; 252 | js: (options: WaterfallProps) => ReactNode; 253 | } 254 | 255 | // render函数映射 256 | const getRenderObj: GetRenderFunc = { 257 | 'column': columnTypeRender, 258 | 'flex': flexTypeRender, 259 | 'grid': gridTypeRender, 260 | 'js': jsTypeRender, 261 | }; 262 | 263 | /** 264 | * 瀑布流组件 265 | */ 266 | export const Waterfall = ({ 267 | waterfallType = 'column', 268 | items, 269 | columnWidth = 200, 270 | gapSize = 10, 271 | maxColumns = 5, 272 | ...props 273 | }: WaterfallProps) => { 274 | const [images, setImages] = React.useState([]); 275 | 276 | useEffect(() => { 277 | const getImages = async () => { 278 | try { 279 | const imageUrls = await fetchRandomImage(10); // 获取30张图片 280 | setImages(imageUrls); 281 | } catch (error) { 282 | console.error('Error fetching images from Unsplash:', error); 283 | } 284 | }; 285 | getImages(); 286 | }, []); 287 | 288 | return getRenderObj[waterfallType]({ 289 | waterfallType, 290 | items: images, 291 | columnWidth, 292 | gapSize, 293 | maxColumns, 294 | }); 295 | }; 296 | -------------------------------------------------------------------------------- /storybook-static/assets/preview-BAz7FMXc.js: -------------------------------------------------------------------------------- 1 | import{d as $}from"./index-DrFu-skq.js";const{useMemo:x,useEffect:f}=__STORYBOOK_MODULE_PREVIEW_API__,{global:p}=__STORYBOOK_MODULE_GLOBAL__;var u=i=>{(Array.isArray(i)?i:[i]).forEach(r)},r=i=>{let t=typeof i=="string"?i:i.join(""),o=p.document.getElementById(t);o&&o.parentElement&&o.parentElement.removeChild(o)},b=(i,t)=>{let o=p.document.getElementById(i);if(o)o.innerHTML!==t&&(o.innerHTML=t);else{let n=p.document.createElement("style");n.setAttribute("id",i),n.innerHTML=t,p.document.head.appendChild(n)}},m="outline";function s(i){return $` 2 | ${i} body { 3 | outline: 1px solid #2980b9 !important; 4 | } 5 | 6 | ${i} article { 7 | outline: 1px solid #3498db !important; 8 | } 9 | 10 | ${i} nav { 11 | outline: 1px solid #0088c3 !important; 12 | } 13 | 14 | ${i} aside { 15 | outline: 1px solid #33a0ce !important; 16 | } 17 | 18 | ${i} section { 19 | outline: 1px solid #66b8da !important; 20 | } 21 | 22 | ${i} header { 23 | outline: 1px solid #99cfe7 !important; 24 | } 25 | 26 | ${i} footer { 27 | outline: 1px solid #cce7f3 !important; 28 | } 29 | 30 | ${i} h1 { 31 | outline: 1px solid #162544 !important; 32 | } 33 | 34 | ${i} h2 { 35 | outline: 1px solid #314e6e !important; 36 | } 37 | 38 | ${i} h3 { 39 | outline: 1px solid #3e5e85 !important; 40 | } 41 | 42 | ${i} h4 { 43 | outline: 1px solid #449baf !important; 44 | } 45 | 46 | ${i} h5 { 47 | outline: 1px solid #c7d1cb !important; 48 | } 49 | 50 | ${i} h6 { 51 | outline: 1px solid #4371d0 !important; 52 | } 53 | 54 | ${i} main { 55 | outline: 1px solid #2f4f90 !important; 56 | } 57 | 58 | ${i} address { 59 | outline: 1px solid #1a2c51 !important; 60 | } 61 | 62 | ${i} div { 63 | outline: 1px solid #036cdb !important; 64 | } 65 | 66 | ${i} p { 67 | outline: 1px solid #ac050b !important; 68 | } 69 | 70 | ${i} hr { 71 | outline: 1px solid #ff063f !important; 72 | } 73 | 74 | ${i} pre { 75 | outline: 1px solid #850440 !important; 76 | } 77 | 78 | ${i} blockquote { 79 | outline: 1px solid #f1b8e7 !important; 80 | } 81 | 82 | ${i} ol { 83 | outline: 1px solid #ff050c !important; 84 | } 85 | 86 | ${i} ul { 87 | outline: 1px solid #d90416 !important; 88 | } 89 | 90 | ${i} li { 91 | outline: 1px solid #d90416 !important; 92 | } 93 | 94 | ${i} dl { 95 | outline: 1px solid #fd3427 !important; 96 | } 97 | 98 | ${i} dt { 99 | outline: 1px solid #ff0043 !important; 100 | } 101 | 102 | ${i} dd { 103 | outline: 1px solid #e80174 !important; 104 | } 105 | 106 | ${i} figure { 107 | outline: 1px solid #ff00bb !important; 108 | } 109 | 110 | ${i} figcaption { 111 | outline: 1px solid #bf0032 !important; 112 | } 113 | 114 | ${i} table { 115 | outline: 1px solid #00cc99 !important; 116 | } 117 | 118 | ${i} caption { 119 | outline: 1px solid #37ffc4 !important; 120 | } 121 | 122 | ${i} thead { 123 | outline: 1px solid #98daca !important; 124 | } 125 | 126 | ${i} tbody { 127 | outline: 1px solid #64a7a0 !important; 128 | } 129 | 130 | ${i} tfoot { 131 | outline: 1px solid #22746b !important; 132 | } 133 | 134 | ${i} tr { 135 | outline: 1px solid #86c0b2 !important; 136 | } 137 | 138 | ${i} th { 139 | outline: 1px solid #a1e7d6 !important; 140 | } 141 | 142 | ${i} td { 143 | outline: 1px solid #3f5a54 !important; 144 | } 145 | 146 | ${i} col { 147 | outline: 1px solid #6c9a8f !important; 148 | } 149 | 150 | ${i} colgroup { 151 | outline: 1px solid #6c9a9d !important; 152 | } 153 | 154 | ${i} button { 155 | outline: 1px solid #da8301 !important; 156 | } 157 | 158 | ${i} datalist { 159 | outline: 1px solid #c06000 !important; 160 | } 161 | 162 | ${i} fieldset { 163 | outline: 1px solid #d95100 !important; 164 | } 165 | 166 | ${i} form { 167 | outline: 1px solid #d23600 !important; 168 | } 169 | 170 | ${i} input { 171 | outline: 1px solid #fca600 !important; 172 | } 173 | 174 | ${i} keygen { 175 | outline: 1px solid #b31e00 !important; 176 | } 177 | 178 | ${i} label { 179 | outline: 1px solid #ee8900 !important; 180 | } 181 | 182 | ${i} legend { 183 | outline: 1px solid #de6d00 !important; 184 | } 185 | 186 | ${i} meter { 187 | outline: 1px solid #e8630c !important; 188 | } 189 | 190 | ${i} optgroup { 191 | outline: 1px solid #b33600 !important; 192 | } 193 | 194 | ${i} option { 195 | outline: 1px solid #ff8a00 !important; 196 | } 197 | 198 | ${i} output { 199 | outline: 1px solid #ff9619 !important; 200 | } 201 | 202 | ${i} progress { 203 | outline: 1px solid #e57c00 !important; 204 | } 205 | 206 | ${i} select { 207 | outline: 1px solid #e26e0f !important; 208 | } 209 | 210 | ${i} textarea { 211 | outline: 1px solid #cc5400 !important; 212 | } 213 | 214 | ${i} details { 215 | outline: 1px solid #33848f !important; 216 | } 217 | 218 | ${i} summary { 219 | outline: 1px solid #60a1a6 !important; 220 | } 221 | 222 | ${i} command { 223 | outline: 1px solid #438da1 !important; 224 | } 225 | 226 | ${i} menu { 227 | outline: 1px solid #449da6 !important; 228 | } 229 | 230 | ${i} del { 231 | outline: 1px solid #bf0000 !important; 232 | } 233 | 234 | ${i} ins { 235 | outline: 1px solid #400000 !important; 236 | } 237 | 238 | ${i} img { 239 | outline: 1px solid #22746b !important; 240 | } 241 | 242 | ${i} iframe { 243 | outline: 1px solid #64a7a0 !important; 244 | } 245 | 246 | ${i} embed { 247 | outline: 1px solid #98daca !important; 248 | } 249 | 250 | ${i} object { 251 | outline: 1px solid #00cc99 !important; 252 | } 253 | 254 | ${i} param { 255 | outline: 1px solid #37ffc4 !important; 256 | } 257 | 258 | ${i} video { 259 | outline: 1px solid #6ee866 !important; 260 | } 261 | 262 | ${i} audio { 263 | outline: 1px solid #027353 !important; 264 | } 265 | 266 | ${i} source { 267 | outline: 1px solid #012426 !important; 268 | } 269 | 270 | ${i} canvas { 271 | outline: 1px solid #a2f570 !important; 272 | } 273 | 274 | ${i} track { 275 | outline: 1px solid #59a600 !important; 276 | } 277 | 278 | ${i} map { 279 | outline: 1px solid #7be500 !important; 280 | } 281 | 282 | ${i} area { 283 | outline: 1px solid #305900 !important; 284 | } 285 | 286 | ${i} a { 287 | outline: 1px solid #ff62ab !important; 288 | } 289 | 290 | ${i} em { 291 | outline: 1px solid #800b41 !important; 292 | } 293 | 294 | ${i} strong { 295 | outline: 1px solid #ff1583 !important; 296 | } 297 | 298 | ${i} i { 299 | outline: 1px solid #803156 !important; 300 | } 301 | 302 | ${i} b { 303 | outline: 1px solid #cc1169 !important; 304 | } 305 | 306 | ${i} u { 307 | outline: 1px solid #ff0430 !important; 308 | } 309 | 310 | ${i} s { 311 | outline: 1px solid #f805e3 !important; 312 | } 313 | 314 | ${i} small { 315 | outline: 1px solid #d107b2 !important; 316 | } 317 | 318 | ${i} abbr { 319 | outline: 1px solid #4a0263 !important; 320 | } 321 | 322 | ${i} q { 323 | outline: 1px solid #240018 !important; 324 | } 325 | 326 | ${i} cite { 327 | outline: 1px solid #64003c !important; 328 | } 329 | 330 | ${i} dfn { 331 | outline: 1px solid #b4005a !important; 332 | } 333 | 334 | ${i} sub { 335 | outline: 1px solid #dba0c8 !important; 336 | } 337 | 338 | ${i} sup { 339 | outline: 1px solid #cc0256 !important; 340 | } 341 | 342 | ${i} time { 343 | outline: 1px solid #d6606d !important; 344 | } 345 | 346 | ${i} code { 347 | outline: 1px solid #e04251 !important; 348 | } 349 | 350 | ${i} kbd { 351 | outline: 1px solid #5e001f !important; 352 | } 353 | 354 | ${i} samp { 355 | outline: 1px solid #9c0033 !important; 356 | } 357 | 358 | ${i} var { 359 | outline: 1px solid #d90047 !important; 360 | } 361 | 362 | ${i} mark { 363 | outline: 1px solid #ff0053 !important; 364 | } 365 | 366 | ${i} bdi { 367 | outline: 1px solid #bf3668 !important; 368 | } 369 | 370 | ${i} bdo { 371 | outline: 1px solid #6f1400 !important; 372 | } 373 | 374 | ${i} ruby { 375 | outline: 1px solid #ff7b93 !important; 376 | } 377 | 378 | ${i} rt { 379 | outline: 1px solid #ff2f54 !important; 380 | } 381 | 382 | ${i} rp { 383 | outline: 1px solid #803e49 !important; 384 | } 385 | 386 | ${i} span { 387 | outline: 1px solid #cc2643 !important; 388 | } 389 | 390 | ${i} br { 391 | outline: 1px solid #db687d !important; 392 | } 393 | 394 | ${i} wbr { 395 | outline: 1px solid #db175b !important; 396 | }`}var e=(i,t)=>{let{globals:o}=t,n=[!0,"true"].includes(o[m]),d=t.viewMode==="docs",l=x(()=>s(d?'[data-story-block="true"]':".sb-show-main"),[t]);return f(()=>{let a=d?`addon-outline-docs-${t.id}`:"addon-outline";return n?b(a,l):u(a),()=>{u(a)}},[n,l,t]),i()},g=[e],h={[m]:!1};export{g as decorators,h as globals}; 397 | -------------------------------------------------------------------------------- /scripts/release.js: -------------------------------------------------------------------------------- 1 | const {execSync} = require('child_process'); 2 | const util = require('util'); 3 | // 改为异步：包裹返回promise 4 | 5 | const fs = require('fs'); 6 | const path = require('path'); 7 | const inquirer = require('inquirer'); 8 | const exec = util.promisify(require('child_process').exec); 9 | 10 | const projectRootPath = path.join(__dirname, '..'); 11 | const packageJsonPath = path.join(projectRootPath, 'package.json'); 12 | const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8')); 13 | const packageName = packageJson.name; 14 | 15 | /** 16 | * 解析版本号 17 | * @param {*} version 18 | * @returns 19 | */ 20 | function parseVersion(version) { 21 | const [semver, preReleaseTag = ''] = version.split('-'); 22 | const [major, minor, patch] = semver.split('.').map(Number); 23 | const [preReleaseLabel, preReleaseVersion] = preReleaseTag.split('.'); 24 | return { 25 | major, 26 | minor, 27 | patch, 28 | preReleaseLabel, 29 | preReleaseVersion: preReleaseVersion ? parseInt(preReleaseVersion, 10) : 0, 30 | }; 31 | } 32 | 33 | /** 34 | * 检测是否是预发布版本 35 | * @param {*} version 36 | */ 37 | function isPreRelease(version) { 38 | return /-/.test(version); 39 | } 40 | 41 | /** 42 | * 获取预发布版本号 43 | * @param {*} currentVersion 44 | * @param {*} type 45 | */ 46 | function getPreReleaseVersion(currentVersion, type) { 47 | let {major, minor, patch, preReleaseLabel, preReleaseVersion} = 48 | currentVersion; 49 | switch (type) { 50 | case 'prepatch': 51 | patch += 1; 52 | return `${major}.${minor}.${patch}-0`; 53 | case 'preminor': 54 | minor += 1; 55 | return `${major}.${minor}.0-0`; 56 | case 'premajor': 57 | major += 1; 58 | return `${major}.0.0-0`; 59 | case 'prerelease': 60 | if (isPreRelease(`${major}.${minor}.${patch}`)) { 61 | preReleaseVersion = preReleaseVersion || 0; 62 | return `${major}.${minor}.${patch}-${preReleaseLabel || 'beta'}.${preReleaseVersion + 1}`; 63 | } else { 64 | return `${major}.${minor}.${patch}-beta.0`; 65 | } 66 | default: 67 | throw new Error(`❌ 不支持的预发布版本类型: ${type}`); 68 | } 69 | } 70 | 71 | /** 72 | * 获取最新版本号 73 | * @returns Promise 74 | */ 75 | async function getLatestVersion() { 76 | try { 77 | const {stdout} = await exec(`npm show ${packageName} version`); 78 | const latestVersion = stdout.trim().replace(/^v/, ''); // 删除可能存在的前导 v 79 | return latestVersion; 80 | } catch (error) { 81 | console.error(`❌ 获取最新版本失败: ${error.message}`); 82 | throw error; // 抛出错误，以便可以在调用此函数的地方捕获并处理 83 | } 84 | } 85 | 86 | /** 87 | * 更新版本号 88 | * @param {*} newVersion 89 | */ 90 | function updateVersion(newVersion) { 91 | packageJson.version = newVersion; 92 | fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2)); 93 | console.log(`✅ 版本号已更新为 ${newVersion}`); 94 | } 95 | 96 | /** 97 | * 确保用户已登录npm 98 | * @returns {Promise} 返回已登录用户的名称或抛出错误 99 | */ 100 | async function ensureNpmLoggedIn() { 101 | try { 102 | const {stdout} = await exec('npm whoami'); 103 | console.log(`✅ 检测到您已作为${stdout.trim()}登录到npm`); 104 | return stdout.trim(); 105 | } catch (error) { 106 | console.error('❌ 您似乎还没有登录到npm。请登录后继续。'); 107 | const answers = await inquirer.prompt([ 108 | { 109 | type: 'input', 110 | name: 'username', 111 | message: '请输入您的npm用户名:', 112 | }, 113 | { 114 | type: 'password', 115 | name: 'password', 116 | message: '请输入您的npm密码:', 117 | }, 118 | { 119 | type: 'input', 120 | name: 'email', 121 | message: '请输入您的npm邮箱地址:', 122 | }, 123 | ]); 124 | 125 | // 以下操作依赖于能够自动化的输入命令到npm login（在这个假设下编写） 126 | // 实际操作中这可能需要特殊处理，例如通过node-pty实现自动输入 127 | const {stdout: loginStdout} = await exec( 128 | `echo "${answers.username}\n${answers.password}\n${answers.email}\n" | npm login`, 129 | ); 130 | console.log('✅ 登录输出流loginStdout', loginStdout); 131 | return answers.username; 132 | } 133 | } 134 | 135 | /** 136 | * 异步地发布到npm 137 | * @returns {Promise} 138 | */ 139 | async function publishToNpm() { 140 | console.log('🚀🚀🚀 正在发布到 npm...'); 141 | 142 | try { 143 | // 这里可以添加对newVersion的使用，例如修改package.json中的版本号 144 | // 如果newVersion参数确实需要被用于发布特定版本，这里应该加入对版本号处理的逻辑 145 | // 例如使用 npm version 命令来更新项目的版本号 146 | 147 | const {stdout, stderr} = await exec('npm publish'); 148 | 149 | if (stderr) { 150 | console.log(`✅ 发布输出流stderr: ${stderr}`); 151 | } 152 | 153 | console.log(`🎉🎉🎉 npm包发布成功: ${stdout}`); 154 | } catch (error) { 155 | console.error(`❌ 发布失败: ${error.message}`); 156 | throw error; // 抛出错误以供调用方处理 157 | } 158 | } 159 | 160 | /** 161 | * 标记tag 162 | * @param {*} newVersion 163 | */ 164 | function gitOperations(newVersion) { 165 | try { 166 | process.chdir(projectRootPath); // Change the current working directory to project root 167 | 168 | // 获取当前分支名称 169 | const branchName = execSync('git rev-parse --abbrev-ref HEAD') 170 | .toString() 171 | .trim(); 172 | 173 | // 检查是否有设置 upstream（远程跟踪分支） 174 | let setUpstream = false; 175 | try { 176 | execSync(`git rev-parse --abbrev-ref --symbolic-full-name @{u}`); 177 | } catch (error) { 178 | // 如果没有设置 upstream，为远程的同名分支设置 upstream 179 | const remoteBranchExists = execSync( 180 | `git ls-remote --heads origin ${branchName}`, 181 | ) 182 | .toString() 183 | .trim(); 184 | if (remoteBranchExists) { 185 | execSync(`git branch --set-upstream-to=origin/${branchName}`); 186 | } else { 187 | console.error( 188 | `❌ 远程分支 'origin/${branchName}' 不存在，无法设置 upstream。`, 189 | ); 190 | return; 191 | } 192 | setUpstream = true; 193 | } 194 | 195 | execSync(`git add .`, {stdio: 'inherit'}); 196 | execSync(`git commit -m "chore(release): ${newVersion}"`, { 197 | stdio: 'inherit', 198 | }); 199 | execSync(`git tag v${newVersion}`, {stdio: 'inherit'}); 200 | 201 | // 推送改动到远程分支 202 | execSync(`git push`, {stdio: 'inherit'}); 203 | if (setUpstream) { 204 | // 如果之前没有 upstream，并且我们为其设置了 upstream，现在也推送它 205 | execSync(`git push --set-upstream origin ${branchName}`, { 206 | stdio: 'inherit', 207 | }); 208 | } 209 | // 推送tag到远程 210 | execSync(`git push origin v${newVersion}`, {stdio: 'inherit'}); 211 | 212 | console.log(`✅ Git tag v${newVersion} 已标记`); 213 | } catch (error) { 214 | console.error(`❌ Git 操作失败: ${error.message}`); 215 | } 216 | } 217 | 218 | /** 219 | * 设置npm的registry到指定的URL，并返回旧的registry 220 | * @returns {Promise} 当成功时返回旧的registry URL 221 | */ 222 | async function setNpmRegistry() { 223 | try { 224 | const {stdout: getRegistryStdout} = await exec(`npm config get registry`); 225 | const oldNpmRegistry = getRegistryStdout.trim(); 226 | 227 | const NPM_REGISTRY_URL = 'https://registry.npmjs.org/'; 228 | await exec(`npm config set registry ${NPM_REGISTRY_URL}`); 229 | 230 | console.log(`✅ npm registry已设置为: ${NPM_REGISTRY_URL}`); 231 | return oldNpmRegistry; // 返回旧的registry，以便后续可以恢复 232 | } catch (error) { 233 | if (error.stdout) { 234 | console.error(`❌ 设置npm registry stdout输出流: ${error.stdout}`); 235 | } 236 | if (error.stderr) { 237 | console.error(`❌ 设置npm registry stderr出错: ${error.stderr}`); 238 | } 239 | console.error(`❌ 设置npm registry中发生错误: ${error.message}`); 240 | throw error; // 抛出错误以供调用者处理 241 | } 242 | } 243 | 244 | /** 245 | * 恢复npm的registry为旧的URL 246 | * @returns {Promise} 247 | */ 248 | async function restoreNpmRegistry(oldNpmRegistry) { 249 | if (oldNpmRegistry) { 250 | try { 251 | await exec(`npm config set registry ${oldNpmRegistry}`); 252 | console.log(`✅ npm registry已恢复为: ${oldNpmRegistry}`); 253 | } catch (error) { 254 | if (error.stdout) { 255 | console.error(`✅ 恢复npm registry输出流: ${error.stdout}`); 256 | } 257 | if (error.stderr) { 258 | console.error(`❌ 恢复npm registry出错: ${error.stderr}`); 259 | } 260 | console.error(`❌ 恢复npm registry中发生错误: ${error.message}`); 261 | throw error; // 抛出错误以供调用方处理 262 | } 263 | } else { 264 | console.error(`❌ 未找到旧的npm registry，无法恢复。`); 265 | throw new Error(`❌ 未找到旧的npm registry，无法恢复。`); 266 | } 267 | } 268 | 269 | /** 270 | * 命令行显示逻辑 271 | * @param {*} latestVersion 272 | */ 273 | async function displayOptions(latestVersion) { 274 | console.log('✅ 发包脚本启动【自动更新版本号、自动发布到npm】'); 275 | console.log('!!! 使用前请确保仓库内已经是可发布状态'); 276 | const currentVersion = parseVersion(latestVersion); 277 | const choices = [ 278 | { 279 | name: `Major【大版本】 (${parseInt(currentVersion.major) + 1}.0.0)`, 280 | value: 'major', 281 | }, 282 | { 283 | name: `Minor【小版本】 (${currentVersion.major}.${parseInt(currentVersion.minor) + 1}.0)`, 284 | value: 'minor', 285 | }, 286 | { 287 | name: `Patch【修订版本】 (${currentVersion.major}.${currentVersion.minor}.${parseInt(currentVersion.patch) + 1})`, 288 | value: 'patch', 289 | }, 290 | {name: `Prepatch【预发修订版本】`, value: 'prepatch'}, 291 | {name: `Preminor【预发小版本】`, value: 'preminor'}, 292 | {name: `Premajor【预发大版本】`, value: 'premajor'}, 293 | {name: `Prerelease【预发版】`, value: 'prerelease'}, 294 | {name: `Specific version【指定版本】`, value: 'specific'}, 295 | ]; 296 | 297 | inquirer 298 | .prompt([ 299 | { 300 | type: 'list', 301 | name: 'releaseType', 302 | message: '请选择版本号的更新类型:', 303 | choices: choices, 304 | }, 305 | { 306 | type: 'input', 307 | name: 'specificVersion', 308 | message: '输入具体的版本号:', 309 | when: (answers) => answers.releaseType === 'specific', 310 | validate: (input) => 311 | /\d+\.\d+\.\d+(-\w+\.\d+)?/.test(input) || 312 | '版本号必须符合语义化版本控制规范。', 313 | }, 314 | ]) 315 | .then(async (answers) => { 316 | let newVersion = ''; 317 | // 指定版本号 318 | if (answers.releaseType === 'specific') { 319 | newVersion = answers.specificVersion; 320 | } else if (['major', 'minor', 'patch'].includes(answers.releaseType)) { 321 | // 非预发版本 322 | currentVersion[answers.releaseType]++; 323 | newVersion = `${currentVersion.major}.${currentVersion.minor}.${currentVersion.patch}`; 324 | } else { 325 | // 预发布版本 326 | newVersion = getPreReleaseVersion(currentVersion, answers.releaseType); 327 | } 328 | // 更新版本号 329 | updateVersion(newVersion); 330 | // git增加tag并提交 331 | gitOperations(newVersion); 332 | // 设置npm源 333 | const oldRegistryUrl = await setNpmRegistry(); 334 | // 检测是否已经登录npm 335 | await ensureNpmLoggedIn(); 336 | // 发布到npm 337 | await publishToNpm(); 338 | // 恢复npm源 339 | await restoreNpmRegistry(oldRegistryUrl); 340 | }); 341 | } 342 | 343 | /** 344 | * 主函数入口 345 | */ 346 | async function main() { 347 | try { 348 | const latestVersion = await getLatestVersion(); 349 | await displayOptions(latestVersion); 350 | } catch (error) { 351 | console.error('❌ 发生错误:', error); 352 | } 353 | } 354 | 355 | main(); 356 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-backgrounds-5/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var ne=Object.create;var F=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var re=Object.getOwnPropertyNames;var ce=Object.getPrototypeOf,ie=Object.prototype.hasOwnProperty;var w=(e=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(e,{get:(o,a)=>(typeof require<"u"?require:o)[a]}):e)(function(e){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+e+'" is not supported')});var x=(e,o)=>()=>(e&&(o=e(e=0)),o);var ae=(e,o)=>()=>(o||e((o={exports:{}}).exports,o),o.exports);var se=(e,o,a,r)=>{if(o&&typeof o=="object"||typeof o=="function")for(let c of re(o))!ie.call(e,c)&&c!==a&&F(e,c,{get:()=>o[c],enumerable:!(r=te(o,c))||r.enumerable});return e};var le=(e,o,a)=>(a=e!=null?ne(ce(e)):{},se(o||!e||!e.__esModule?F(a,"default",{value:e,enumerable:!0}):a,e));var I=x(()=>{});var d=x(()=>{});var m=x(()=>{});var V=ae((W,G)=>{I();d();m();(function(e){if(typeof W=="object"&&typeof G<"u")G.exports=e();else if(typeof define=="function"&&define.amd)define([],e);else{var o;typeof window<"u"||typeof window<"u"?o=window:typeof self<"u"?o=self:o=this,o.memoizerific=e()}})(function(){var e,o,a;return function r(c,h,s){function t(i,p){if(!h[i]){if(!c[i]){var u=typeof w=="function"&&w;if(!p&&u)return u(i,!0);if(n)return n(i,!0);var b=new Error("Cannot find module '"+i+"'");throw b.code="MODULE_NOT_FOUND",b}var f=h[i]={exports:{}};c[i][0].call(f.exports,function(g){var S=c[i][1][g];return t(S||g)},f,f.exports,r,c,h,s)}return h[i].exports}for(var n=typeof w=="function"&&w,l=0;l=0)return this.lastItem=this.list[n],this.list[n].val},s.prototype.set=function(t,n){var l;return this.lastItem&&this.isEqual(this.lastItem.key,t)?(this.lastItem.val=n,this):(l=this.indexOf(t),l>=0?(this.lastItem=this.list[l],this.list[l].val=n,this):(this.lastItem={key:t,val:n},this.list.push(this.lastItem),this.size++,this))},s.prototype.delete=function(t){var n;if(this.lastItem&&this.isEqual(this.lastItem.key,t)&&(this.lastItem=void 0),n=this.indexOf(t),n>=0)return this.size--,this.list.splice(n,1)[0]},s.prototype.has=function(t){var n;return this.lastItem&&this.isEqual(this.lastItem.key,t)?!0:(n=this.indexOf(t),n>=0?(this.lastItem=this.list[n],!0):!1)},s.prototype.forEach=function(t,n){var l;for(l=0;l0&&(E[T]={cacheItem:g,arg:arguments[T]},A?t(u,E):u.push(E),u.length>i&&n(u.shift())),f.wasMemoized=A,f.numArgs=T+1,B};return f.limit=i,f.wasMemoized=!1,f.cache=p,f.lru=u,f}};function t(i,p){var u=i.length,b=p.length,f,g,S;for(g=0;g=0&&(u=i[f],b=u.cacheItem.get(u.arg),!b||!b.size);f--)u.cacheItem.delete(u.arg)}function l(i,p){return i===p||i!==i&&p!==p}},{"map-or-similar":1}]},{},[3])(3)})});I();d();m();I();d();m();I();d();m();I();d();m();var C=__REACT__,{Children:ke,Component:Te,Fragment:R,Profiler:Oe,PureComponent:ve,StrictMode:Ae,Suspense:we,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:Be,cloneElement:Ee,createContext:xe,createElement:Re,createFactory:Le,createRef:Pe,forwardRef:Me,isValidElement:De,lazy:Ge,memo:L,startTransition:He,unstable_act:Ne,useCallback:q,useContext:Ue,useDebugValue:Fe,useDeferredValue:qe,useEffect:ze,useId:Ke,useImperativeHandle:Ye,useInsertionEffect:We,useLayoutEffect:Ve,useMemo:z,useReducer:$e,useRef:je,useState:K,useSyncExternalStore:Ze,useTransition:Je,version:Qe}=__REACT__;I();d();m();var to=__STORYBOOK_API__,{ActiveTabs:ro,Consumer:co,ManagerContext:io,Provider:ao,addons:P,combineParameters:so,controlOrMetaKey:lo,controlOrMetaSymbol:uo,eventMatchesShortcut:Io,eventToShortcut:mo,isMacLike:fo,isShortcutTaken:po,keyToSymbol:ho,merge:go,mockChannel:bo,optionOrAltSymbol:So,shortcutMatchesShortcut:Co,shortcutToHumanString:yo,types:Y,useAddonState:_o,useArgTypes:ko,useArgs:To,useChannel:Oo,useGlobalTypes:vo,useGlobals:M,useParameter:D,useSharedState:Ao,useStoryPrepared:wo,useStorybookApi:Bo,useStorybookState:Eo}=__STORYBOOK_API__;var U=le(V());I();d();m();var No=__STORYBOOK_CLIENT_LOGGER__,{deprecate:Uo,logger:H,once:Fo,pretty:qo}=__STORYBOOK_CLIENT_LOGGER__;I();d();m();var Vo=__STORYBOOK_COMPONENTS__,{A:$o,ActionBar:jo,AddonPanel:Zo,Badge:Jo,Bar:Qo,Blockquote:Xo,Button:en,ClipboardCode:on,Code:nn,DL:tn,Div:rn,DocumentWrapper:cn,EmptyTabContent:an,ErrorFormatter:sn,FlexBar:ln,Form:un,H1:In,H2:dn,H3:mn,H4:fn,H5:pn,H6:hn,HR:gn,IconButton:N,IconButtonSkeleton:bn,Icons:Sn,Img:Cn,LI:yn,Link:_n,ListItem:kn,Loader:Tn,OL:On,P:vn,Placeholder:An,Pre:wn,ResetWrapper:Bn,ScrollArea:En,Separator:xn,Spaced:Rn,Span:Ln,StorybookIcon:Pn,StorybookLogo:Mn,Symbols:Dn,SyntaxHighlighter:Gn,TT:Hn,TabBar:Nn,TabButton:Un,TabWrapper:Fn,Table:qn,Tabs:zn,TabsState:Kn,TooltipLinkList:$,TooltipMessage:Yn,TooltipNote:Wn,UL:Vn,WithTooltip:j,WithTooltipPure:$n,Zoom:jn,codeCommon:Zn,components:Jn,createCopyToClipboardFunction:Qn,getStoryHref:Xn,icons:et,interleaveSeparators:ot,nameSpaceClassNames:nt,resetComponents:tt,withReset:rt}=__STORYBOOK_COMPONENTS__;I();d();m();var lt=__STORYBOOK_ICONS__,{AccessibilityAltIcon:ut,AccessibilityIcon:It,AddIcon:dt,AdminIcon:mt,AlertAltIcon:ft,AlertIcon:pt,AlignLeftIcon:ht,AlignRightIcon:gt,AppleIcon:bt,ArrowDownIcon:St,ArrowLeftIcon:Ct,ArrowRightIcon:yt,ArrowSolidDownIcon:_t,ArrowSolidLeftIcon:kt,ArrowSolidRightIcon:Tt,ArrowSolidUpIcon:Ot,ArrowUpIcon:vt,AzureDevOpsIcon:At,BackIcon:wt,BasketIcon:Bt,BatchAcceptIcon:Et,BatchDenyIcon:xt,BeakerIcon:Rt,BellIcon:Lt,BitbucketIcon:Pt,BoldIcon:Mt,BookIcon:Dt,BookmarkHollowIcon:Gt,BookmarkIcon:Ht,BottomBarIcon:Nt,BottomBarToggleIcon:Ut,BoxIcon:Ft,BranchIcon:qt,BrowserIcon:zt,ButtonIcon:Kt,CPUIcon:Yt,CalendarIcon:Wt,CameraIcon:Vt,CategoryIcon:$t,CertificateIcon:jt,ChangedIcon:Zt,ChatIcon:Jt,CheckIcon:Qt,ChevronDownIcon:Xt,ChevronLeftIcon:er,ChevronRightIcon:or,ChevronSmallDownIcon:nr,ChevronSmallLeftIcon:tr,ChevronSmallRightIcon:rr,ChevronSmallUpIcon:cr,ChevronUpIcon:ir,ChromaticIcon:ar,ChromeIcon:sr,CircleHollowIcon:lr,CircleIcon:ur,ClearIcon:Ir,CloseAltIcon:dr,CloseIcon:mr,CloudHollowIcon:fr,CloudIcon:pr,CogIcon:hr,CollapseIcon:gr,CommandIcon:br,CommentAddIcon:Sr,CommentIcon:Cr,CommentsIcon:yr,CommitIcon:_r,CompassIcon:kr,ComponentDrivenIcon:Tr,ComponentIcon:Or,ContrastIcon:vr,ControlsIcon:Ar,CopyIcon:wr,CreditIcon:Br,CrossIcon:Er,DashboardIcon:xr,DatabaseIcon:Rr,DeleteIcon:Lr,DiamondIcon:Pr,DirectionIcon:Mr,DiscordIcon:Dr,DocChartIcon:Gr,DocListIcon:Hr,DocumentIcon:Nr,DownloadIcon:Ur,DragIcon:Fr,EditIcon:qr,EllipsisIcon:zr,EmailIcon:Kr,ExpandAltIcon:Yr,ExpandIcon:Wr,EyeCloseIcon:Vr,EyeIcon:$r,FaceHappyIcon:jr,FaceNeutralIcon:Zr,FaceSadIcon:Jr,FacebookIcon:Qr,FailedIcon:Xr,FastForwardIcon:ec,FigmaIcon:oc,FilterIcon:nc,FlagIcon:tc,FolderIcon:rc,FormIcon:cc,GDriveIcon:ic,GithubIcon:ac,GitlabIcon:sc,GlobeIcon:lc,GoogleIcon:uc,GraphBarIcon:Ic,GraphLineIcon:dc,GraphqlIcon:mc,GridAltIcon:fc,GridIcon:Z,GrowIcon:pc,HeartHollowIcon:hc,HeartIcon:gc,HomeIcon:bc,HourglassIcon:Sc,InfoIcon:Cc,ItalicIcon:yc,JumpToIcon:_c,KeyIcon:kc,LightningIcon:Tc,LightningOffIcon:Oc,LinkBrokenIcon:vc,LinkIcon:Ac,LinkedinIcon:wc,LinuxIcon:Bc,ListOrderedIcon:Ec,ListUnorderedIcon:xc,LocationIcon:Rc,LockIcon:Lc,MarkdownIcon:Pc,MarkupIcon:Mc,MediumIcon:Dc,MemoryIcon:Gc,MenuIcon:Hc,MergeIcon:Nc,MirrorIcon:Uc,MobileIcon:Fc,MoonIcon:qc,NutIcon:zc,OutboxIcon:Kc,OutlineIcon:Yc,PaintBrushIcon:Wc,PaperClipIcon:Vc,ParagraphIcon:$c,PassedIcon:jc,PhoneIcon:Zc,PhotoDragIcon:Jc,PhotoIcon:J,PinAltIcon:Qc,PinIcon:Xc,PlayBackIcon:ei,PlayIcon:oi,PlayNextIcon:ni,PlusIcon:ti,PointerDefaultIcon:ri,PointerHandIcon:ci,PowerIcon:ii,PrintIcon:ai,ProceedIcon:si,ProfileIcon:li,PullRequestIcon:ui,QuestionIcon:Ii,RSSIcon:di,RedirectIcon:mi,ReduxIcon:fi,RefreshIcon:pi,ReplyIcon:hi,RepoIcon:gi,RequestChangeIcon:bi,RewindIcon:Si,RulerIcon:Ci,SearchIcon:yi,ShareAltIcon:_i,ShareIcon:ki,ShieldIcon:Ti,SideBySideIcon:Oi,SidebarAltIcon:vi,SidebarAltToggleIcon:Ai,SidebarIcon:wi,SidebarToggleIcon:Bi,SpeakerIcon:Ei,StackedIcon:xi,StarHollowIcon:Ri,StarIcon:Li,StickerIcon:Pi,StopAltIcon:Mi,StopIcon:Di,StorybookIcon:Gi,StructureIcon:Hi,SubtractIcon:Ni,SunIcon:Ui,SupportIcon:Fi,SwitchAltIcon:qi,SyncIcon:zi,TabletIcon:Ki,ThumbsUpIcon:Yi,TimeIcon:Wi,TimerIcon:Vi,TransferIcon:$i,TrashIcon:ji,TwitterIcon:Zi,TypeIcon:Ji,UbuntuIcon:Qi,UndoIcon:Xi,UnfoldIcon:ea,UnlockIcon:oa,UnpinIcon:na,UploadIcon:ta,UserAddIcon:ra,UserAltIcon:ca,UserIcon:ia,UsersIcon:aa,VSCodeIcon:sa,VerifiedIcon:la,VideoIcon:ua,WandIcon:Ia,WatchIcon:da,WindowsIcon:ma,WrenchIcon:fa,YoutubeIcon:pa,ZoomIcon:ha,ZoomOutIcon:ga,ZoomResetIcon:ba,iconList:Sa}=__STORYBOOK_ICONS__;I();d();m();var Ta=__STORYBOOK_THEMING__,{CacheProvider:Oa,ClassNames:va,Global:Aa,ThemeProvider:wa,background:Ba,color:Ea,convert:xa,create:Ra,createCache:La,createGlobal:Pa,createReset:Ma,css:Da,darken:Ga,ensure:Ha,ignoreSsrWarning:Na,isPropValid:Ua,jsx:Fa,keyframes:qa,lighten:za,styled:Q,themes:Ka,typography:Ya,useTheme:Wa,withTheme:Va}=__STORYBOOK_THEMING__;I();d();m();var Qa=(()=>{let e;return typeof window<"u"?e=window:typeof globalThis<"u"?e=globalThis:typeof window<"u"?e=window:typeof self<"u"?e=self:e={},e})();I();d();m();function X(e){for(var o=[],a=1;a({borderRadius:"1rem",display:"block",height:"1rem",width:"1rem",background:e}),({theme:e})=>({boxShadow:`${e.appBorderColor} 0 0 0 1px inset`})),Ie=(e,o=[],a)=>{if(e==="transparent")return"transparent";if(o.find(c=>c.value===e))return e;let r=o.find(c=>c.name===a);if(r)return r.value;if(a){let c=o.map(h=>h.name).join(", ");H.warn(X` 8 | Backgrounds Addon: could not find the default color "${a}". 9 | These are the available colors for your story based on your configuration: 10 | ${c}. 11 | `)}return"transparent"},oe=(0,U.default)(1e3)((e,o,a,r,c,h)=>({id:e||o,title:o,onClick:()=>{c({selected:a,name:o})},value:a,right:r?C.createElement(ue,{background:a}):void 0,active:h})),de=(0,U.default)(10)((e,o,a)=>{let r=e.map(({name:c,value:h})=>oe(null,c,h,!0,a,h===o));return o!=="transparent"?[oe("reset","Clear background","transparent",null,a,!1),...r]:r}),me={default:null,disable:!0,values:[]},fe=L(function(){let e=D(v,me),[o,a]=K(!1),[r,c]=M(),h=r[v]?.value,s=z(()=>Ie(h,e.values,e.default),[e,h]);Array.isArray(e)&&H.warn("Addon Backgrounds api has changed in Storybook 6.0. Please refer to the migration guide: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md");let t=q(n=>{c({[v]:{...r[v],value:n}})},[e,r,c]);return e.disable?null:C.createElement(R,null,C.createElement(j,{placement:"top",closeOnOutsideClick:!0,tooltip:({onHide:n})=>C.createElement($,{links:de(e.values,s,({selected:l})=>{s!==l&&t(l),n()})}),onVisibleChange:a},C.createElement(N,{key:"background",title:"Change the background of the preview",active:s!=="transparent"||o},C.createElement(J,null))))}),pe=L(function(){let[e,o]=M(),{grid:a}=D(v,{grid:{disable:!1}});if(a?.disable)return null;let r=e[v]?.grid||!1;return C.createElement(N,{key:"background",active:r,title:"Apply a grid to the preview",onClick:()=>o({[v]:{...e[v],grid:!r}})},C.createElement(Z,null))});P.register(ee,()=>{P.add(ee,{title:"Backgrounds",type:Y.TOOL,match:({viewMode:e,tabId:o})=>!!(e&&e.match(/^(story|docs)$/))&&!o,render:()=>C.createElement(R,null,C.createElement(fe,null),C.createElement(pe,null))})});})(); 12 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 13 | -------------------------------------------------------------------------------- /storybook-static/sb-addons/essentials-viewport-6/manager-bundle.js: -------------------------------------------------------------------------------- 1 | try{ 2 | (()=>{var ie=Object.create;var H=Object.defineProperty;var ce=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var le=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var O=(e=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(e,{get:(t,r)=>(typeof require<"u"?require:t)[r]}):e)(function(e){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+e+'" is not supported')});var P=(e,t)=>()=>(e&&(t=e(e=0)),t);var Ie=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports);var ue=(e,t,r,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of ae(t))!se.call(e,a)&&a!==r&&H(e,a,{get:()=>t[a],enumerable:!(l=ce(t,a))||l.enumerable});return e};var pe=(e,t,r)=>(r=e!=null?ie(le(e)):{},ue(t||!e||!e.__esModule?H(r,"default",{value:e,enumerable:!0}):r,e));var d=P(()=>{});var h=P(()=>{});var m=P(()=>{});var $=Ie((Z,D)=>{d();h();m();(function(e){if(typeof Z=="object"&&typeof D<"u")D.exports=e();else if(typeof define=="function"&&define.amd)define([],e);else{var t;typeof window<"u"||typeof window<"u"?t=window:typeof self<"u"?t=self:t=this,t.memoizerific=e()}})(function(){var e,t,r;return function l(a,S,u){function i(c,I){if(!S[c]){if(!a[c]){var s=typeof O=="function"&&O;if(!I&&s)return s(c,!0);if(o)return o(c,!0);var g=new Error("Cannot find module '"+c+"'");throw g.code="MODULE_NOT_FOUND",g}var n=S[c]={exports:{}};a[c][0].call(n.exports,function(p){var b=a[c][1][p];return i(b||p)},n,n.exports,l,a,S,u)}return S[c].exports}for(var o=typeof O=="function"&&O,f=0;f=0)return this.lastItem=this.list[o],this.list[o].val},u.prototype.set=function(i,o){var f;return this.lastItem&&this.isEqual(this.lastItem.key,i)?(this.lastItem.val=o,this):(f=this.indexOf(i),f>=0?(this.lastItem=this.list[f],this.list[f].val=o,this):(this.lastItem={key:i,val:o},this.list.push(this.lastItem),this.size++,this))},u.prototype.delete=function(i){var o;if(this.lastItem&&this.isEqual(this.lastItem.key,i)&&(this.lastItem=void 0),o=this.indexOf(i),o>=0)return this.size--,this.list.splice(o,1)[0]},u.prototype.has=function(i){var o;return this.lastItem&&this.isEqual(this.lastItem.key,i)?!0:(o=this.indexOf(i),o>=0?(this.lastItem=this.list[o],!0):!1)},u.prototype.forEach=function(i,o){var f;for(f=0;f0&&(E[y]={cacheItem:p,arg:arguments[y]},x?i(s,E):s.push(E),s.length>c&&o(s.shift())),n.wasMemoized=x,n.numArgs=y+1,R};return n.limit=c,n.wasMemoized=!1,n.cache=I,n.lru=s,n}};function i(c,I){var s=c.length,g=I.length,n,p,b;for(p=0;p=0&&(s=c[n],g=s.cacheItem.get(s.arg),!g||!g.size);n--)s.cacheItem.delete(s.arg)}function f(c,I){return c===I||c!==c&&I!==I}},{"map-or-similar":1}]},{},[3])(3)})});d();h();m();d();h();m();d();h();m();d();h();m();var w=__REACT__,{Children:De,Component:Ve,Fragment:U,Profiler:Ne,PureComponent:He,StrictMode:Ue,Suspense:ze,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:Fe,cloneElement:Ge,createContext:qe,createElement:z,createFactory:We,createRef:Ye,forwardRef:je,isValidElement:Ke,lazy:Ze,memo:F,startTransition:$e,unstable_act:Je,useCallback:Qe,useContext:Xe,useDebugValue:et,useDeferredValue:tt,useEffect:L,useId:ot,useImperativeHandle:nt,useInsertionEffect:rt,useLayoutEffect:it,useMemo:ct,useReducer:at,useRef:G,useState:q,useSyncExternalStore:lt,useTransition:st,version:It}=__REACT__;d();h();m();var ht=__STORYBOOK_API__,{ActiveTabs:mt,Consumer:ft,ManagerContext:gt,Provider:St,addons:M,combineParameters:wt,controlOrMetaKey:bt,controlOrMetaSymbol:yt,eventMatchesShortcut:Ct,eventToShortcut:vt,isMacLike:Tt,isShortcutTaken:_t,keyToSymbol:xt,merge:Ot,mockChannel:At,optionOrAltSymbol:kt,shortcutMatchesShortcut:Rt,shortcutToHumanString:Et,types:W,useAddonState:Lt,useArgTypes:Bt,useArgs:Pt,useChannel:Mt,useGlobalTypes:Dt,useGlobals:Y,useParameter:j,useSharedState:Vt,useStoryPrepared:Nt,useStorybookApi:K,useStorybookState:Ht}=__STORYBOOK_API__;var N=pe($());d();h();m();var Kt=__STORYBOOK_THEMING__,{CacheProvider:Zt,ClassNames:$t,Global:J,ThemeProvider:Jt,background:Qt,color:Xt,convert:eo,create:to,createCache:oo,createGlobal:no,createReset:ro,css:io,darken:co,ensure:ao,ignoreSsrWarning:lo,isPropValid:so,jsx:Io,keyframes:uo,lighten:po,styled:A,themes:ho,typography:mo,useTheme:fo,withTheme:Q}=__STORYBOOK_THEMING__;d();h();m();var yo=__STORYBOOK_COMPONENTS__,{A:Co,ActionBar:vo,AddonPanel:To,Badge:_o,Bar:xo,Blockquote:Oo,Button:Ao,ClipboardCode:ko,Code:Ro,DL:Eo,Div:Lo,DocumentWrapper:Bo,EmptyTabContent:Po,ErrorFormatter:Mo,FlexBar:Do,Form:Vo,H1:No,H2:Ho,H3:Uo,H4:zo,H5:Fo,H6:Go,HR:qo,IconButton:V,IconButtonSkeleton:Wo,Icons:Yo,Img:jo,LI:Ko,Link:Zo,ListItem:$o,Loader:Jo,OL:Qo,P:Xo,Placeholder:en,Pre:tn,ResetWrapper:on,ScrollArea:nn,Separator:rn,Spaced:cn,Span:an,StorybookIcon:ln,StorybookLogo:sn,Symbols:In,SyntaxHighlighter:un,TT:pn,TabBar:dn,TabButton:hn,TabWrapper:mn,Table:fn,Tabs:gn,TabsState:Sn,TooltipLinkList:X,TooltipMessage:wn,TooltipNote:bn,UL:yn,WithTooltip:ee,WithTooltipPure:Cn,Zoom:vn,codeCommon:Tn,components:_n,createCopyToClipboardFunction:xn,getStoryHref:On,icons:An,interleaveSeparators:kn,nameSpaceClassNames:Rn,resetComponents:En,withReset:Ln}=__STORYBOOK_COMPONENTS__;d();h();m();var Vn=__STORYBOOK_ICONS__,{AccessibilityAltIcon:Nn,AccessibilityIcon:Hn,AddIcon:Un,AdminIcon:zn,AlertAltIcon:Fn,AlertIcon:Gn,AlignLeftIcon:qn,AlignRightIcon:Wn,AppleIcon:Yn,ArrowDownIcon:jn,ArrowLeftIcon:Kn,ArrowRightIcon:Zn,ArrowSolidDownIcon:$n,ArrowSolidLeftIcon:Jn,ArrowSolidRightIcon:Qn,ArrowSolidUpIcon:Xn,ArrowUpIcon:er,AzureDevOpsIcon:tr,BackIcon:or,BasketIcon:nr,BatchAcceptIcon:rr,BatchDenyIcon:ir,BeakerIcon:cr,BellIcon:ar,BitbucketIcon:lr,BoldIcon:sr,BookIcon:Ir,BookmarkHollowIcon:ur,BookmarkIcon:pr,BottomBarIcon:dr,BottomBarToggleIcon:hr,BoxIcon:mr,BranchIcon:fr,BrowserIcon:gr,ButtonIcon:Sr,CPUIcon:wr,CalendarIcon:br,CameraIcon:yr,CategoryIcon:Cr,CertificateIcon:vr,ChangedIcon:Tr,ChatIcon:_r,CheckIcon:xr,ChevronDownIcon:Or,ChevronLeftIcon:Ar,ChevronRightIcon:kr,ChevronSmallDownIcon:Rr,ChevronSmallLeftIcon:Er,ChevronSmallRightIcon:Lr,ChevronSmallUpIcon:Br,ChevronUpIcon:Pr,ChromaticIcon:Mr,ChromeIcon:Dr,CircleHollowIcon:Vr,CircleIcon:Nr,ClearIcon:Hr,CloseAltIcon:Ur,CloseIcon:zr,CloudHollowIcon:Fr,CloudIcon:Gr,CogIcon:qr,CollapseIcon:Wr,CommandIcon:Yr,CommentAddIcon:jr,CommentIcon:Kr,CommentsIcon:Zr,CommitIcon:$r,CompassIcon:Jr,ComponentDrivenIcon:Qr,ComponentIcon:Xr,ContrastIcon:ei,ControlsIcon:ti,CopyIcon:oi,CreditIcon:ni,CrossIcon:ri,DashboardIcon:ii,DatabaseIcon:ci,DeleteIcon:ai,DiamondIcon:li,DirectionIcon:si,DiscordIcon:Ii,DocChartIcon:ui,DocListIcon:pi,DocumentIcon:di,DownloadIcon:hi,DragIcon:mi,EditIcon:fi,EllipsisIcon:gi,EmailIcon:Si,ExpandAltIcon:wi,ExpandIcon:bi,EyeCloseIcon:yi,EyeIcon:Ci,FaceHappyIcon:vi,FaceNeutralIcon:Ti,FaceSadIcon:_i,FacebookIcon:xi,FailedIcon:Oi,FastForwardIcon:Ai,FigmaIcon:ki,FilterIcon:Ri,FlagIcon:Ei,FolderIcon:Li,FormIcon:Bi,GDriveIcon:Pi,GithubIcon:Mi,GitlabIcon:Di,GlobeIcon:Vi,GoogleIcon:Ni,GraphBarIcon:Hi,GraphLineIcon:Ui,GraphqlIcon:zi,GridAltIcon:Fi,GridIcon:Gi,GrowIcon:te,HeartHollowIcon:qi,HeartIcon:Wi,HomeIcon:Yi,HourglassIcon:ji,InfoIcon:Ki,ItalicIcon:Zi,JumpToIcon:$i,KeyIcon:Ji,LightningIcon:Qi,LightningOffIcon:Xi,LinkBrokenIcon:ec,LinkIcon:tc,LinkedinIcon:oc,LinuxIcon:nc,ListOrderedIcon:rc,ListUnorderedIcon:ic,LocationIcon:cc,LockIcon:ac,MarkdownIcon:lc,MarkupIcon:sc,MediumIcon:Ic,MemoryIcon:uc,MenuIcon:pc,MergeIcon:dc,MirrorIcon:hc,MobileIcon:mc,MoonIcon:fc,NutIcon:gc,OutboxIcon:Sc,OutlineIcon:wc,PaintBrushIcon:bc,PaperClipIcon:yc,ParagraphIcon:Cc,PassedIcon:vc,PhoneIcon:Tc,PhotoDragIcon:_c,PhotoIcon:xc,PinAltIcon:Oc,PinIcon:Ac,PlayBackIcon:kc,PlayIcon:Rc,PlayNextIcon:Ec,PlusIcon:Lc,PointerDefaultIcon:Bc,PointerHandIcon:Pc,PowerIcon:Mc,PrintIcon:Dc,ProceedIcon:Vc,ProfileIcon:Nc,PullRequestIcon:Hc,QuestionIcon:Uc,RSSIcon:zc,RedirectIcon:Fc,ReduxIcon:Gc,RefreshIcon:qc,ReplyIcon:Wc,RepoIcon:Yc,RequestChangeIcon:jc,RewindIcon:Kc,RulerIcon:Zc,SearchIcon:$c,ShareAltIcon:Jc,ShareIcon:Qc,ShieldIcon:Xc,SideBySideIcon:ea,SidebarAltIcon:ta,SidebarAltToggleIcon:oa,SidebarIcon:na,SidebarToggleIcon:ra,SpeakerIcon:ia,StackedIcon:ca,StarHollowIcon:aa,StarIcon:la,StickerIcon:sa,StopAltIcon:Ia,StopIcon:ua,StorybookIcon:pa,StructureIcon:da,SubtractIcon:ha,SunIcon:ma,SupportIcon:fa,SwitchAltIcon:ga,SyncIcon:Sa,TabletIcon:wa,ThumbsUpIcon:ba,TimeIcon:ya,TimerIcon:Ca,TransferIcon:oe,TrashIcon:va,TwitterIcon:Ta,TypeIcon:_a,UbuntuIcon:xa,UndoIcon:Oa,UnfoldIcon:Aa,UnlockIcon:ka,UnpinIcon:Ra,UploadIcon:Ea,UserAddIcon:La,UserAltIcon:Ba,UserIcon:Pa,UsersIcon:Ma,VSCodeIcon:Da,VerifiedIcon:Va,VideoIcon:Na,WandIcon:Ha,WatchIcon:Ua,WindowsIcon:za,WrenchIcon:Fa,YoutubeIcon:Ga,ZoomIcon:qa,ZoomOutIcon:Wa,ZoomResetIcon:Ya,iconList:ja}=__STORYBOOK_ICONS__;var k="storybook/viewport",he="viewport",me={viewport:"reset",viewportRotated:!1},re=(e,t)=>e.indexOf(t),fe=(e,t)=>{let r=re(e,t);return r===e.length-1?e[0]:e[r+1]},ge=(e,t)=>{let r=re(e,t);return r<1?e[e.length-1]:e[r-1]},Se=async(e,t,r,l)=>{await e.setAddonShortcut(k,{label:"Previous viewport",defaultShortcut:["alt","shift","V"],actionName:"previous",action:()=>{r({viewport:ge(l,t.viewport)})}}),await e.setAddonShortcut(k,{label:"Next viewport",defaultShortcut:["alt","V"],actionName:"next",action:()=>{r({viewport:fe(l,t.viewport)})}}),await e.setAddonShortcut(k,{label:"Reset viewport",defaultShortcut:["alt","control","V"],actionName:"reset",action:()=>{r(me)}})},we={mobile1:{name:"Small mobile",styles:{height:"568px",width:"320px"},type:"mobile"},mobile2:{name:"Large mobile",styles:{height:"896px",width:"414px"},type:"mobile"},tablet:{name:"Tablet",styles:{height:"1112px",width:"834px"},type:"tablet"}},be=(0,N.default)(50)(e=>[...ye,...Object.entries(e).map(([t,{name:r,...l}])=>({...l,id:t,title:r}))]),B={id:"reset",title:"Reset viewport",styles:null,type:"other"},ye=[B],Ce=(0,N.default)(50)((e,t,r,l)=>e.filter(a=>a.id!==B.id||t.id!==a.id).map(a=>({...a,onClick:()=>{r({viewport:a.id}),l()}}))),ve=({width:e,height:t,...r})=>({...r,height:e,width:t}),Te=A.div(()=>({display:"inline-flex",alignItems:"center"})),ne=A.div(({theme:e})=>({display:"inline-block",textDecoration:"none",padding:10,fontWeight:e.typography.weight.bold,fontSize:e.typography.size.s2-1,lineHeight:"1",height:40,border:"none",borderTop:"3px solid transparent",borderBottom:"3px solid transparent",background:"transparent"})),_e=A(V)(()=>({display:"inline-flex",alignItems:"center"})),xe=A.div(({theme:e})=>({fontSize:e.typography.size.s2-1,marginLeft:10})),Oe=(e,t,r)=>{if(t===null)return;let l=typeof t=="function"?t(e):t;return r?ve(l):l},Ae=F(Q(({theme:e})=>{let[t,r]=Y(),{viewports:l=we,defaultOrientation:a,defaultViewport:S,disable:u}=j(he,{}),i=be(l),o=K(),[f,c]=q(!1);S&&!i.find(n=>n.id===S)&&console.warn(`Cannot find "defaultViewport" of "${S}" in addon-viewport configs, please check the "viewports" setting in the configuration.`),L(()=>{Se(o,t,r,Object.keys(l))},[l,t,t.viewport,r,o]),L(()=>{let n=a==="landscape";(S&&t.viewport!==S||a&&t.viewportRotated!==n)&&r({viewport:S,viewportRotated:n})},[a,S,r]);let I=i.find(n=>n.id===t.viewport)||i.find(n=>n.id===S)||i.find(n=>n.default)||B,s=G(),g=Oe(s.current,I.styles,t.viewportRotated);return L(()=>{s.current=g},[I]),u||Object.entries(l).length===0?null:w.createElement(U,null,w.createElement(ee,{placement:"top",tooltip:({onHide:n})=>w.createElement(X,{links:Ce(i,I,r,n)}),closeOnOutsideClick:!0,onVisibleChange:c},w.createElement(_e,{key:"viewport",title:"Change the size of the preview",active:f||!!g,onDoubleClick:()=>{r({viewport:B.id})}},w.createElement(te,null),g?w.createElement(xe,null,t.viewportRotated?`${I.title} (L)`:`${I.title} (P)`):null)),g?w.createElement(Te,null,w.createElement(J,{styles:{'iframe[data-is-storybook="true"]':{...g||{width:"100%",height:"100%"}}}}),w.createElement(ne,{title:"Viewport width"},g.width.replace("px","")),w.createElement(V,{key:"viewport-rotate",title:"Rotate viewport",onClick:()=>{r({viewportRotated:!t.viewportRotated})}},w.createElement(oe,null)),w.createElement(ne,{title:"Viewport height"},g.height.replace("px",""))):null)}));M.register(k,()=>{M.add(k,{title:"viewport / media-queries",type:W.TOOL,match:({viewMode:e,tabId:t})=>e==="story"&&!t,render:()=>z(Ae,null)})});})(); 3 | }catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); } 4 | --------------------------------------------------------------------------------