open-index/open-npm huggingface dataset:
npm package: @maxstudener/react-mui-daterange-picker
Description: A react date range picker using Material Design(@mui)
Author: Max Studener
Latest version: 0.0.2

# react-daterange-picker

A react date range picker using mui components forked from [react-daterange-picker](https://www.npmjs.com/package/@matharumanpreet00/react-daterange-picker).

This repo was converted to use mui v5 instead of material-ui. It also removed modal functionality and made it a regular component.

![Preview](screenshot_1.png)

## Usage

```bash
npm install @maxstudener/react-mui-daterange-picker --save
# or with yarn
yarn add @maxstudener/react-mui-daterange-picker
```

## Basic Example

```tsx
import React from "react";
import { DateRangePicker, DateRange } from "@maxstudener/react-mui-daterange-picker";

type Props = {}
type State = {
    dateRange: DateRange
}

class App extends React.Component<Props, State> {
	state = {
		dateRange: {}
	};

	render() {
		return (
			<DateRangePicker
				onChange={range => this.setState({ dateRange: range })}
			/>
		);
	}
}

export default App;
```

## Basic example using hooks

```tsx
import React from "react";
import { DateRangePicker, DateRange } from "@maxstudener/react-mui-daterange-picker";

type Props = {}

const App: React.FunctionComponent<Props> = props => {
	const [dateRange, setDateRange] = React.useState<DateRange>({});

	return (
		<DateRangePicker
			onChange={range => setDateRange(range)}
		/>
	);
}

export default App;
```

## Types

```ts
interface DateRange {
    startDate?: Date,
    endDate?: Date
}

interface DefinedRange {
    label: string,
    startDate: Date,
    endDate: Date
}
```

## Props

Name | Type | Required | Default value | Description
:--- | :--- | :--- | :--- | :---
`initialDateRange` | `DateRange` | | `{}` | initially selected date range
`minDate` | `Date` | | 10 years ago | min date allowed in range
`maxDate` | `Date` | | 10 years from now | max date allowed in range
`onChange` | `(DateRange) => void` | _required_ | - | handler function for providing selected date range
`definedRanges` | `DefinedRange[]` | | - | custom defined ranges to show in the list
npm package: @maxswjeon/editorjs-header
Description: Header Tool for Editor.js
Author: CodeX
Latest version: 2.7.0-patch2

# Heading Tool

> **Note**
>
> This is a modified version for typescript support by Sangwan Jeon <me@swjeon.kr>

![Version of EditorJS that the plugin is compatible with](https://badgen.net/badge/Editor.js/v2.0/blue)

Provides Headings Blocks for the [Editor.js](https://ifmo.su/editor).

## Installation

### Install via NPM

Get the package

```shell
npm i --save @editorjs/header
```

Include module at your application

```javascript
const Header = require("@editorjs/header");
```

### Download to your project's source dir

1. Upload folder `dist` from repository
2. Add `dist/bundle.js` file to your page.

### Load from CDN

You can load specific version of package from [jsDelivr CDN](https://www.jsdelivr.com/package/npm/@editorjs/header).

`https://cdn.jsdelivr.net/npm/@editorjs/header@latest`

Then require this script on page with Editor.js.

```html
<script src="..."></script>
```

## Usage

Add a new Tool to the `tools` property of the Editor.js initial config.

```javascript
var editor = EditorJS({
  ...

  tools: {
    ...
    header: Header,
  },

  ...
});
```

## Shortcut

You can insert this Block by a useful shortcut. Set it up with the `tools[].shortcut` property of the Editor's initial config.

```javascript
var editor = EditorJS({
  ...

  tools: {
    ...
    header: {
      class: Header,
      shortcut: 'CMD+SHIFT+H',
    },
  },

  ...
});
```

## Config Params

All properties are optional.

| Field        | Type       | Description                 |
| ------------ | ---------- | --------------------------- |
| placeholder  | `string`   | header's placeholder string |
| levels       | `number[]` | enabled heading levels      |
| defaultLevel | `number`   | default heading level       |

```javascript
var editor = EditorJS({
  ...

  tools: {
    ...
    header: {
      class: Header,
      config: {
        placeholder: 'Enter a header',
        levels: [2, 3, 4],
        defaultLevel: 3
      }
    }
  }

  ...
});
```

## Tool's settings

![An image showing the header block tool](https://capella.pics/634ad545-08d7-4cb7-8409-f01289e0e5e1.jpg)

You can select one of six levels for heading.

## Output data

| Field | Type     | Description                                      |
| ----- | -------- | ------------------------------------------------ |
| text  | `string` | header's text                                    |
| level | `number` | level of header: 1 for H1, 2 for H2 ... 6 for H6 |

```json
{
  "type": "header",
  "data": {
    "text": "Why Telegram is the best messenger",
    "level": 2
  }
}
```
npm package: @maxtan/ez-ui-nuxt
Description: 基于ez-ui组件库的nuxt版本
Author: MaxTan
Latest version: 1.0.0

# 基于ez-ui组件库的nuxt版本

工作区内屏蔽`install`相关的钩子函数，项目启动是按照以下步骤构建

在工作区项目根目录执行

```
  pnpm i // 安装包依赖 自动会工作区内项目依赖
```

在本项目根执行

```
  pnpm run init // 此命令生产.nuxt目录，会有类型推导，自动注入配置
```

在工作区根目录执行，或项目根目录执行

```
  pnpm run build:nuxt // 在工作区根目录执行
  pnpm run build // 在项目根目录执行
```
npm package: @maxtec/prettier-config
Description: My personal Prettier config
Author: Max Tec
Latest version: 1.0.1


# Personal prettier configuration

## Author

- [@Maxtec](https://www.github.com/maxtec)



## Installation

To install this package run the following command in the terminal in the root directory of your application.

```bash
  npm install --save-dev @MaxTec/prettier-config
```
    
## Usage/Examples

```json
    "prettier": "@MaxTec/prettier-config"  
```
npm package: @maxter-dev/ngx-components
Description: Angular standalone component library with PrimeIcons support
Author: Mato Makuch
Latest version: 0.3.17

<p align="center">
  <img src="https://raw.githubusercontent.com/MatoMakuch/maxterdev/main/projects/ngx-components/src/lib/assets/maxter-dev.svg" alt="MaxterDev Logo" width="200"/>
</p>

<h1 align="center">MaxterDev NGX Components</h1>

<p align="center">
  🚀 Highly Flexible and Customizable Components Library for Angular
</p>

---

## 📦 Installation
Install the library using npm:

```bash
npm install @maxter-dev/ngx-components
```

---

## 🚀 Quick Start
### Import and Use a Component
Example usage for the `CheckboxComponent`:

1. **Import the component** into your Angular app:

```typescript
import { Component } from '@angular/core';
import { CheckboxComponent } from '@maxter-dev/ngx-components';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [CheckboxComponent],
  template: `
    <maxterdev-checkbox 
      [checked]="isChecked" 
      [disabled]="isDisabled"
      (checkedChange)="handleCheckboxChange($event)">
    </maxterdev-checkbox>
  `
})
export class AppComponent {
  isChecked = false;
  isDisabled = false;

  handleCheckboxChange(value: boolean) {
    console.log('Checkbox changed:', value);
    this.isChecked = value;
  }
}
```

---

### 🌈 Import Global Styles
To include the library's global styles (like buttons, typography, etc.), add the following to your **`styles.scss`**:

```scss
@import '@maxter-dev/ngx-components/assets/styles/main.scss';
```

---

## 📚 Available Components
| Component | Selector | Description |
| --------- | -------- | ----------- |
| ✅ Checkbox | `<maxterdev-checkbox>` | Customizable checkbox component |
| ✅ Dropdown | `<maxterdev-dropdown>` | Customizable dropdown component |
| ✅ Table | `<maxterdev-table>` | Flexible table component |
| ✅ List | `<maxterdev-list>` | Highly configurable list component |
| ✅ Tabs | `<maxterdev-tabs>` | Multi-tab navigation component |

---

## 🛠️ Customization
All components support extensive customization via:
- **Inputs** → Change behavior and data dynamically  
- **Outputs** → Handle events and state changes  
- **Styling** → Fully customizable with SCSS variables  

---

## 🏆 Why Use MaxterDev NGX Components?
✅ Fully compatible with **Angular 18+**  
✅ Clean and modern API  
✅ Lightweight and tree-shakable  
✅ Modular architecture  
✅ Open-source and actively maintained  

---

## 📥 Contributing
We welcome contributions!  
1. Fork the repository  
2. Create a branch  
3. Submit a pull request  

---

## 🔗 Links
- **NPM Package:** [@maxter-dev/ngx-components](https://www.npmjs.com/package/@maxter-dev/ngx-components)  
- **GitHub:** [https://github.com/MaxterDev/ngx-components](https://github.com/MaxterDev/ngx-components)  

---

## ⚖️ License
Licensed under the **MIT** License.

---

<p align="center">
✨ Developed with ❤️ by <b>MaxterDev</b>
</p>