open-index/open-npm huggingface dataset:
npm package: @skiyee/utils
Description: a common ts/js utils
Author: sKy
Latest version: 0.1.2

# @skiyee/utils

> ts/js 共用工具库

## 📦 安装

```sh
pnpm add @skiyee/utils
```

## 😁 作者

- Sky ([Skiyee](https://github.com/Skiyee)]

## ⚖️ 声明

采用 [MIT](./LICENSE) 许可协议
npm package: @skjnldsv/sanitize-svg
Description: a small script to remove script tags from SVGs
Author: Matt Krick
Latest version: 1.0.2
Deprecated: use DOMPurify instead https://www.npmjs.com/package/dompurify

# sanitize-svg

a small SVG sanitizer to prevent XSS attacks

## Installation

`npm install @skjnldsv/sanitize-svg`

## Why

Bad actors can put script tags in SVG files.
These script tags are not run when the svg is inside an `<img>`,
but if the SVG file is opened directly ("Open image in...") they will run under the image's domain,
which means that bad actor could steal domain-specific context (cookies, local storage, etc.)

## FAQ
### When should I use this?

Anytime someone tries to upload a svg. 
Optionally on the client, but definitely on the server.

### How do I detect if the SVG is malicious?

The output file will be null

## Usage on Client

```js
import { sanitizeSVG } from '@skjnldsv/sanitize-svg'

// String svg
const svg = '<svg xmlns="http://www.w3.org/2000/svg" version="1.1"><path ...'
const cleanImage = await sanitizeSVG(attachedImage)
if (!cleanImage) {
	alert('Howdy, hacker')
}

// File input onSubmit handler
const onSubmit = async (e) => {
	const attachedImage = e.currentTarget.files[0]
	const cleanImage = await sanitizeSVG(attachedImage)
	if (!cleanImage) {
		alert('Howdy, hacker')
	}
}
```

## License

MIT
npm package: @sklandplus/openapi
Description: A handcrafted OpenAPI 3 schema for Skland API, exported in both JSON and YAML formats.
Latest version: 0.1.1

# `@sklandplus/openapi`

This package is used to generate the OpenAPI 3.1 schema for the API. Users who wish to use the API directly should refer
to the [`@sklandplus/client`](../client/README.md) package instead.

## Usage

```typescript
import { schema } from '@sklandplus/openapi'

console.log(schema)
```

## Contributing

### How to add a new API operation

1. Put response body into a JSON -> JSON Schema converter, such as [Quicktype](https://app.quicktype.io/).
2. Copy the generated schema into `src/lib/renderer/schema/schemas/${operationName}Response.json`.
3. Make sure the schema has a top-level definition. Quicktype, for example, have the issue where it only outputs
   `definitions` without a top-level `type` and (`properties` or `items`) definition. Typically, you should just simply
   copy the first `definition` object into the top-level of the schema. If the schema have a top-level `type` and
   (`properties` or `items`) definition, you are good to go.
4. Make sure the schema does NOT have a top-level `$ref` property. Quicktype, for example, also have this issue and this
   would cause the Swagger UI to stop rendering the schema. If the schema have a top-level `$ref` property, you should
   remove it.
5. Add the schema to `src/lib/renderer/schema/index.ts`.
6. Add the operation to `src/lib/renderer/index.ts`. Make sure you are using `registry.assertThenRef` to reference the
   schema.
7. After you are done, run `yarn dev` to start a Swagger UI server locally and check if everything looks good.
npm package: @sklandplus/openapi-hypergryph-as
Description: A handcrafted OpenAPI 3 schema for Skland API, exported in both JSON and YAML formats.
Latest version: 0.1.0

# `@sklandplus/openapi-hypergryph-as`

This package is used to generate the OpenAPI 3.1 schema for the API. Users who wish to use the API directly should refer
to the [`@sklandplus/client`](../client/README.md) package instead.

For usage and contribution guides, please refer to [`@sklandplus/openapi`](../openapi/README.md).
The structure of these two packages is the same.

The main difference between this package and `@sklandplus/openapi` is, `@sklandplus/openapi` focuses on the API of
Skland, which belongs to `https://zonai.skland.com`, while this package focuses on `https://as.hypergryph.com`, which is
the API of HyperGryph.

### What does the "as" in the package name mean? 

Honestly, I have no idea either. The "as" is the prefix of `https://as.hypergryph.com`, so I just take it.
npm package: @sklechko/framework
Description: Lightweight web framework inspired by Spring framework.
Author: Sashe Klechkovski
Latest version: 0.1.4

Lightweight web framework inspired by Spring framework.

[![Build Status](https://travis-ci.org/saskodh/framework.svg?branch=master)](https://travis-ci.org/saskodh/framework)
[![Coverage Status](https://coveralls.io/repos/github/saskodh/framework/badge.svg?branch=master)](https://coveralls.io/github/saskodh/framework?branch=master)

[![Join the chat at https://gitter.im/saskodh/framework](https://badges.gitter.im/saskodh/framework.svg)](https://gitter.im/saskodh/framework?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
npm package: @sklinet/nextjs-progressbar
Description: Nprogress component for Next.js app.
Author: Apal Shah
Latest version: 0.0.17

# Next.js Progressbar

A simple Next.js progressbar component using [NProgress](http://ricostacruz.com/nprogress/).

> [I've created this Blog to help you create your own progressbar](https://gosink.in/next-js-make-your-own-progress-bar-indicator-component-easily/)

**Demo**: [https://demo-nextjs-progressbar.vercel.app](https://demo-nextjs-progressbar.vercel.app/)

## How to install?

```bash
npm i nextjs-progressbar
```

## How to use?

After installing the package, import `NextNProgress` in your `pages/_app.js` file:

```js
import NextNProgress from 'nextjs-progressbar';
```

And for rendering add `<NextNProgress />` to your `return()` in `MyApp()`:

```js
import NextNProgress from 'nextjs-progressbar';

export default function MyApp({ Component, pageProps }) {
  return (
    <>
      <NextNProgress />
      <Component {...pageProps} />;
    </>
  );
}
```

### Default Config

If no props are passed to `<NextNProgress />`, below is the default configuration applied.

```jsx
<NextNProgress color="#29D" startPosition={0.3} stopDelayMs={200} height={3} showOnShallow={true} />
```

- `color`: to change the default color of progressbar. You can also use `rgb(,,)` or `rgba(,,,)`.
- `startPosition`: to set the default starting position : `0.3 = 30%`.
- `stopDelayMs`: time for delay to stop progressbar in `ms`.
- `height`: height of progressbar in `px`.
- `showOnShallow`: You can choose whether you want the progressbar to be displayed if you're using shallow routing. It takes a boolean. Learn more about shallow routing [in Next.js docs](https://nextjs.org/docs/routing/shallow-routing).

### Advanced Config

#### Adding nonce

We use internal css in this package. If you are using csp, you can add nonce to the `<style>` tag by providing `nonce` prop to `<NextNProgress />` component.

```jsx
<NextNProgress nonce="my-nonce" />
```

#### Custom CSS

You can use `transformCSS` prop to pass custom css.
**Note:** You must return a `JSX.Element` from the function.

```jsx
<NextNProgress
  transformCSS={(css) => {
    // css is the default css string. You can modify it and return it or return your own css.
    return <style>{css}</style>;
  }}
/>
```

#### Other Configs

You can use [other configurations](https://github.com/rstacruz/nprogress#configuration) which NProgress provides by adding a JSON in `options` props.

```jsx
<NextNProgress options={{ easing: 'ease', speed: 500 }} />
```
npm package: @sklinet/react-admin-date-inputs
Description: react-admin-date-inputs
Author: SKLINET
Latest version: 1.0.3

# react-admin-date-inputs

\<DateInput>, \<TimeInput>, \<DateTimeInput> \<KeyboardDateInput/>, \<KeyboardDateTimeInput/> and <KeyboardTimeInput/> components for [React-Admin](https://github.com/marmelab/react-admin).

![date-time-picker.gif](date-time-picker.gif)

## Installation

```
npm install react-admin-date-inputs --save
```

## Usage

You have to include an icon font to display the icons on the picker. This is mentioned on the bottom of the [material-ui-pickers installation page](https://material-ui-pickers.firebaseapp.com/installation).

```html
// on index.html
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
```

```jsx
import React from 'react';
import {
    Edit,
    TextInput,
    TabbedForm,
    FormTab,
} from 'react-admin'
import { DateInput, TimeInput, DateTimeInput, KeyBoardDateInput} from 'react-admin-date-inputs';

export const NewsEdit = (props) => (
  <Edit title={<NewsTitle />} {...props}>
    <TabbedForm>
      <FormTab>
        <LongTextInput source="title" validate={required} />
        <DateInput source="startDate" label="Start date" options={{ format: 'DD/MM/YYYY' }} />
        <TimeInput source="startTime" label="Start time" options={{ format: 'HH:mm:ss' }} />
        <DateTimeInput source="endDate" label="End time" options={{ format: 'DD/MM/YYYY, HH:mm:ss', ampm: false, clearable: true }} />
      </FormTab>
    </TabbedForm>
  </Edit>
);

```

## Options prop

The options prop is passed down to the pickers. Documentation for these options can be found in the [material-ui-pickers documentation](https://material-ui-pickers.firebaseapp.com/demo/datepicker) for the component you're trying to use.

## providerOptions prop

If you want to use a date parser utils library other than `date-fns` or you want a locale other than english, you can pass the `providerOptions` prop:

```jsx
import DateFnsUtils from '@date-io/date-fns';
import MomentUtils from 'material-ui-pickers/utils/moment-utils';
import frLocale from "date-fns/locale/fr";

...
<DateInput source="date" label="Date using moment" providerOptions={{ utils: MomentUtils }} />
<DateInput source="date" label="Date in French!" providerOptions={{ utils: DateFnsUtils, locale: frLocale }} />
```

**NOTE:** When specifying a locale you must also specify the utils, even if it's the default `DateFnsUtils`.

## Development

You can build sources:

```
npm run build
```

## License

This library is licensed under the [MIT Licence](https://github.com/vascofg/react-admin-date-inputs/blob/master/LICENSE).
npm package: @sklinet/strapi-plugin-block-gallery
Description: Creates gallery of Blocks, so you can see what they look like.
Author: SKLINET s.r.o.
Latest version: 1.0.2

<h1 align="center">Strapi plugin Block Gallery</h1>

<p align="center">Creates gallery of Blocks, so you can see what they look like.</p>
<img src="assets/plugin-view.png" alt="Homepage of Strapi plugin Block Gallery">

## 👋 Intro

-   [Features](#features)
-   [Installation](#installation)
-   [Requirements](#requirements)

## <a id="features"></a>✨ Key features

-   **Automation:** Plugin automatically creates content-type "Blocks", and fills it with Strapi components that are created in folders which contain "block" in their name.
-   **Images:** You can add images to each block from your content-manager, and see them in plugins homepage. You will also be able to see the image in larger size inside modal window.
-   **External URLs:** You can also add external links to blocks if your images aren't stored in media library !

## <a id="installation"></a>🔧 Installation

Inside your Strapi app, add the package:

With `npm`:

```bash
npm install @sklinet/strapi-plugin-block-gallery
```

With `yarn`:

```bash
yarn add @sklinet/strapi-plugin-block-gallery
```

In `config/plugins.js` file add:

```js
"block-gallery":{
    enabled:true
};
```

If you do not yet have this file, then create and add:

```js
module.exports = () => ({
    "block-gallery":{
      enabled:true
    };
})
```

In order to see any components inside Block Gallery, you will have to store your components inside folders, which contains "block" in its name.

Plugin will fetch all components from these folders, and automatically create records into "Blocks" content-type with its name and displayName on first visit of its homepage.

Block name and displayName is value from yourProject/src/components/folderWithBlocks/block-name.json inside info object.

⚠️Please make sure, that all your components have correctly set info object in their schema, otherwise you'll see your block name as collectionName from the .json file.⚠️

Correctly set info object:

```js
// yourProject/src/components/folderWithBlocks/block-name.json
{
  "collectionName": "components_block_test_blocks",
  "info": {
    "name": "TestBlock", // <- Set your name to previously set displayName
    "displayName": "Block: Test", // <- Set your displayName to any name you want to be displayed
    "icon": "align-justify"
  },
  "options": {},
  "attributes": {
    "sectionId": {
      "type": "string"
    }
  }
}
```

Then run build:

```bash
npm run build
```

or

```bash
yarn build
```

After starting your project, navigate into plugins homepage (from left panel), and your blocks will be generated.

In order to add images or external links, update your records inside content-manager Blocks content-type.

## <a id="requirements"></a>⚠️ Requirements

Strapi **v4.x.x+**

Node **14 - 16**

Tested on **v4.4.1**
npm package: @sklinet/strapi-plugin-bold-title-editor
Description: A bold title/text editor to accent certain parts
Author: SKLINET s.r.o.
Latest version: 1.0.4

# Strapi plugin Bold title editor

A bold title/text editor to accentuate **certain parts** through HTML or Markdown.

## ✨ Features
* **Different output options:** choose between HTML and Markdown.
* **Actions:** accentuate **certain parts**, preview code output and clear text format.

## ⏳ Installation

```sh
# Using NPM
npm install @SKLINET/strapi-plugin-bold-title-editor
```

Then, you'll need to build your admin panel:

```sh
# Using Yarn
yarn build

# Or using NPM
npm run build
```

## 🎉 Usage

![bold title editor screenshot](./bold-title-editor.png)

### HTML
#### React/Next.js

```tsx
<h1 dangerouslySetInnerHTML={{ __html: title }} />
<h3><a href="#" dangerouslySetInnerHTML={{ __html: title }} /></h3>
```

#### Vue
```html
<h1 v-html="title" />
<h3><a href="#" v-html="title" /></h3>
```

### Markdown
#### React

```tsx
import ReactMarkdown from 'react-markdown'

<ReactMarkdown children={title} />
```
npm package: @sklinet/strapi-plugin-content-tags
Description: A Strapi plugin that allows you to add custom tags to your content.
Author: SKLINET s.r.o.
Latest version: 1.0.0

# Strapi Plugin Content Tags

A Strapi plugin that allows you to add custom tags to your content.

## Installation

```bash
# using npm
npm install @SKLINET/strapi-plugin-content-tags --save
```

To allow tags on a collection type, edit \
`./src/api/[content-type-name]/content-types/[content-type-name]/schema.json`

```json
{
  "pluginOptions": {
    "i18n": { ... },
    "content-tags": {
      "fieldName": "Tags",
      "tags": {
        "None": { "color": "neutral" },
        "Done": { "color": "success" },
        "In progress": { "color": "primary" },
        "Error": { "color": "danger" }
      },
      "defaultTag": "None"
    }
  },

  ...

  "attributes": {
    ...
    "Tags": {
      "type": "customField",
      "customField": "plugin::content-tags.content-tags"
    }
    ...
  }
}
```

The `pluginOption` section lets you configure the the tags of the collection type.
- `fieldName` is a reference to the field you have specified in the `attributes` section.
- `tags` is an objects of which the keys are the labels of the tags and the values need to contain the following properties: 
  - `color`: The display color of the badge. It is passed to a [Status component](https://design-system-git-main-strapijs.vercel.app/?path=/docs/design-system-components-status--base). \
  Possible values: alternative, danger, neutral, primary, secondary, success, warning.
- `defaultTag`: A key in `tags` that will be assigned to entities by default.

In the `attributes` section you need to define a field, using the provided custom component. You can do that by either editing `schema.json` manually or adding it through Content-Type Builder.

![](https://raw.githubusercontent.com/Freyb/strapi-plugin-content-tags/main/images/content_tags_list_view.png)

## Todo
- Add an editor to Advanced settings of Content-Type Builder where you can setup the tags.
npm package: @sklv-labs/ts-nestjs-config
Description: NestJS config package
Author: sklv-labs
Latest version: 0.1.1

# @sklv-labs/ts-nestjs-config

A NestJS config package for quick library development.

## Features

- 🎯 **Type-Safe** - Full TypeScript support with comprehensive type definitions
- 🚀 **Easy Setup** - Simple API for both synchronous and asynchronous configuration
- 🛠️ **NestJS Native** - Built on top of NestJS with seamless integration
- 📦 **Well Configured** - Pre-configured with ESLint, Prettier, Jest, and TypeScript

## Installation

```bash
npm install @sklv-labs/ts-nestjs-config
```

### Peer Dependencies

This package requires the following peer dependencies:

```bash
npm install @nestjs/common@^11.1.11 @nestjs/core@^11.1.11
```

**Note:** This package requires Node.js 24 LTS or higher.

## Quick Start

```typescript
// app.module.ts
import { Module } from '@nestjs/common';
import { ConfigModule } from '@sklv-labs/ts-nestjs-config';

@Module({
  imports: [
    ConfigModule.forRoot({
      // Your configuration options
    }),
  ],
})
export class AppModule {}
```

### Async Configuration

```typescript
// app.module.ts
import { Module } from '@nestjs/common';
import { ConfigModule as NestConfigModule, ConfigService } from '@nestjs/config';
import { ConfigModule } from '@sklv-labs/ts-nestjs-config';

@Module({
  imports: [
    NestConfigModule.forRoot(),
    ConfigModule.forRootAsync({
      imports: [NestConfigModule],
      inject: [ConfigService],
      useFactory: (config: ConfigService) => ({
        // Your configuration options
      }),
    }),
  ],
})
export class AppModule {}
```

## Development

```bash
# Build
npm run build

# Lint
npm run lint

# Format
npm run format

# Test
npm run test

# Type check
npm run type-check
```

## License

MIT © [sklv-labs](https://github.com/sklv-labs)