{"_id":"@ambilight-taro/calendar","name":"@ambilight-taro/calendar","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@ambilight-taro/calendar","version":"1.0.0","description":" ","main":"./lib/index.js","types":"./lib/index.d.ts","scripts":{"test":"echo \"Error: no test specified\" && exit 1","build":"rollup -c","build:watch":"rollup -cw"},"repository":{"type":"git","url":"git+https://github.com/pesce-salato/ambilight-taro-ui.git"},"author":"","license":"MIT","bugs":{"url":"https://github.com/pesce-salato/ambilight-taro-ui/issues"},"homepage":"https://github.com/pesce-salato/ambilight-taro-ui#readme","devDependencies":{"@ambilight-taro/rollup-config":"*","@ambilight-taro/tsconfig":"*","@tarojs/components":"3.6.19","@tarojs/taro":"3.6.19","@types/react":"^18.2.38","react":"^18.0.0","rollup":"^4.5.1","typescript":"^5.3.2"},"dependencies":{"@ambilight-taro/basic-view":"^1.0.0","@ambilight-taro/core":"^1.0.0","@ambilight-taro/use-compatible-uncontrolled-value":"^1.0.0","dayjs":"^1.11.13","solarlunar":"^2.0.7"},"gitHead":"9ab8a57d0a8fda45ebfa6bd4e46e8ab04a420935","_id":"@ambilight-taro/calendar@1.0.0","_nodeVersion":"20.18.2","_npmVersion":"lerna/7.4.2/node@v20.18.2+arm64 (darwin)","dist":{"integrity":"sha512-g3sKfbupaDRFR1JAzSdOgN9nMgAJCfALC+GguA7yu/CJbmnI/jFXZKWZJP0o0GDXypGmVZ5NmGUPedTALFC/MA==","shasum":"5f60550724db4ea0b396b8646c9a64d85e249f73","tarball":"https://registry.npmjs.org/@ambilight-taro/calendar/-/calendar-1.0.0.tgz","fileCount":22,"unpackedSize":44059,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQDEIcqQoEzFlNbQrjao58mAGySe7X3TDayUcRQ2dHFWaQIhAPcwLUWjhhp/jI14wJu1YofDCjLsL3Lp9jX7tIWX5DQK"}]},"_npmUser":{"name":"chicken_bro","email":"ordinary_person@outlook.com"},"directories":{},"maintainers":[{"name":"chicken_bro","email":"ordinary_person@outlook.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/calendar_1.0.0_1742741474980_0.3738307524318121"},"_hasShrinkwrap":false}},"time":{"created":"2025-03-23T14:51:14.906Z","1.0.0":"2025-03-23T14:51:15.172Z","modified":"2025-03-23T14:51:15.411Z"},"maintainers":[{"name":"chicken_bro","email":"ordinary_person@outlook.com"}],"description":" ","homepage":"https://github.com/pesce-salato/ambilight-taro-ui#readme","repository":{"type":"git","url":"git+https://github.com/pesce-salato/ambilight-taro-ui.git"},"bugs":{"url":"https://github.com/pesce-salato/ambilight-taro-ui/issues"},"license":"MIT","readme":"# @ambilight-taro/calendar\n\n\n\n\n## Installation\n\n```shell\nnpm install @ambilight-taro/calendar\n```\n\n## Usage\n\n日历组件\n\n> 组件中使用到了 ScrollView，故而需要给组件本身或者父级容器设置一个明确的高度\n> PS：如果用到的是类似于 `45%` or `flex: 1`，则往上查找父级，直至有明确高度（100vh -> 明确高度）\n\n### Basic\n\n```tsx\nimport { AlCalendar } from '@ambilight-taro/calendar'\n\n\n```\n\n### 受控\n\n```tsx\nconst [value, setValue] = useState([])\n\n\n```\n\n### 非受控\n\n```tsx\n console.log(`what a nice day`, e)}\n/>\n```\n\n### Range\n\n`min`、`max` props 设定选择日期范围\n\n```tsx\n\n```\n\n### Type\n\n组件支持单选、多选、范围选择\n\n```tsx\n\n```\n\n### First day of week row\n\n设定日历每周（每一行）的第一天展示为周一还是周日\n\n```tsx\n\n```\n\n### Day render\n\n自定义日期渲染器\n\n```tsx\n// 使用预设格式渲染\nconst dayRender = useCallback((date) => {\n return {\n main: date.day.toString().padStart(2, '0')\n }\n}, [])\n\n\n```\n\n```tsx\n// 完全自定义渲染，需要自行维护选中状态样式\nconst render = useCallback((date, status) => {\n return {date.day.toString().padStart(2, '0')}\n}, [])\n\n\n```\n\n### Day of week title render\n\n自定义 周每日标题渲染器（固定在上方展示每一列是周几的模块）\n\n```tsx\nconst dayOfWeekTitleRender = useCallback((dayOfWeek) => {\n return ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'][dayOfWeek]\n}, [])\n\n\n```\n\n### Month title render\n\n自定义 月标题渲染器\n\n```tsx\nconst monthTitleRender = useCallback((year, month) => {\n return (\n {`${year}/${month.toString().padStart(2, '0')}`}\n )\n}, [])\n\n\n```\n\n## Preset\n\n组件为中国阴历、节气、节假日做了 `dayRender` 预设\n\n### Basic\n\n```tsx\nimport { usePresetCnDayRender } from '@ambilight-taro/calendar'\n\nconst dayRender = usePresetCnDayRender()\n```\n\n```tsx\ninterface AlCalendarPresetCnBuilderOptions {\n /**\n * 是否禁用阴历\n * @default false\n */\n isLunarDisabled?: boolean\n /**\n * 是否禁用节假日\n * @default false\n */\n isHolidayDisabled?: boolean\n}\n```\n\n### Lunar\n\n阴历日期、节气等信息\n\n> 数据来源：https://www.npmjs.com/package/solarlunar\n> 支持年份：1900-2100\n> 由于库体积大小等原因，故而没有选择范围更加全的库\n\n### Holiday\n\n公历节日、放假、补班信息\n\n中国假日信息来源于每年国务院文件发布（故而明年的文件不发布之前无法得知）\n\n如果需要使用默认源，请将 *https://cdn.salted-fish.org* 加入到小程序 **request合法请求域名**\n\n> - 数据来源： https://github.com/NateScarlet/holiday-cn\n> - 数据 cdn（在此感谢赛博活菩萨 cloudflare）\n> - template: https://cdn.salted-fish.org/ambilight-taro/holiday-cn/{year}.json\n> - 🌰：https://cdn.salted-fish.org/ambilight-taro/holiday-cn/2025.json\n\n#### Custom data loader\n\n自定义数据加载器\n\n```tsx\n// 返回类型如果是 `string` 则会视为 cdn 地址，网络请求进行加载（请提前加入 **request合法域名列表**）\n// 返回类型是 `object`，则会直接使用，请保证格式正确\nconst loader: ((year: number) => string | CnHolidayJsonObject) | undefined = () => {\n return `https://cdn.salted-fish.org/ambilight-taro/holiday-cn/${year}.json`\n}\n\nusePresetCnDayRender.getHolidayOfYear = loader\n```\n\n```tsx\ninterface CnHolidayJsonObject {\n days: CnHoliday[]\n}\n\ninterface CnHoliday {\n /**\n * 引起休假、补班的假日名\n */\n name: string\n /**\n * 公历日期 （YYYY-MM-DD）\n */\n date: string\n /**\n * 是否休假\n * - false 为补班\n */\n isOffDay: boolean\n}\n```\n\n#### Preload\n\n提前加载节假日信息\n\n> 因为有缓存功能，故而需要在页面在加载完成之后调用\n> 可重复调用，并不会重复发起请求\n\n```tsx\nusePresetCnDayRender.preload([dayjs().year()])\n```\n\n## Props & Types\n\n```tsx\ninterface AlCalendarProps {\n /**\n * 类型\n * @default 'single'\n */\n type?: AlCalendarType\n /**\n * 自定义 日期渲染器\n */\n dayRender?: AlCalendarDayRender\n /**\n * 最小日期\n * @format YYYY-MM-DD\n * @default 三个月前\n */\n min?: string\n /**\n * 最大日期\n * @format YYYY-MM-DD\n * @default 三个月后\n */\n max?: string\n /**\n * 选择值\n * @format YYYY-MM-DD\n */\n value?: string[]\n /**\n * 默认值\n * @format YYYY-MM-DD\n */\n defaultValue?: string[]\n /**\n * 值改变事件\n */\n onChange?: (v: string[]) => void\n /**\n * 每周的第一列\n * @default 'mon' 周一\n */\n weekRowFirstDay?: AlCalendarWeekRowFirstDay\n /**\n * 自定义 周每日标题渲染器\n */\n dayOfWeekTitleRender?: AlCalendarDayOfWeekTitleRender\n /**\n * 自定义 月标题渲染器\n */\n monthTitleRender?: AlCalendarMonthTitleRender\n className?: string\n style?: React.CSSProperties | string\n}\n```\n\n```tsx\ntype AlCalendarType = 'single' | 'range' | 'multiple'\n\ntype AlCalendarWeekRowFirstDay = 'mon' | 'sun'\n```\n\n```tsx\ninterface AlCalendarPresetRenderStruct {\n main: React.ReactNode\n top?: React.ReactNode\n bottom?: React.ReactNode\n className?: string\n insert?: React.ReactNode\n}\n\ntype AlCalendarDayRender = (\n date: AlCalendarDate,\n status: EnumValueUnion\n) => React.ReactNode | AlCalendarPresetRenderStruct\n```\n\n```tsx\n/**\n * @param dayOfWeek 0 (Sunday) to 6 (Saturday).\n */\ntype AlCalendarDayOfWeekTitleRender = (dayOfWeek: number) => React.ReactNode\n```\n\n```tsx\n/**\n * @param month 0-11\n */\ntype AlCalendarMonthTitleRender = (year: number, month: number) => React.ReactNode\n```\n\n```tsx\ninterface AlCalendarDate {\n year: number\n /**\n * 0 - 11\n */\n month: number\n day: number\n}\n```\n\n```tsx\ntype AlCalendarDayStatus = 'unselected' | 'range-middle' | 'range-start' | 'range-end' | 'range-start-and-end' | 'selected'\n```\n\n```tsx\ninterface AlCalendarReference {\n scrollTo: (year: number, month: number) => void\n}\n```\n","readmeFilename":"README.md","_rev":"1-8bda121afb455139b3c52ea1c4cdd304"}