@nattui/react-components 0.0.12 → 0.0.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -1,11 +1,11 @@
1
- import styles from './button-background.module-T5B7XZ2Z.module.css';
1
+ import styles3 from './button.module-VAXL2INY.module.css';
2
+ import styles from './button-background.module-Y3DFESUY.module.css';
2
3
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
3
- import styles2 from './button-spinner.module-4TBETQ4T.module.css';
4
- import styles3 from './button.module-HTK2BWYK.module.css';
5
- import styles4 from './input.module-M44BKREB.module.css';
6
- import styles5 from './label.module-4CZ6ETIR.module.css';
4
+ import styles2 from './button-spinner.module-T3OGVJS4.module.css';
5
+ import styles4 from './input.module-GMZ6XJ62.module.css';
6
+ import styles5 from './label.module-3W6OLN6C.module.css';
7
7
 
8
- // src/button-background.tsx
8
+ // src/button.tsx
9
9
  function ButtonBackground(props) {
10
10
  const { isRounded = false, variant = "primary" } = props;
11
11
  const combinedBackgroundStyles = `
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/button-background.tsx","../src/button-spinner.tsx","../src/button.tsx","../src/input.tsx","../src/label.tsx"],"names":["jsx","styles"],"mappings":"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","file":"index.mjs","sourcesContent":["import type { JSX } from \"react\"\nimport type { ButtonProps } from \"@/button\"\nimport styles from \"@/button-background.module.css\"\n\nexport interface ButtonBackgroundProps\n extends Pick<ButtonProps, \"isRounded\" | \"variant\"> {}\n\nexport function ButtonBackground(props: ButtonBackgroundProps): JSX.Element {\n const { isRounded = false, variant = \"primary\" } = props\n\n const combinedBackgroundStyles = `\n ${BUTTON_BACKGROUND_CLASS_NAME.BASE}\n ${isRounded ? BUTTON_BACKGROUND_CLASS_NAME.ROUNDED.FULL : BUTTON_BACKGROUND_CLASS_NAME.ROUNDED.BASE}\n ${variant === \"accent\" ? BUTTON_BACKGROUND_CLASS_NAME.VARIANT.ACCENT : \"\"}\n ${variant === \"primary\" ? BUTTON_BACKGROUND_CLASS_NAME.VARIANT.PRIMARY : \"\"}\n `\n .replaceAll(/\\s+/g, \" \")\n .trim()\n\n if (!(variant === \"accent\" || variant === \"primary\")) return <></>\n\n return (\n <div\n className={combinedBackgroundStyles}\n data-element=\"button-background\"\n />\n )\n}\n\nexport const BUTTON_BACKGROUND_CLASS_NAME = {\n BASE: styles.button_background,\n ROUNDED: {\n BASE: styles.button_background__rounded_base,\n FULL: styles.button_background__rounded_full,\n },\n VARIANT: {\n ACCENT: styles.button_background__variant_accent,\n PRIMARY: styles.button_background__variant_primary,\n },\n} as const\n","import type { CSSProperties, JSX } from \"react\"\nimport styles from \"@/button-spinner.module.css\"\n\nexport interface ButtonSpinnerProps {\n size?: number\n}\n\nexport function ButtonSpinner(props: ButtonSpinnerProps): JSX.Element {\n const { size = 16 } = props\n\n return (\n <div\n className={styles.button_spinner}\n style={{ \"--size\": `${size}px` } as CSSProperties}\n >\n {Array.from({ length: 12 }).map((_, index) => (\n <div key={index} />\n ))}\n </div>\n )\n}\n","import type { ComponentProps, JSX, ReactNode } from \"react\"\nimport { ButtonBackground } from \"@/button-background\"\nimport { ButtonSpinner } from \"@/button-spinner\"\nimport styles from \"@/button.module.css\"\n\nexport interface ButtonProps\n extends Omit<ComponentProps<\"button\">, \"aria-pressed\" | \"disabled\"> {\n iconEnd?: ReactNode\n iconOnly?: boolean\n iconStart?: ReactNode\n isActive?: boolean\n isDisabled?: boolean\n isFullWidth?: boolean\n isLoading?: boolean\n isRounded?: boolean\n size?: 32 | 36 | 40 | 44\n variant?: \"accent\" | \"ghost\" | \"primary\" | \"secondary\"\n}\n\ntype ButtonPropsInternal = ButtonPropsWithIcon | ButtonPropsWithText\n\ninterface ButtonPropsWithIcon extends ButtonProps {\n children?: ReactNode\n iconEnd?: never\n iconOnly: true\n iconStart?: never\n}\n\ninterface ButtonPropsWithText extends ButtonProps {\n children?: string\n iconOnly?: false\n}\n\nexport function Button(props: ButtonPropsInternal): JSX.Element {\n const {\n children = \"\",\n className: customClassName = \"\",\n iconEnd = \"\",\n iconOnly = false,\n iconStart = \"\",\n isActive = false,\n isDisabled = false,\n isFullWidth = false,\n isLoading = false,\n isRounded = false,\n size = 36,\n type = \"button\",\n variant = \"primary\",\n ...rest\n } = props\n\n const combinedClassName = `\n ${BUTTON_CLASS_NAME.BASE}\n ${BUTTON_CLASS_NAME.SIZE[size]}\n ${BUTTON_CLASS_NAME.VARIANT[variant.toUpperCase() as keyof typeof BUTTON_CLASS_NAME.VARIANT]}\n ${isFullWidth ? BUTTON_CLASS_NAME.WIDTH.FULL : BUTTON_CLASS_NAME.WIDTH.BASE}\n ${iconOnly ? BUTTON_CLASS_NAME.ICON_ONLY : \"\"}\n ${isRounded ? BUTTON_CLASS_NAME.ROUNDED.FULL : BUTTON_CLASS_NAME.ROUNDED.BASE}\n ${customClassName}\n `\n .replaceAll(/\\s+/g, \" \")\n .trim()\n\n return (\n <button\n aria-pressed={isActive}\n className={combinedClassName}\n disabled={isDisabled || isLoading}\n type={type}\n {...rest}\n >\n <ButtonBackground isRounded={isRounded} variant={variant} />\n {isLoading && <ButtonSpinner />}\n {!isLoading && iconStart}\n {iconOnly ? children : <span>{children}</span>}\n {!isLoading && iconEnd}\n </button>\n )\n}\n\nexport const BUTTON_CLASS_NAME = {\n BASE: styles.button,\n ICON_ONLY: styles.button__icon_only,\n ROUNDED: {\n BASE: styles.button__rounded_base,\n FULL: styles.button__rounded_full,\n },\n SIZE: {\n 32: styles.button__size_32,\n 36: styles.button__size_36,\n 40: styles.button__size_40,\n 44: styles.button__size_44,\n },\n VARIANT: {\n ACCENT: styles.button__variant_accent,\n GHOST: styles.button__variant_ghost,\n PRIMARY: styles.button__variant_primary,\n SECONDARY: styles.button__variant_secondary,\n },\n WIDTH: {\n BASE: styles.button__width_base,\n FULL: styles.button__width_full,\n },\n} as const\n","import type { ComponentProps, JSX } from \"react\"\nimport styles from \"@/input.module.css\"\n\nexport interface InputProps\n extends Omit<\n ComponentProps<\"input\">,\n \"aria-pressed\" | \"disabled\" | \"readOnly\" | \"required\"\n > {\n isActive?: boolean\n isDisabled?: boolean\n isReadOnly?: boolean\n isRequired?: boolean\n}\n\nexport function Input(props: InputProps): JSX.Element {\n const {\n className: customClassName = \"\",\n isActive = false,\n isDisabled = false,\n isReadOnly = false,\n isRequired = false,\n type = \"text\",\n ...rest\n } = props\n\n const isPassword = type === \"password\"\n\n const combinedClassName = `\n ${INPUT_CLASS_NAME.BASE}\n ${isPassword ? INPUT_CLASS_NAME.PASSWORD : \"\"}\n ${customClassName}\n `\n .replaceAll(/\\s+/g, \" \")\n .trim()\n\n return (\n <input\n aria-pressed={isActive}\n className={combinedClassName}\n disabled={isDisabled}\n readOnly={isReadOnly}\n required={isRequired}\n type={type}\n {...rest}\n />\n )\n}\n\nexport const INPUT_CLASS_NAME = {\n BASE: styles.input,\n PASSWORD: styles.input__password,\n} as const\n","import type { ComponentProps, JSX } from \"react\"\nimport styles from \"@/label.module.css\"\n\nexport interface LabelProps extends ComponentProps<\"label\"> {}\n\nexport function Label(props: LabelProps): JSX.Element {\n const { className: customClassName = \"\", ...rest } = props\n\n const combinedClassName = `\n ${LABEL_CLASS_NAME.BASE}\n ${customClassName}\n `\n .replaceAll(/\\s+/g, \" \")\n .trim()\n\n return <label className={combinedClassName} {...rest} />\n}\n\nexport const LABEL_CLASS_NAME = {\n BASE: styles.label,\n} as const\n"]}
1
+ {"version":3,"sources":["../src/button-background.tsx","../src/button-spinner.tsx","../src/button.tsx","../src/input.tsx","../src/label.tsx"],"names":["jsx","styles"],"mappings":"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","file":"index.mjs","sourcesContent":["import type { JSX } from \"react\"\nimport type { ButtonProps } from \"@/button\"\nimport styles from \"@/button-background.module.css\"\n\nexport interface ButtonBackgroundProps\n extends Pick<ButtonProps, \"isRounded\" | \"variant\"> {}\n\nexport function ButtonBackground(props: ButtonBackgroundProps): JSX.Element {\n const { isRounded = false, variant = \"primary\" } = props\n\n const combinedBackgroundStyles = `\n ${BUTTON_BACKGROUND_CLASS_NAME.BASE}\n ${isRounded ? BUTTON_BACKGROUND_CLASS_NAME.ROUNDED.FULL : BUTTON_BACKGROUND_CLASS_NAME.ROUNDED.BASE}\n ${variant === \"accent\" ? BUTTON_BACKGROUND_CLASS_NAME.VARIANT.ACCENT : \"\"}\n ${variant === \"primary\" ? BUTTON_BACKGROUND_CLASS_NAME.VARIANT.PRIMARY : \"\"}\n `\n .replaceAll(/\\s+/g, \" \")\n .trim()\n\n if (!(variant === \"accent\" || variant === \"primary\")) return <></>\n\n return (\n <div\n className={combinedBackgroundStyles}\n data-element=\"button-background\"\n />\n )\n}\n\nexport const BUTTON_BACKGROUND_CLASS_NAME = {\n BASE: styles.button_background,\n ROUNDED: {\n BASE: styles.button_background__rounded_base,\n FULL: styles.button_background__rounded_full,\n },\n VARIANT: {\n ACCENT: styles.button_background__variant_accent,\n PRIMARY: styles.button_background__variant_primary,\n },\n} as const\n","import type { CSSProperties, JSX } from \"react\"\nimport styles from \"@/button-spinner.module.css\"\n\nexport interface ButtonSpinnerProps {\n size?: number\n}\n\nexport function ButtonSpinner(props: ButtonSpinnerProps): JSX.Element {\n const { size = 16 } = props\n\n return (\n <div\n className={styles.button_spinner}\n style={{ \"--size\": `${size}px` } as CSSProperties}\n >\n {Array.from({ length: 12 }).map((_, index) => (\n <div key={index} />\n ))}\n </div>\n )\n}\n","import type { ComponentProps, JSX, ReactNode } from \"react\"\nimport styles from \"@/button.module.css\"\nimport { ButtonBackground } from \"@/button-background\"\nimport { ButtonSpinner } from \"@/button-spinner\"\n\nexport interface ButtonProps\n extends Omit<ComponentProps<\"button\">, \"aria-pressed\" | \"disabled\"> {\n iconEnd?: ReactNode\n iconOnly?: boolean\n iconStart?: ReactNode\n isActive?: boolean\n isDisabled?: boolean\n isFullWidth?: boolean\n isLoading?: boolean\n isRounded?: boolean\n size?: 32 | 36 | 40 | 44\n variant?: \"accent\" | \"ghost\" | \"primary\" | \"secondary\"\n}\n\ntype ButtonPropsInternal = ButtonPropsWithIcon | ButtonPropsWithText\n\ninterface ButtonPropsWithIcon extends ButtonProps {\n children?: ReactNode\n iconEnd?: never\n iconOnly: true\n iconStart?: never\n}\n\ninterface ButtonPropsWithText extends ButtonProps {\n children?: string\n iconOnly?: false\n}\n\nexport function Button(props: ButtonPropsInternal): JSX.Element {\n const {\n children = \"\",\n className: customClassName = \"\",\n iconEnd = \"\",\n iconOnly = false,\n iconStart = \"\",\n isActive = false,\n isDisabled = false,\n isFullWidth = false,\n isLoading = false,\n isRounded = false,\n size = 36,\n type = \"button\",\n variant = \"primary\",\n ...rest\n } = props\n\n const combinedClassName = `\n ${BUTTON_CLASS_NAME.BASE}\n ${BUTTON_CLASS_NAME.SIZE[size]}\n ${BUTTON_CLASS_NAME.VARIANT[variant.toUpperCase() as keyof typeof BUTTON_CLASS_NAME.VARIANT]}\n ${isFullWidth ? BUTTON_CLASS_NAME.WIDTH.FULL : BUTTON_CLASS_NAME.WIDTH.BASE}\n ${iconOnly ? BUTTON_CLASS_NAME.ICON_ONLY : \"\"}\n ${isRounded ? BUTTON_CLASS_NAME.ROUNDED.FULL : BUTTON_CLASS_NAME.ROUNDED.BASE}\n ${customClassName}\n `\n .replaceAll(/\\s+/g, \" \")\n .trim()\n\n return (\n <button\n aria-pressed={isActive}\n className={combinedClassName}\n disabled={isDisabled || isLoading}\n type={type}\n {...rest}\n >\n <ButtonBackground isRounded={isRounded} variant={variant} />\n {isLoading && <ButtonSpinner />}\n {!isLoading && iconStart}\n {iconOnly ? children : <span>{children}</span>}\n {!isLoading && iconEnd}\n </button>\n )\n}\n\nexport const BUTTON_CLASS_NAME = {\n BASE: styles.button,\n ICON_ONLY: styles.button__icon_only,\n ROUNDED: {\n BASE: styles.button__rounded_base,\n FULL: styles.button__rounded_full,\n },\n SIZE: {\n 32: styles.button__size_32,\n 36: styles.button__size_36,\n 40: styles.button__size_40,\n 44: styles.button__size_44,\n },\n VARIANT: {\n ACCENT: styles.button__variant_accent,\n GHOST: styles.button__variant_ghost,\n PRIMARY: styles.button__variant_primary,\n SECONDARY: styles.button__variant_secondary,\n },\n WIDTH: {\n BASE: styles.button__width_base,\n FULL: styles.button__width_full,\n },\n} as const\n","import type { ComponentProps, JSX } from \"react\"\nimport styles from \"@/input.module.css\"\n\nexport interface InputProps\n extends Omit<\n ComponentProps<\"input\">,\n \"aria-pressed\" | \"disabled\" | \"readOnly\" | \"required\"\n > {\n isActive?: boolean\n isDisabled?: boolean\n isReadOnly?: boolean\n isRequired?: boolean\n}\n\nexport function Input(props: InputProps): JSX.Element {\n const {\n className: customClassName = \"\",\n isActive = false,\n isDisabled = false,\n isReadOnly = false,\n isRequired = false,\n type = \"text\",\n ...rest\n } = props\n\n const isPassword = type === \"password\"\n\n const combinedClassName = `\n ${INPUT_CLASS_NAME.BASE}\n ${isPassword ? INPUT_CLASS_NAME.PASSWORD : \"\"}\n ${customClassName}\n `\n .replaceAll(/\\s+/g, \" \")\n .trim()\n\n return (\n <input\n aria-pressed={isActive}\n className={combinedClassName}\n disabled={isDisabled}\n readOnly={isReadOnly}\n required={isRequired}\n type={type}\n {...rest}\n />\n )\n}\n\nexport const INPUT_CLASS_NAME = {\n BASE: styles.input,\n PASSWORD: styles.input__password,\n} as const\n","import type { ComponentProps, JSX } from \"react\"\nimport styles from \"@/label.module.css\"\n\nexport interface LabelProps extends ComponentProps<\"label\"> {}\n\nexport function Label(props: LabelProps): JSX.Element {\n const { className: customClassName = \"\", ...rest } = props\n\n const combinedClassName = `\n ${LABEL_CLASS_NAME.BASE}\n ${customClassName}\n `\n .replaceAll(/\\s+/g, \" \")\n .trim()\n\n return <label className={combinedClassName} {...rest} />\n}\n\nexport const LABEL_CLASS_NAME = {\n BASE: styles.label,\n} as const\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nattui/react-components",
3
- "version": "0.0.12",
3
+ "version": "0.0.13",
4
4
  "description": "A collection of reusable React components built with TypeScript and CSS Modules",
5
5
  "keywords": [
6
6
  "components",
@@ -20,41 +20,28 @@
20
20
  "exports": {
21
21
  ".": {
22
22
  "types": "./dist/index.d.ts",
23
- "import": "./dist/index.mjs",
24
- "require": "./dist/index.js"
23
+ "import": "./dist/index.mjs"
25
24
  }
26
25
  },
27
- "main": "./dist/index.js",
26
+ "main": "./dist/index.mjs",
28
27
  "module": "./dist/index.mjs",
29
- "types": "./dist/index.d.ts",
28
+ "types": "./dist/index.d.mts",
29
+ "files": [
30
+ "dist"
31
+ ],
30
32
  "scripts": {
31
33
  "build": "tsup",
32
- "check": "pnpm check:format && pnpm check:lint",
33
- "check:fix": "pnpm check:format:fix && pnpm check:lint:fix",
34
- "check:format": "prettier --check .",
35
- "check:format:fix": "prettier --write .",
36
- "check:lint": "eslint .",
37
- "check:lint:fix": "eslint --fix .",
34
+ "check": "biome check",
35
+ "check:fix": "biome check --write",
38
36
  "dev": "tsup --watch",
39
37
  "prepublishOnly": "pnpm run build",
40
38
  "update": "pnpx npm-check-updates --upgrade"
41
39
  },
42
40
  "devDependencies": {
43
- "@eslint/js": "^9.36.0",
44
- "@types/react": "^19.1.15",
45
- "eslint": "^9.36.0",
46
- "eslint-plugin-perfectionist": "^4.15.0",
47
- "eslint-plugin-react": "^7.37.5",
48
- "eslint-plugin-unicorn": "^59.0.1",
49
- "eslint-plugin-unused-imports": "^4.2.0",
50
- "globals": "^16.4.0",
51
- "prettier": "catalog:",
52
- "prettier-plugin-css-order": "catalog:",
53
- "prettier-plugin-packagejson": "catalog:",
54
- "prettier-plugin-sort-json": "catalog:",
41
+ "@biomejs/biome": "catalog:",
42
+ "@types/react": "^19.2.0",
55
43
  "tsup": "^8.5.0",
56
- "typescript": "^5.9.2",
57
- "typescript-eslint": "^8.44.1"
44
+ "typescript": "^5.9.3"
58
45
  },
59
46
  "peerDependencies": {
60
47
  "react": "^18.0.0 || ^19.0.0",
package/.prettierignore DELETED
@@ -1 +0,0 @@
1
- dist
@@ -1,33 +0,0 @@
1
-
2
- 
3
- > @nattui/react-components@0.0.8 build /Users/snowshift/Documents/3-github/react-components/packages/ui
4
- > tsup
5
-
6
- CLI Building entry: src/index.ts
7
- CLI Using tsconfig: tsconfig.json
8
- CLI tsup v8.5.0
9
- CLI Using tsup config: /Users/snowshift/Documents/3-github/react-components/packages/ui/tsup.config.ts
10
- CLI Target: node16
11
- CLI Cleaning output folder
12
- CJS Build start
13
- ESM Build start
14
- CJS dist/button-spinner.module-4TBETQ4T.module.css 1.49 KB
15
- CJS dist/button.module-4G5LYXJH.module.css 5.76 KB
16
- CJS dist/button-background.module-T5B7XZ2Z.module.css 702.00 B
17
- CJS dist/label.module-4CZ6ETIR.module.css 223.00 B
18
- CJS dist/input.module-5WZ7EF6O.module.css 1.32 KB
19
- CJS dist/index.js 5.72 KB
20
- CJS dist/index.js.map 10.72 KB
21
- CJS ⚡️ Build success in 64ms
22
- ESM dist/button-background.module-T5B7XZ2Z.module.css 702.00 B
23
- ESM dist/button-spinner.module-4TBETQ4T.module.css 1.49 KB
24
- ESM dist/button.module-4G5LYXJH.module.css 5.76 KB
25
- ESM dist/input.module-5WZ7EF6O.module.css 1.32 KB
26
- ESM dist/label.module-4CZ6ETIR.module.css 223.00 B
27
- ESM dist/index.mjs 4.71 KB
28
- ESM dist/index.mjs.map 10.67 KB
29
- ESM ⚡️ Build success in 65ms
30
- DTS Build start
31
- DTS ⚡️ Build success in 971ms
32
- DTS dist/index.d.ts 1.97 KB
33
- DTS dist/index.d.mts 1.97 KB