@novi-ui/raster 0.4.1 → 0.6.0
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/LICENSE +21 -0
- package/README.md +3 -0
- package/dist/accordion/accordion.styles.d.mts.map +1 -1
- package/dist/accordion/accordion.styles.mjs +12 -9
- package/dist/accordion/accordion.styles.mjs.map +1 -1
- package/dist/avatar/avatar.styles.d.mts +3 -3
- package/dist/badge/badge.styles.d.mts +3 -3
- package/dist/button/button.styles.d.mts +3 -3
- package/dist/button/button.styles.mjs +4 -4
- package/dist/button/button.styles.mjs.map +1 -1
- package/dist/card/card.styles.d.mts +3 -3
- package/dist/card/card.styles.d.mts.map +1 -1
- package/dist/card/card.styles.mjs +8 -3
- package/dist/card/card.styles.mjs.map +1 -1
- package/dist/checkbox/checkbox.styles.d.mts.map +1 -1
- package/dist/checkbox/checkbox.styles.mjs +5 -5
- package/dist/checkbox/checkbox.styles.mjs.map +1 -1
- package/dist/color-picker/color-picker.styles.d.mts.map +1 -1
- package/dist/color-picker/color-picker.styles.mjs +2 -2
- package/dist/color-picker/color-picker.styles.mjs.map +1 -1
- package/dist/input/input.styles.d.mts +3 -3
- package/dist/input/input.styles.d.mts.map +1 -1
- package/dist/input/input.styles.mjs +4 -4
- package/dist/input/input.styles.mjs.map +1 -1
- package/dist/menu/menu.styles.d.mts.map +1 -1
- package/dist/menu/menu.styles.mjs +4 -4
- package/dist/menu/menu.styles.mjs.map +1 -1
- package/dist/modal/modal.styles.d.mts +3 -3
- package/dist/modal/modal.styles.d.mts.map +1 -1
- package/dist/modal/modal.styles.mjs +15 -6
- package/dist/modal/modal.styles.mjs.map +1 -1
- package/dist/popover/popover.styles.d.mts +3 -3
- package/dist/popover/popover.styles.d.mts.map +1 -1
- package/dist/popover/popover.styles.mjs +2 -2
- package/dist/popover/popover.styles.mjs.map +1 -1
- package/dist/progress/progress.mjs +1 -1
- package/dist/progress/progress.mjs.map +1 -1
- package/dist/progress/progress.styles.d.mts.map +1 -1
- package/dist/progress/progress.styles.mjs +1 -1
- package/dist/progress/progress.styles.mjs.map +1 -1
- package/dist/radio/radio.styles.d.mts.map +1 -1
- package/dist/radio/radio.styles.mjs +5 -5
- package/dist/radio/radio.styles.mjs.map +1 -1
- package/dist/raster.css +16 -0
- package/dist/raster.scoped.css +16 -0
- package/dist/select/select.styles.d.mts +3 -3
- package/dist/select/select.styles.d.mts.map +1 -1
- package/dist/select/select.styles.mjs +6 -6
- package/dist/select/select.styles.mjs.map +1 -1
- package/dist/skeleton/skeleton.styles.d.mts +3 -3
- package/dist/spinner/spinner.styles.mjs +1 -1
- package/dist/spinner/spinner.styles.mjs.map +1 -1
- package/dist/switch/switch.styles.d.mts.map +1 -1
- package/dist/switch/switch.styles.mjs +1 -1
- package/dist/switch/switch.styles.mjs.map +1 -1
- package/dist/tabs/tabs.styles.d.mts.map +1 -1
- package/dist/tabs/tabs.styles.mjs +5 -5
- package/dist/tabs/tabs.styles.mjs.map +1 -1
- package/dist/textarea/textarea.styles.d.mts +3 -3
- package/dist/textarea/textarea.styles.d.mts.map +1 -1
- package/dist/textarea/textarea.styles.mjs +3 -3
- package/dist/textarea/textarea.styles.mjs.map +1 -1
- package/dist/toast/toast.styles.d.mts +3 -3
- package/dist/toast/toast.styles.d.mts.map +1 -1
- package/dist/toast/toast.styles.mjs +3 -2
- package/dist/toast/toast.styles.mjs.map +1 -1
- package/package.json +5 -4
|
@@ -49,15 +49,15 @@ const textareaStyles = tv({
|
|
|
49
49
|
},
|
|
50
50
|
size: {
|
|
51
51
|
sm: {
|
|
52
|
-
inputWrapper: "px-
|
|
52
|
+
inputWrapper: "px-[var(--novi-pad-control-x-sm)] py-1.5",
|
|
53
53
|
textarea: "text-[length:var(--novi-text-sm)]"
|
|
54
54
|
},
|
|
55
55
|
md: {
|
|
56
|
-
inputWrapper: "px-
|
|
56
|
+
inputWrapper: "px-[var(--novi-pad-control-x-md)] py-2",
|
|
57
57
|
textarea: "text-[length:var(--novi-text-base)]"
|
|
58
58
|
},
|
|
59
59
|
lg: {
|
|
60
|
-
inputWrapper: "px-
|
|
60
|
+
inputWrapper: "px-[var(--novi-pad-control-x-lg)] py-2.5",
|
|
61
61
|
textarea: "text-[length:var(--novi-text-base)]"
|
|
62
62
|
}
|
|
63
63
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.styles.mjs","names":[],"sources":["../../src/textarea/textarea.styles.ts"],"sourcesContent":["import type {\n NoviRadius,\n NoviSize,\n NoviVariant,\n SlotMap,\n textareaRequiredSlots,\n textareaSlots,\n VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\nimport { disabledState, focusRing } from '../styles/focus-ring'\n\nconst slots = {\n root: 'flex flex-col gap-1.5',\n label: 'text-[length:var(--novi-text-sm)] font-medium text-[var(--novi-color-fg)]',\n inputWrapper: [\n 'text-[var(--novi-color-fg)]',\n 'flex w-full',\n 'bg-[var(--novi-color-bg)]',\n 'border border-[var(--novi-color-border-strong)]',\n 'transition-[border-color,opacity]',\n 'duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n 'data-[invalid]:border-[var(--novi-color-danger)]',\n focusRing,\n disabledState,\n ].join(' '),\n textarea: [\n 'w-full min-w-0 bg-transparent outline-none',\n 'text-[var(--novi-color-fg)]',\n 'placeholder:text-[var(--novi-color-muted)]',\n // 横に伸ばすとレイアウトが崩れるので縦のみ許可する\n 'resize-y',\n 'leading-[var(--novi-leading-body)]',\n ].join(' '),\n // 文字数カウンタもここに置く。専用 slot を増やさない\n description: 'text-[length:var(--novi-text-xs)] text-[var(--novi-color-muted)]',\n errorMessage: 'text-[length:var(--novi-text-xs)] text-[var(--novi-color-danger)]',\n} satisfies SlotMap<typeof textareaSlots, (typeof textareaRequiredSlots)[number]>\n\nconst variant: VariantMap<NoviVariant, { inputWrapper: string }> = {\n solid: {\n inputWrapper: 'bg-[var(--novi-color-subtle)] border-[var(--novi-color-border-strong)]',\n },\n outline: { inputWrapper: 'bg-[var(--novi-color-bg)] border-[var(--novi-color-border-strong)]' },\n soft: { inputWrapper: 'bg-[var(--novi-color-subtle)] border-transparent' },\n ghost: {\n inputWrapper: 'bg-transparent border-transparent border-b-[var(--novi-color-border-strong)]',\n },\n plain: { inputWrapper: 'bg-transparent border-transparent' },\n}\n\n
|
|
1
|
+
{"version":3,"file":"textarea.styles.mjs","names":[],"sources":["../../src/textarea/textarea.styles.ts"],"sourcesContent":["import type {\n NoviRadius,\n NoviSize,\n NoviVariant,\n SlotMap,\n textareaRequiredSlots,\n textareaSlots,\n VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\nimport { disabledState, focusRing } from '../styles/focus-ring'\n\nconst slots = {\n root: 'flex flex-col gap-1.5',\n label: 'text-[length:var(--novi-text-sm)] font-medium text-[var(--novi-color-fg)]',\n inputWrapper: [\n 'text-[var(--novi-color-fg)]',\n 'flex w-full',\n 'bg-[var(--novi-color-bg)]',\n 'border border-[var(--novi-color-border-strong)]',\n 'transition-[border-color,opacity]',\n 'duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n 'data-[invalid]:border-[var(--novi-color-danger)]',\n focusRing,\n disabledState,\n ].join(' '),\n textarea: [\n 'w-full min-w-0 bg-transparent outline-none',\n 'text-[var(--novi-color-fg)]',\n 'placeholder:text-[var(--novi-color-muted)]',\n // 横に伸ばすとレイアウトが崩れるので縦のみ許可する\n 'resize-y',\n 'leading-[var(--novi-leading-body)]',\n ].join(' '),\n // 文字数カウンタもここに置く。専用 slot を増やさない\n description: 'text-[length:var(--novi-text-xs)] text-[var(--novi-color-muted)]',\n errorMessage: 'text-[length:var(--novi-text-xs)] text-[var(--novi-color-danger)]',\n} satisfies SlotMap<typeof textareaSlots, (typeof textareaRequiredSlots)[number]>\n\nconst variant: VariantMap<NoviVariant, { inputWrapper: string }> = {\n solid: {\n inputWrapper: 'bg-[var(--novi-color-subtle)] border-[var(--novi-color-border-strong)]',\n },\n outline: { inputWrapper: 'bg-[var(--novi-color-bg)] border-[var(--novi-color-border-strong)]' },\n soft: { inputWrapper: 'bg-[var(--novi-color-subtle)] border-transparent' },\n ghost: {\n inputWrapper: 'bg-transparent border-transparent border-b-[var(--novi-color-border-strong)]',\n },\n plain: { inputWrapper: 'bg-transparent border-transparent' },\n}\n\n/**\n * 1行入力と違い高さは固定しない。左右は Input と同じトークン、\n * 縦だけは生値のまま残す — この値が Input の h-8 / h-10 / h-12 に対応する\n * 実効の高さを作っており、面の縦余白（16px）を当てると1行入力との連続性が壊れる。\n */\nconst size: VariantMap<NoviSize, { inputWrapper: string; textarea: string }> = {\n sm: {\n inputWrapper: 'px-[var(--novi-pad-control-x-sm)] py-1.5',\n textarea: 'text-[length:var(--novi-text-sm)]',\n },\n md: {\n inputWrapper: 'px-[var(--novi-pad-control-x-md)] py-2',\n textarea: 'text-[length:var(--novi-text-base)]',\n },\n lg: {\n inputWrapper: 'px-[var(--novi-pad-control-x-lg)] py-2.5',\n textarea: 'text-[length:var(--novi-text-base)]',\n },\n}\n\nconst radius: VariantMap<NoviRadius, { inputWrapper: string }> = {\n none: { inputWrapper: 'rounded-[var(--novi-radius-none)]' },\n sm: { inputWrapper: 'rounded-[var(--novi-radius-sm)]' },\n md: { inputWrapper: 'rounded-[var(--novi-radius-md)]' },\n lg: { inputWrapper: 'rounded-[var(--novi-radius-lg)]' },\n full: { inputWrapper: 'rounded-[var(--novi-radius-full)]' },\n}\n\n/**\n * TextArea のスタイル定義。\n *\n * @example\n * import { textareaStyles } from '@novi-ui/raster'\n * import { tv } from 'tailwind-variants'\n *\n * const myTextarea = tv({\n * extend: textareaStyles,\n * slots: { textarea: 'font-mono' },\n * })\n */\nexport const textareaStyles = tv({\n slots,\n variants: { variant, size, radius },\n defaultVariants: { variant: 'outline', size: 'md', radius: 'md' },\n})\n\nexport type TextareaStyleProps = Parameters<typeof textareaStyles>[0]\n"],"mappings":";;;AAYA,MAAM,QAAQ;CACZ,MAAM;CACN,OAAO;CACP,cAAc;EACZ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CACV,UAAU;EACR;EACA;EACA;EAEA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CAEV,aAAa;CACb,cAAc;AAChB;;;;;;;;;;;;;AAsDA,MAAa,iBAAiB,GAAG;CAC/B;CACA,UAAU;EAAE;GArDZ,OAAO,EACL,cAAc,yEAChB;GACA,SAAS,EAAE,cAAc,qEAAqE;GAC9F,MAAM,EAAE,cAAc,mDAAmD;GACzE,OAAO,EACL,cAAc,+EAChB;GACA,OAAO,EAAE,cAAc,oCAAoC;EA6C/C;EAAS;GApCrB,IAAI;IACF,cAAc;IACd,UAAU;GACZ;GACA,IAAI;IACF,cAAc;IACd,UAAU;GACZ;GACA,IAAI;IACF,cAAc;IACd,UAAU;GACZ;EAyBqB;EAAM;GArB3B,MAAM,EAAE,cAAc,oCAAoC;GAC1D,IAAI,EAAE,cAAc,kCAAkC;GACtD,IAAI,EAAE,cAAc,kCAAkC;GACtD,IAAI,EAAE,cAAc,kCAAkC;GACtD,MAAM,EAAE,cAAc,oCAAoC;EAiB/B;CAAO;CAClC,iBAAiB;EAAE,SAAS;EAAW,MAAM;EAAM,QAAQ;CAAK;AAClE,CAAC"}
|
|
@@ -10,7 +10,7 @@ declare const toastStyles: import("tailwind-variants").TVReturnType<{
|
|
|
10
10
|
color: VariantMap<"default" | "primary" | "secondary" | "success" | "warning" | "danger", {
|
|
11
11
|
root: string;
|
|
12
12
|
}>;
|
|
13
|
-
radius: VariantMap<"
|
|
13
|
+
radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
|
|
14
14
|
root: string;
|
|
15
15
|
}>;
|
|
16
16
|
}, {
|
|
@@ -26,7 +26,7 @@ declare const toastStyles: import("tailwind-variants").TVReturnType<{
|
|
|
26
26
|
color: VariantMap<"default" | "primary" | "secondary" | "success" | "warning" | "danger", {
|
|
27
27
|
root: string;
|
|
28
28
|
}>;
|
|
29
|
-
radius: VariantMap<"
|
|
29
|
+
radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
|
|
30
30
|
root: string;
|
|
31
31
|
}>;
|
|
32
32
|
}, {
|
|
@@ -42,7 +42,7 @@ declare const toastStyles: import("tailwind-variants").TVReturnType<{
|
|
|
42
42
|
color: VariantMap<"default" | "primary" | "secondary" | "success" | "warning" | "danger", {
|
|
43
43
|
root: string;
|
|
44
44
|
}>;
|
|
45
|
-
radius: VariantMap<"
|
|
45
|
+
radius: VariantMap<"sm" | "md" | "lg" | "none" | "full", {
|
|
46
46
|
root: string;
|
|
47
47
|
}>;
|
|
48
48
|
}, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.styles.d.mts","names":[],"sources":["../../src/toast/toast.styles.ts"],"mappings":";;;;;;;;
|
|
1
|
+
{"version":3,"file":"toast.styles.d.mts","names":[],"sources":["../../src/toast/toast.styles.ts"],"mappings":";;;;;;;;cA6Da,yCAAW;;IAvBmB;;;IASE;;;;;;;;;;;;;IATF;;;IASE;;;;;;;;;;;;;IATF;;;IASE;;;;;;;;;;;;KAoBjC,kBAAkB,kBAAkB"}
|
|
@@ -2,10 +2,11 @@ import { focusRing } from "../styles/focus-ring.mjs";
|
|
|
2
2
|
import { tv } from "tailwind-variants";
|
|
3
3
|
//#region src/toast/toast.styles.ts
|
|
4
4
|
const slots = {
|
|
5
|
-
region: "fixed bottom-4 right-4 z-50 flex flex-col gap-
|
|
5
|
+
region: "fixed bottom-4 right-4 z-50 flex flex-col gap-[var(--novi-gap-stack)] outline-none max-w-sm",
|
|
6
6
|
root: [
|
|
7
7
|
"text-[var(--novi-color-fg)]",
|
|
8
|
-
"flex items-start gap-
|
|
8
|
+
"flex items-start gap-[var(--novi-gap-inline)] outline-none",
|
|
9
|
+
"px-[var(--novi-pad-surface-x)] py-[var(--novi-pad-surface-y)]",
|
|
9
10
|
"bg-[var(--novi-color-bg)]",
|
|
10
11
|
"border border-[var(--novi-color-border-strong)]",
|
|
11
12
|
"shadow-[var(--novi-shadow-lg)]",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.styles.mjs","names":[],"sources":["../../src/toast/toast.styles.ts"],"sourcesContent":["import type {\n NoviColor,\n NoviRadius,\n SlotMap,\n toastRequiredSlots,\n toastSlots,\n VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\nimport { focusRing } from '../styles/focus-ring'\n\nconst slots = {\n // 右下に固定する。操作の起点から遠く、視線移動が最小になる位置\n region
|
|
1
|
+
{"version":3,"file":"toast.styles.mjs","names":[],"sources":["../../src/toast/toast.styles.ts"],"sourcesContent":["import type {\n NoviColor,\n NoviRadius,\n SlotMap,\n toastRequiredSlots,\n toastSlots,\n VariantMap,\n} from '@novi-ui/core'\nimport { tv } from 'tailwind-variants'\nimport { focusRing } from '../styles/focus-ring'\n\nconst slots = {\n // 右下に固定する。操作の起点から遠く、視線移動が最小になる位置\n region:\n 'fixed bottom-4 right-4 z-50 flex flex-col gap-[var(--novi-gap-stack)] outline-none max-w-sm',\n root: [\n 'text-[var(--novi-color-fg)]',\n 'flex items-start gap-[var(--novi-gap-inline)] outline-none',\n 'px-[var(--novi-pad-surface-x)] py-[var(--novi-pad-surface-y)]',\n 'bg-[var(--novi-color-bg)]',\n 'border border-[var(--novi-color-border-strong)]',\n 'shadow-[var(--novi-shadow-lg)]',\n 'data-[entering]:motion-safe:animate-[novi-fade-in_120ms_ease-out]',\n ].join(' '),\n icon: 'shrink-0 mt-0.5 text-[var(--c)]',\n content: 'flex-1 min-w-0 flex flex-col gap-0.5',\n title: 'font-medium text-[var(--novi-color-fg)]',\n description:\n 'text-[length:var(--novi-text-sm)] text-[var(--novi-color-muted)] leading-[var(--novi-leading-body)]',\n closeButton: [\n 'shrink-0 grid place-items-center size-6 -mr-1',\n 'text-[var(--novi-color-muted)] hover:text-[var(--novi-color-fg)]',\n 'transition-colors duration-[var(--novi-duration-fast)] ease-[var(--novi-ease-standard)]',\n focusRing,\n ].join(' '),\n action: 'shrink-0',\n} satisfies SlotMap<typeof toastSlots, (typeof toastRequiredSlots)[number]>\n\nconst color: VariantMap<NoviColor, { root: string }> = {\n default: { root: '[--c:var(--novi-color-fg)]' },\n primary: { root: '[--c:var(--novi-color-primary)]' },\n secondary: { root: '[--c:var(--novi-color-secondary)]' },\n success: { root: '[--c:var(--novi-color-success)] border-l-[var(--novi-color-success)]' },\n warning: { root: '[--c:var(--novi-color-warning)] border-l-[var(--novi-color-warning)]' },\n danger: { root: '[--c:var(--novi-color-danger)] border-l-[var(--novi-color-danger)]' },\n}\n\nconst radius: VariantMap<NoviRadius, { root: string }> = {\n none: { root: 'rounded-[var(--novi-radius-none)]' },\n sm: { root: 'rounded-[var(--novi-radius-sm)]' },\n md: { root: 'rounded-[var(--novi-radius-md)]' },\n lg: { root: 'rounded-[var(--novi-radius-lg)]' },\n full: { root: 'rounded-[var(--novi-radius-full)]' },\n}\n\n/**\n * Toast のスタイル定義。\n *\n * @example\n * const myToast = tv({ extend: toastStyles, slots: { region: 'bottom-8' } })\n */\nexport const toastStyles = tv({\n slots,\n variants: { color, radius },\n defaultVariants: { color: 'default', radius: 'lg' },\n})\n\nexport type ToastStyleProps = Parameters<typeof toastStyles>[0]\n"],"mappings":";;;AAWA,MAAM,QAAQ;CAEZ,QACE;CACF,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CACV,MAAM;CACN,SAAS;CACT,OAAO;CACP,aACE;CACF,aAAa;EACX;EACA;EACA;EACA;CACF,CAAC,CAAC,KAAK,GAAG;CACV,QAAQ;AACV;;;;;;;AAyBA,MAAa,cAAc,GAAG;CAC5B;CACA,UAAU;EAAE;GAxBZ,SAAS,EAAE,MAAM,6BAA6B;GAC9C,SAAS,EAAE,MAAM,kCAAkC;GACnD,WAAW,EAAE,MAAM,oCAAoC;GACvD,SAAS,EAAE,MAAM,uEAAuE;GACxF,SAAS,EAAE,MAAM,uEAAuE;GACxF,QAAQ,EAAE,MAAM,qEAAqE;EAmBzE;EAAO;GAfnB,MAAM,EAAE,MAAM,oCAAoC;GAClD,IAAI,EAAE,MAAM,kCAAkC;GAC9C,IAAI,EAAE,MAAM,kCAAkC;GAC9C,IAAI,EAAE,MAAM,kCAAkC;GAC9C,MAAM,EAAE,MAAM,oCAAoC;EAW/B;CAAO;CAC1B,iBAAiB;EAAE,OAAO;EAAW,QAAQ;CAAK;AACpD,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@novi-ui/raster",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.0",
|
|
4
4
|
"description": "Novi UI theme 1 — minimal / Swiss. Sharp corners, no shadows, hairline rules, restrained motion.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -28,11 +28,12 @@
|
|
|
28
28
|
},
|
|
29
29
|
"peerDependencies": {
|
|
30
30
|
"react": "^19.0.0",
|
|
31
|
-
"react-aria-components": "^1.20.0"
|
|
31
|
+
"react-aria-components": "^1.20.0",
|
|
32
|
+
"tailwindcss": "^4.0.0"
|
|
32
33
|
},
|
|
33
34
|
"dependencies": {
|
|
34
|
-
"
|
|
35
|
-
"
|
|
35
|
+
"@novi-ui/core": "0.4.1",
|
|
36
|
+
"tailwind-variants": "^3.3.1"
|
|
36
37
|
},
|
|
37
38
|
"devDependencies": {
|
|
38
39
|
"@size-limit/preset-small-lib": "^13.0.3",
|