open-index/open-npm huggingface dataset:
npm package: @lspriv/wc-plugin-disabled
Description: 小程序日历组件日期禁用插件
Author: lspriv
Latest version: 1.0.1

## Wx Calendar Plugin For Disabled
![NPM Version](https://img.shields.io/npm/v/@lspriv/wc-plugin-disabled)
![Static Badge](https://img.shields.io/badge/coverage-later-a9a9a9)
![GitHub License](https://img.shields.io/github/license/lspriv/wc-plugin-disabled)

小程序日历 [`wx-calendar`](https://github.com/lspriv/wx-calendar) 日期禁用插件

### 使用
- 小程序基础库 `SDKVersion` >= 3.0.0
- 日历组件 [`wx-calendar`](https://github.com/lspriv/wx-calendar) >= 1.7.1

#### 安装
```bash
npm i @lspriv/wc-plugin-disabled -S
```

#### 构建
微信小程序开发工具菜单栏：`工具` --> `构建 npm`
[*官方文档*](https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html#_2-%E6%9E%84%E5%BB%BA-npm)

#### 页面使用
```html
<calendar id="calendar" />
```
```javascript
const { WxCalendar } = require('@lspriv/wx-calendar/lib');
const { DisabledPlugin, DISABLED_PLUGIN_KEY } = require('@lspriv/wc-plugin-disabled');

WxCalendar.use(DisabledPlugin, { 
  ... // 见插件选项，也可以不传
});

Page({
  handleCalendarLoad() {
    const calendar = this.selectComponent('#calendar');
    const disabledPlugin = calendar.getPlugin(DISABLED_PLUGIN_KEY);

    disabledPlugin.disable([
      { year: 2024, month: 6, day: 7 }, // 禁用单个日期
      // 禁用一个范围的日期
      [                              
        { year: 2024, month: 6, day: 10 },
        { year: 2024, month: 6, day: 15 }
      ]
    ]);

    disabledPlugin.isDateDisabled({ year: 2024, month: 6, day: 7 }); // 判断某个日期是否被禁用

    // 对传入的日期进行过滤，过滤掉当前已被禁用的日期
    disabledPlugin.filter([  
      { year: 2024, month: 6, day: 6 }, // 单个日期
      // 一个范围
      [                                 
        { year: 2024, month: 6, day: 12 },
        { year: 2024, month: 6, day: 18 }
      ]
    ])
  }
})
```

### 插件选项

<table>
    <tr>
        <th>选项</th>
        <th>类型</th>
        <th>说明</th>
        <th>默认值</th>
    </tr>
    <tr>
        <td>style</td>
        <td>object</td>
        <td>禁用样式</td>
        <td>{ opacity: 0.3 }</td>
    </tr>
</table>

### 方法

[***`disable`***](#disable) 禁用日期
```typescript
{
  /**
   * @param dates 要禁用的日期
   * @param clear 是否清除当前已禁用的日期，默认 false
   */
  (dates: Array<CalendarDay | DateRange>, clear?: boolean): void;
}
```
```typescript
type DateRange = [start: CalendarDay, end: CalendarDay];
```

[***`isDateDisabled`***](#isDateDisabled) 日期是否被禁用
```typescript
{
  /**
   * @param date 要判断的日期
   */
  (date: CalendarDay): boolean;
}
```

[***`filter`***](#filter) 过滤日期
```typescript
{filter
  /**
   * @param date 要判断的日期
   */
  (dates: Array<CalendarDay | DateRange>): Array<CalendarDay | DateRange>;
}
```

### 关于

>     有任何问题或是需求请到 `Issues` 面板提交
>     忙的时候还请见谅
>     有兴趣开发维护的道友加微信

![wx_qr](https://chat.qilianyun.net/static/git/calendar/wx.png)
npm package: @lspriv/wc-plugin-lunar
Description: 小程序日历组件农历插件
Author: lspriv
Latest version: 1.0.3-alpha.0

## Wx Calendar Plugin For Lunar
![NPM Version](https://img.shields.io/npm/v/@lspriv/wc-plugin-lunar)
![Static Badge](https://img.shields.io/badge/coverage-later-a9a9a9)
![GitHub License](https://img.shields.io/github/license/lspriv/wc-plugin-lunar)

小程序日历 [`wx-calendar`](https://github.com/lspriv/wx-calendar) 农历插件

### 使用
- 小程序基础库 `SDKVersion` >= 3.0.0
- 日历组件 [`wx-calendar`](https://github.com/lspriv/wx-calendar) >= 1.8.0

#### 安装
```bash
npm i @lspriv/wc-plugin-lunar -S
```

#### 构建
微信小程序开发工具菜单栏：`工具` --> `构建 npm`
[*官方文档*](https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html#_2-%E6%9E%84%E5%BB%BA-npm)

#### 页面使用
```html
<calendar id="calendar" />
```
```javascript
const { WxCalendar } = require('@lspriv/wx-calendar/lib');
const { LunarPlugin, LUNAR_PLUGIN_KEY } = require('@lspriv/wc-plugin-lunar');

WxCalendar.use(LunarPlugin);

Page({
  handleCalendarLoad() {
    const calendar = this.selectComponent('#calendar');
    const lunarPlugin = calendar.getPlugin(LUNAR_PLUGIN_KEY);
    // 获取农历信息
    const lunarDate = lunarPlugin.getLunar({ year: 2023, month: 10, day: 26 });
    console.log('lunarDate', lunarDate);
  }
})
```

#### 插件选项
[***`markColor`***](#cli) `string` 农历节气下标颜色，默认 --wc-solar-color

[***`nyColor`***](#cli) `string` 年面板大年初一颜色，默认 #F56C6C

[***`nyColor`***](#cli) `string` 年面板农历普通月初一颜色，默认 #409EFF

### 关于

>     有任何问题或是需求请到 `Issues` 面板提交
>     忙的时候还请见谅
>     有兴趣开发维护的道友加微信

![wx_qr](https://chat.qilianyun.net/static/git/calendar/wx.png)
npm package: @lspriv/wc-plugin-multiple
Description: 小程序日历组件多选插件
Author: lspriv
Latest version: 1.0.3

## Wx Calendar Plugin For MultiSelector
![NPM Version](https://img.shields.io/npm/v/@lspriv/wc-plugin-multiple)
![Static Badge](https://img.shields.io/badge/coverage-later-a9a9a9)
![GitHub License](https://img.shields.io/github/license/lspriv/wc-plugin-multiple)

小程序日历 [`wx-calendar`](https://github.com/lspriv/wx-calendar) 多选插件

[![pktvhAU.png](https://s21.ax1x.com/2024/06/08/pktvhAU.png)](https://imgse.com/i/pktvhAU)

### 使用
- 小程序基础库 `SDKVersion` >= 3.0.0
- 日历组件 [`wx-calendar`](https://github.com/lspriv/wx-calendar) >= 1.7.0

#### 安装
```bash
npm i @lspriv/wc-plugin-multiple -S
```

#### 构建
微信小程序开发工具菜单栏：`工具` --> `构建 npm`
[*官方文档*](https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html#_2-%E6%9E%84%E5%BB%BA-npm)

#### 页面使用
```html
<calendar id="calendar" bindchange="handleChange" />
```
```javascript
const { WxCalendar } = require('@lspriv/wx-calendar/lib');
const { MultiPlugin, MULTI_PLUGIN_KEY } = require('@lspriv/wc-plugin-multiple');

WxCalendar.use(MultiPlugin, { 
  ... // 见插件选项，也可以不传选项，使用默认选项
});

Page({
  handleCalendarLoad() {
    const calendar = this.selectComponent('#calendar');
    const multiSelector = calendar.getPlugin(MULTI_PLUGIN_KEY);
    multiSelector.select([
      { year: 2024, month: 6, day: 3 },
      { year: 2024, month: 6, day: 28 }
    ]);
  },
  handleChange(e) {
    const { checked } = e;
    // 选中的日期
    console.log('checked', checked);
  }
})
```

### 插件选项

<table>
    <tr>
        <th>选项</th>
        <th>类型</th>
        <th>说明</th>
        <th>默认值</th>
    </tr>
    <tr>
        <td>type</td>
        <td>'range' | 'multi'</td>
        <td>范围选择/多点选择</td>
        <td>range</td>
    </tr>
    <tr>
        <td>bgColor</td>
        <td>{ light: string; dark: string; }</td>
        <td>选中背景色</td>
        <td>{ light: '#409EFF', dark: '#409EFF' }</td>
    </tr>
    <tr>
        <td>textColor</td>
        <td>{ light: string; dark: string; }</td>
        <td>选中字体色</td>
        <td>{ light: '#FFF', dark: '#E5E5E5' }</td>
    </tr>
    <tr>
        <td>borderRadius</td>
        <td>number</td>
        <td>选中背景圆角（单位rpx）</td>
        <td>50</td>
    </tr>
</table>

### 触发事件

[***`bindchange`***](#bindchange)  日期选中变化
```typescript
type ChangeEventDetail = {
    checked: Array<CalenderDay>; // 当前选中日期
    validDates: Array<CalenderDay | [start: CalenderDay, end: CalenderDay]>; // 有效日期，是由单个有效日期和日期有效范围组成的数组
}
```

### 方法

[***`select`***](#select) 选择日期
```typescript
{
  /**
   * @param dates 选中日期，范围选择下如 [start, end] 格式
   * @param clear 是否清除原有选中日期，多点选择模式下有效，默认 false
   */
  (dates: Array<CalendarDay>, clear?: boolean): void;
}
```

### 关于

>     有任何问题或是需求请到 `Issues` 面板提交
>     忙的时候还请见谅
>     有兴趣开发维护的道友加微信

![wx_qr](https://chat.qilianyun.net/static/git/calendar/wx.png)
npm package: @lspriv/wc-shared
Description: 小程序日历工具包
Author: lspriv
Latest version: 1.2.0

## Wx-Calendar Shared Methods
![NPM Version](https://img.shields.io/npm/v/@lspriv/wc-shared)
![Static Badge](https://img.shields.io/badge/coverage-later-a9a9a9)
![GitHub License](https://img.shields.io/github/license/lspriv/wc-shared)

小程序日历 [`@lspriv/wx-calendar`](https://github.com/lspriv/wx-calendar) 和日历插件 `@lspriv/wc-plugin-*` 复用的工具包。

### 安装

```bash
npm i @lspriv/wc-shared -S
```
npm package: @lsproule/mobile-detect
Description: React hook + Tailwind plugin for detecting iOS, Android, and mobile devices via user agent.
Author: Lucas Sproule
Latest version: 1.0.5

# @lsproule/mobile-detect

React hook + Tailwind plugin for detecting iOS, Android, and mobile devices via user agent and touch capabilities.

## Installation

```bash
npm install @lsproule/mobile-detect
```

## Usage

### React Hooks

```tsx
import { 
  useMobileDeviceClasses, 
  useDetectIOS, 
  useDetectAndroid, 
  useDetectTouchScreen,
  useDetectCoarsePointer,
  useDetectWindows
} from "mobile-device-detect"

function App() {
  useMobileDeviceClasses() // Adds device classes to <html>
  
  // Or use individual hooks
  useDetectIOS()
  useDetectAndroid()
  useDetectTouchScreen()
  useDetectCoarsePointer()
  useDetectWindows()
  
  return <div>Your app</div>
}
```

### Tailwind Plugin

```js
// tailwind.config.js
const { mobileDevicePlugin } = require("mobile-device-detect")

module.exports = {
  plugins: [
    mobileDevicePlugin
  ]
}
```

Now you can use device-specific variants:

```css
.text-red-500 {
  ios-device:text-blue-500;
  android-device:text-green-500;
  mobile-device:text-purple-500;
  touch-device:bg-yellow-200;
  coarse-pointer:border-4;
  windows-device:font-mono;
}
```

## API

### React Hooks
- `useMobileDeviceClasses()` - Detects iOS/Android/touch/coarse pointer and adds appropriate classes
- `useDetectIOS()` - Adds `ios-device` class for iOS devices
- `useDetectAndroid()` - Adds `android-device` class for Android devices
- `useDetectTouchScreen()` - Adds `touch-device` class for touch-capable devices
- `useDetectCoarsePointer()` - Adds `coarse-pointer` class for devices with coarse pointer (touch)
- `useDetectWindows()` - Adds `windows-device` class for Windows devices

### Tailwind Variants
The plugin adds these variants:
- `ios-device:` - Applies styles when `ios-device` class is present
- `android-device:` - Applies styles when `android-device` class is present
- `mobile-device:` - Applies styles when `mobile-device` class is present (iOS, Android, or non-Windows with touch)
- `touch-device:` - Applies styles when `touch-device` class is present
- `coarse-pointer:` - Applies styles when `coarse-pointer` class is present
- `windows-device:` - Applies styles when `windows-device` class is present

### Detection Logic
- **iOS**: Detected via user agent pattern `/iPhone|iPod|iPad/i`
- **Android**: Detected via user agent pattern `/Android/i`
- **Touch Screen**: Detected via `ontouchstart` in window or `navigator.maxTouchPoints > 0`
- **Coarse Pointer**: Detected via CSS media query `(pointer: coarse)`
- **Windows**: Detected via user agent pattern `/Windows/i`
- **Mobile Device**: iOS, Android, or non-Windows devices with touch screen or coarse pointer