@nice2dev/ui-graphics 1.1.10 → 1.2.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/CHANGELOG.md +70 -0
- package/README.md +60 -63
- package/dist/cjs/animation/AnimationEditor.js +0 -3
- package/dist/cjs/animation/BodyRenderer.js +1 -4
- package/dist/cjs/animation/shapes/heads.js +0 -3
- package/dist/cjs/core/NiceBrushEngine.js +1 -3
- package/dist/cjs/font/NiceFontEditor.js +3 -3
- package/dist/cjs/game/GameAsset2dEditor.js +0 -3
- package/dist/cjs/index.js +0 -11
- package/dist/cjs/nice2dev-ui-graphics.css +1 -1
- package/dist/cjs/photo/NiceAITools.js +2 -2
- package/dist/cjs/photo/PhotoEditorToolbar.js +1 -1
- package/dist/cjs/pixel/PixelEditor.js +0 -3
- package/dist/cjs/pixel/PixelEditor.module.css.js +1 -1
- package/dist/cjs/pixel/SpriteGeneratorPanel.js +3 -3
- package/dist/cjs/texture/Nice3DTexturePainter.js +2 -2
- package/dist/cjs/ui/NiceUIDesigner.js +1 -1
- package/dist/cjs/vector/VectorEditor.js +0 -3
- package/dist/esm/animation/AnimationEditor.js +1 -3
- package/dist/esm/animation/BodyRenderer.js +3 -5
- package/dist/esm/animation/shapes/heads.js +1 -3
- package/dist/esm/core/NiceBrushEngine.js +1 -3
- package/dist/esm/font/NiceFontEditor.js +3 -3
- package/dist/esm/game/GameAsset2dEditor.js +1 -3
- package/dist/esm/index.js +10 -10
- package/dist/esm/nice2dev-ui-graphics.css +1 -1
- package/dist/esm/photo/NiceAITools.js +2 -2
- package/dist/esm/photo/PhotoEditorToolbar.js +1 -1
- package/dist/esm/pixel/PixelEditor.js +1 -3
- package/dist/esm/pixel/PixelEditor.module.css.js +1 -1
- package/dist/esm/pixel/SpriteGeneratorPanel.js +3 -3
- package/dist/esm/texture/Nice3DTexturePainter.js +2 -2
- package/dist/esm/ui/NiceUIDesigner.js +1 -1
- package/dist/esm/vector/VectorEditor.js +1 -3
- package/dist/types/animation/AnimatedPerson.d.ts +0 -4
- package/dist/types/animation/AnimationEditor.d.ts +1 -5
- package/dist/types/animation/Audience.d.ts +0 -4
- package/dist/types/animation/BodyRenderer.d.ts +0 -4
- package/dist/types/animation/rig/RigPlayer.d.ts +0 -7
- package/dist/types/animation/rig/RiggedBody.d.ts +0 -4
- package/dist/types/animation/shapes/heads.d.ts +0 -4
- package/dist/types/game/GameAsset2dEditor.d.ts +0 -4
- package/dist/types/game/index.d.ts +1 -1
- package/dist/types/index.d.ts +9 -19
- package/dist/types/photo/index.d.ts +0 -2
- package/dist/types/pixel/PixelEditor.d.ts +0 -4
- package/dist/types/pixel/SpriteGeneratorPanel.d.ts +0 -4
- package/dist/types/vector/VectorEditor.d.ts +0 -4
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,75 @@
|
|
|
1
1
|
# @nice2dev/ui-graphics — Changelog
|
|
2
2
|
|
|
3
|
+
## 1.2.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 3a4939d: 1.2.0 — the API cleanup announced for this version, dictionaries per language by default, and
|
|
8
|
+
three new controls. **Breaking:** every removal has a replacement, listed name by name in
|
|
9
|
+
`documentation/omniverk/OMNIVERK_UPGRADE_1.2.0.md`.
|
|
10
|
+
|
|
11
|
+
**Removed (breaking).** All 118 `@deprecated` names: the aliases without the `Nice` prefix in
|
|
12
|
+
`ui-audio`, `ui-graphics` and `ui-3d`; `NiceBarcodeGenerator` (→ `NiceBarcode`), `NiceFloorPlanCanvas`
|
|
13
|
+
(→ `NiceSpatialEditor` in `@nice2dev/ui-buildings`), the v2 props and types of `NiceTopNav`,
|
|
14
|
+
`NiceProgress.showLabel`, `NiceCountryPicker.showDialCode` / `showFlag`, `type` on
|
|
15
|
+
`NiceDateTimePicker` / `NiceDateRangeBox` (→ `dateFormatPreset`); `ZoneOccupancy` in
|
|
16
|
+
`ui-buildings` and `events`, the `SmartHome*` types; the icon variant `flat` (→ `cutout`) and
|
|
17
|
+
`NiceIconEditor` (→ `NiceVectorEditor`); `NiceSizeLegacy`; the `snapGrid` module of `ui-diagrams` (→
|
|
18
|
+
`@nice2dev/spatial-core`); the opt-in stylesheet `@nice2dev/ui/css/legacy-bg-text-aliases.css`, which
|
|
19
|
+
formed an alias cycle with `style.css`. Props that were accepted and never read — 19 on
|
|
20
|
+
`NiceModuleGrid`, and more on `NiceAutocomplete`, `NiceTaskInbox`, `NiceConsentBanner`, the
|
|
21
|
+
building and communication controls, four `ui-audio` panels and `NiceStreamDashboard` — are gone
|
|
22
|
+
from the types. `NiceResourceAllocation` in `ui-erp` is `NiceCapacityPlanner` (the one in `ui`
|
|
23
|
+
keeps its name); `NiceGenericPlayerStageVisualizer` (→ `NiceStageVisualizer`) and
|
|
24
|
+
`NiceCubeBrowserProps` are removed. The `@nice2dev/ui/overlays` entry calls its modal, drawer,
|
|
25
|
+
bottom sheet and context menu `NiceOverlayModal`, `NiceOverlayDrawer`, `NiceOverlayBottomSheet` and
|
|
26
|
+
`NiceOverlayContextMenu`: the old names belonged to different components of `@nice2dev/ui`.
|
|
27
|
+
|
|
28
|
+
**Dictionaries per language.** `NiceI18nProvider` loads only the language in use, with `import()`
|
|
29
|
+
(it was `NiceI18nLazyProvider` in 1.1.10, which stays as the same component); the controls show their
|
|
30
|
+
built-in English until it arrives — `await loadNiceDictionary(lang)` before the first render to start
|
|
31
|
+
in the language. Nothing on the main entry of `@nice2dev/i18n` imports a dictionary any more:
|
|
32
|
+
`NICE_I18N_DICTIONARIES`, `createTranslator`, `NICE_I18N_VARIANTS` / `resolvePlVariant` and the
|
|
33
|
+
translation tooling moved to the new entry `@nice2dev/i18n/all`, and `@nice2dev/ui-core` no longer
|
|
34
|
+
re-exports the dictionary map. `@nice2dev/ui` with what it bundles: 1283 kB → 952 kB gzip loaded up
|
|
35
|
+
front. The `ui-audio` controls read the app's `NiceI18nProvider` now; their own provider overrides it.
|
|
36
|
+
|
|
37
|
+
**New controls.** `NiceRecurrenceEditor`, `NiceStopwatch`, `NiceCountdownTimer` (`@nice2dev/ui`) and
|
|
38
|
+
`NicePasswordGenerator` (`@nice2dev/auth`), plus `recurrenceDates()` and `generatePassword()`.
|
|
39
|
+
`NiceScheduler` honours a weekly rule's `byDay`, which it ignored.
|
|
40
|
+
|
|
41
|
+
**Visible changes.** The palette meets WCAG AA for text on every fill: darker fills in the light
|
|
42
|
+
theme, dark text on the fills of the dark theme (new `--nice-text-on-success` / `-error` / `-info` /
|
|
43
|
+
`-accent` / `-warning`; `NiceThemeText` takes `onSuccess`, `onError`, `onInfo`, `onWarning`). Mobile
|
|
44
|
+
and platform panels follow the app theme instead of `prefers-color-scheme`. Swipes in
|
|
45
|
+
`NiceSwipeActions`, `NiceTouchTable` and `NiceMobileCalendar` work with a mouse and a pen. The
|
|
46
|
+
`ui-forms` editors have the intended spacing (it was four times too large). `NiceMAM`,
|
|
47
|
+
`NiceTranscoder`, `NiceVideoAnnotator` and `NiceStreamDashboard` use `nice-`-prefixed BEM classes.
|
|
48
|
+
|
|
49
|
+
**Fixes.** Controls that invented results ask the host instead: `NiceIntegrationHub`,
|
|
50
|
+
`NiceMLStudio` (`onExperimentRun` may return metrics), `NiceRemoteManagement`
|
|
51
|
+
(`onCaptureScreenshot`), `NicePoseDetector` (`detector`), `NiceBatchScannerProvider`,
|
|
52
|
+
`NiceCacheStrategies`; `NiceLowCodeStudio` accepts dropped components. Controls that did nothing
|
|
53
|
+
work or say why they are off: `NiceStreamDashboard` adds sources, sends chat and runs the chosen
|
|
54
|
+
transition (new `onAddPlatform`, `onSendChatMessage`, `onTransition`, `onScreenshot`,
|
|
55
|
+
`onOpenAudioMixer`, `onOpenSettings`; `receiveChatMessage` feeds incoming chat), `NiceMLStudio`
|
|
56
|
+
downloads through `onModelDownload`, `NiceETLBuilder` saves through `onSave` (its Save button had
|
|
57
|
+
no handler), `NiceTranscoder` makes jobs of picked and dropped files, `NiceAutomationEditor` offers
|
|
58
|
+
the trigger types its model has. Texts of about fifty components go
|
|
59
|
+
through `t()` in six languages, among them the AI data grid, chart and form builders, the ML
|
|
60
|
+
studio, the report designer, the song picker, `NiceProtocolConfig`, `NiceETLBuilder` and
|
|
61
|
+
`NiceInlineHelp` — every key the controls pass to `t()` now has a dictionary entry, so none of
|
|
62
|
+
them stays English under another language; `NiceDataGridAI` sorts on a query in any language, not
|
|
63
|
+
only in English. `NiceWindow`, `NiceConsole`, `NiceFileManager` and `NiceGitManager` no longer
|
|
64
|
+
crash when `accessMode` switches to or from `'hidden'`. Ids come from `createId()` (`@nice2dev/ui-core`), so nothing throws
|
|
65
|
+
outside a secure context as `crypto.randomUUID()` did on plain http. `ui-3d` runs on three r183
|
|
66
|
+
without its deprecation warnings. `NiceRemoteManagement` calls the handlers of the latest render.
|
|
67
|
+
The AI hint popover and the `ui-platform` panels follow the app theme, not the system's or a
|
|
68
|
+
`.dark` class on the host. `NiceCommandPalette` has styles and its search filters;
|
|
69
|
+
`NiceTimeoutFeedback` starts its clock; `NiceOfflineBanner` takes `online`; Monaco's workers in
|
|
70
|
+
`NiceCodeEditor` load; the `ui-audio` panels that used Bootstrap classes use Nice controls; colours
|
|
71
|
+
that reached a canvas as `var(…)` (karaoke lanes and notes) are resolved first.
|
|
72
|
+
|
|
3
73
|
## 1.1.10
|
|
4
74
|
|
|
5
75
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -12,11 +12,11 @@
|
|
|
12
12
|
|
|
13
13
|
### Editors
|
|
14
14
|
|
|
15
|
-
- **
|
|
16
|
-
- **
|
|
17
|
-
- **
|
|
18
|
-
- **
|
|
19
|
-
- **
|
|
15
|
+
- **NicePixelEditor** — Aseprite-inspired pixel art with layers, frames, dithering, GIF / sprite-sheet export, .aseprite import, tile map mode
|
|
16
|
+
- **NiceVectorEditor** — SVG shapes, pen tool, boolean operations, gradients, pattern fills, text-on-path, PDF export
|
|
17
|
+
- **NicePhotoEditor** — 50+ filters, RAW support, smart selection (magic wand, lasso, magnetic), healing brush, content-aware fill, face detection, batch processing, AI style-transfer
|
|
18
|
+
- **NiceAnimationEditor** — 2D character builder with skeleton rigging, IK/FK, ragdoll/cloth physics, motion paths, Lottie & Spine export
|
|
19
|
+
- **NiceGameAsset2dEditor** — tile maps, sprite sheets, animation state machines, collision shapes, isometric 2.5D, multi-engine export (Tiled, Godot, Unity, Phaser, Construct)
|
|
20
20
|
- **NiceIconEditor** — SVG icon creation with variant system
|
|
21
21
|
- **NiceUIDesigner** — drag & drop UI builder generating React code
|
|
22
22
|
- **Nice3DTexturePainter** — paint textures on 3D models in-browser
|
|
@@ -61,11 +61,11 @@ npm install @nice2dev/ui-graphics framer-motion
|
|
|
61
61
|
## Quick Start
|
|
62
62
|
|
|
63
63
|
```tsx
|
|
64
|
-
import {
|
|
64
|
+
import { NicePixelEditor } from '@nice2dev/ui-graphics';
|
|
65
65
|
import '@nice2dev/ui-graphics/style.css';
|
|
66
66
|
|
|
67
67
|
function App() {
|
|
68
|
-
return <
|
|
68
|
+
return <NicePixelEditor initialWidth={64} initialHeight={64} />;
|
|
69
69
|
}
|
|
70
70
|
```
|
|
71
71
|
|
|
@@ -73,72 +73,65 @@ function App() {
|
|
|
73
73
|
|
|
74
74
|
## Editors
|
|
75
75
|
|
|
76
|
-
###
|
|
76
|
+
### NicePixelEditor
|
|
77
77
|
|
|
78
78
|
```tsx
|
|
79
|
-
import {
|
|
79
|
+
import { NicePixelEditor } from '@nice2dev/ui-graphics';
|
|
80
80
|
|
|
81
|
-
<
|
|
82
|
-
initialWidth={64}
|
|
83
|
-
initialHeight={64}
|
|
84
|
-
onSaveToLibrary={(dataUrl, name, mimeType) => upload(dataUrl)}
|
|
85
|
-
/>
|
|
81
|
+
<NicePixelEditor initialWidth={64} initialHeight={64} onSaveToLibrary={(dataUrl, name, mimeType) => upload(dataUrl)} />;
|
|
86
82
|
```
|
|
87
83
|
|
|
88
|
-
| Prop
|
|
89
|
-
|
|
90
|
-
| `initialWidth`
|
|
91
|
-
| `initialHeight`
|
|
92
|
-
| `className`
|
|
93
|
-
| `onSaveToLibrary` | `(dataUrl, name, mimeType) => void` | —
|
|
84
|
+
| Prop | Type | Default | Description |
|
|
85
|
+
| ----------------- | ----------------------------------- | ------- | ----------------------- |
|
|
86
|
+
| `initialWidth` | `number` | `64` | Canvas width in pixels |
|
|
87
|
+
| `initialHeight` | `number` | `64` | Canvas height in pixels |
|
|
88
|
+
| `className` | `string` | — | CSS class on root |
|
|
89
|
+
| `onSaveToLibrary` | `(dataUrl, name, mimeType) => void` | — | Callback on save |
|
|
94
90
|
|
|
95
|
-
###
|
|
91
|
+
### NiceVectorEditor
|
|
96
92
|
|
|
97
93
|
```tsx
|
|
98
|
-
import {
|
|
94
|
+
import { NiceVectorEditor } from '@nice2dev/ui-graphics';
|
|
99
95
|
|
|
100
|
-
<
|
|
96
|
+
<NiceVectorEditor />;
|
|
101
97
|
```
|
|
102
98
|
|
|
103
|
-
| Prop
|
|
104
|
-
|
|
105
|
-
| `className` | `string` | —
|
|
99
|
+
| Prop | Type | Default | Description |
|
|
100
|
+
| ----------- | -------- | ------- | ----------------- |
|
|
101
|
+
| `className` | `string` | — | CSS class on root |
|
|
106
102
|
|
|
107
|
-
###
|
|
103
|
+
### NicePhotoEditor
|
|
108
104
|
|
|
109
105
|
```tsx
|
|
110
|
-
import {
|
|
106
|
+
import { NicePhotoEditor } from '@nice2dev/ui-graphics';
|
|
111
107
|
|
|
112
|
-
<
|
|
108
|
+
<NicePhotoEditor />;
|
|
113
109
|
```
|
|
114
110
|
|
|
115
|
-
###
|
|
111
|
+
### NiceAnimationEditor
|
|
116
112
|
|
|
117
113
|
```tsx
|
|
118
|
-
import {
|
|
114
|
+
import { NiceAnimationEditor } from '@nice2dev/ui-graphics';
|
|
119
115
|
|
|
120
|
-
<
|
|
121
|
-
onChange={(cfg) => saveCharacter(cfg)}
|
|
122
|
-
onNotify={(msg, type) => toast(msg, { type })}
|
|
123
|
-
/>
|
|
116
|
+
<NiceAnimationEditor onChange={(cfg) => saveCharacter(cfg)} onNotify={(msg, type) => toast(msg, { type })} />;
|
|
124
117
|
```
|
|
125
118
|
|
|
126
|
-
| Prop
|
|
127
|
-
|
|
128
|
-
| `initialConfig` | `CharacterConfig`
|
|
129
|
-
| `onChange`
|
|
130
|
-
| `storageKey`
|
|
131
|
-
| `onNotify`
|
|
132
|
-
| `showJsonPanel` | `boolean`
|
|
133
|
-
| `showPreview`
|
|
134
|
-
| `className`
|
|
119
|
+
| Prop | Type | Default | Description |
|
|
120
|
+
| --------------- | -------------------------------- | --------------------------------------- | ------------------------------------ |
|
|
121
|
+
| `initialConfig` | `CharacterConfig` | `DEFAULT_CHARACTER` | Starting character config |
|
|
122
|
+
| `onChange` | `(cfg: CharacterConfig) => void` | — | Called on every change |
|
|
123
|
+
| `storageKey` | `string \| false` | `"nice2dev.animation-editor.character"` | localStorage key; `false` to disable |
|
|
124
|
+
| `onNotify` | `(msg, type?) => void` | — | Notification callback |
|
|
125
|
+
| `showJsonPanel` | `boolean` | `true` | Show JSON editor panel |
|
|
126
|
+
| `showPreview` | `boolean` | `true` | Show animated preview |
|
|
127
|
+
| `className` | `string` | — | CSS class on root |
|
|
135
128
|
|
|
136
|
-
###
|
|
129
|
+
### NiceGameAsset2dEditor
|
|
137
130
|
|
|
138
131
|
```tsx
|
|
139
|
-
import {
|
|
132
|
+
import { NiceGameAsset2dEditor } from '@nice2dev/ui-graphics';
|
|
140
133
|
|
|
141
|
-
<
|
|
134
|
+
<NiceGameAsset2dEditor />;
|
|
142
135
|
```
|
|
143
136
|
|
|
144
137
|
---
|
|
@@ -148,11 +141,11 @@ import { GameAsset2dEditor } from '@nice2dev/ui-graphics';
|
|
|
148
141
|
### i18n — Translation Provider
|
|
149
142
|
|
|
150
143
|
```tsx
|
|
151
|
-
import { NiceI18nProvider,
|
|
144
|
+
import { NiceI18nProvider, NiceAnimationEditor } from '@nice2dev/ui-graphics';
|
|
152
145
|
|
|
153
146
|
<NiceI18nProvider t={(key, fallback) => myI18n(key) ?? fallback}>
|
|
154
|
-
<
|
|
155
|
-
</NiceI18nProvider
|
|
147
|
+
<NiceAnimationEditor />
|
|
148
|
+
</NiceI18nProvider>;
|
|
156
149
|
```
|
|
157
150
|
|
|
158
151
|
### Plugin System
|
|
@@ -174,8 +167,8 @@ PluginRegistry.register(myPlugin);
|
|
|
174
167
|
|
|
175
168
|
// Or via React context
|
|
176
169
|
<NicePluginProvider plugins={[myPlugin]}>
|
|
177
|
-
<
|
|
178
|
-
</NicePluginProvider
|
|
170
|
+
<NicePixelEditor />
|
|
171
|
+
</NicePluginProvider>;
|
|
179
172
|
```
|
|
180
173
|
|
|
181
174
|
### Theme (Dark / Light)
|
|
@@ -185,7 +178,7 @@ import { NiceEditorThemeProvider, useEditorTheme } from '@nice2dev/ui-graphics';
|
|
|
185
178
|
|
|
186
179
|
<NiceEditorThemeProvider initialMode="auto">
|
|
187
180
|
<YourApp />
|
|
188
|
-
</NiceEditorThemeProvider
|
|
181
|
+
</NiceEditorThemeProvider>;
|
|
189
182
|
|
|
190
183
|
// Inside components:
|
|
191
184
|
const { theme, mode, setMode, toggleMode } = useEditorTheme();
|
|
@@ -239,8 +232,8 @@ const guide = createGuide('vertical', 100);
|
|
|
239
232
|
import { NiceRTLProvider, useIsRTL } from '@nice2dev/ui-graphics';
|
|
240
233
|
|
|
241
234
|
<NiceRTLProvider direction="rtl">
|
|
242
|
-
<
|
|
243
|
-
</NiceRTLProvider
|
|
235
|
+
<NicePixelEditor />
|
|
236
|
+
</NiceRTLProvider>;
|
|
244
237
|
```
|
|
245
238
|
|
|
246
239
|
### Animation Utilities
|
|
@@ -248,9 +241,13 @@ import { NiceRTLProvider, useIsRTL } from '@nice2dev/ui-graphics';
|
|
|
248
241
|
```tsx
|
|
249
242
|
import {
|
|
250
243
|
solveTwoBoneIK,
|
|
251
|
-
blendPose,
|
|
252
|
-
|
|
253
|
-
|
|
244
|
+
blendPose,
|
|
245
|
+
tweenPose,
|
|
246
|
+
ease,
|
|
247
|
+
createLinearPath,
|
|
248
|
+
evaluatePath,
|
|
249
|
+
exportToLottie,
|
|
250
|
+
exportToSpine,
|
|
254
251
|
} from '@nice2dev/ui-graphics';
|
|
255
252
|
|
|
256
253
|
// IK solving
|
|
@@ -318,13 +315,13 @@ npm run analyze
|
|
|
318
315
|
```
|
|
319
316
|
src/
|
|
320
317
|
index.ts # public API barrel export
|
|
321
|
-
pixel/ #
|
|
322
|
-
vector/ #
|
|
323
|
-
photo/ #
|
|
324
|
-
animation/ #
|
|
318
|
+
pixel/ # NicePixelEditor + utils
|
|
319
|
+
vector/ # NiceVectorEditor + boolean ops, gradients
|
|
320
|
+
photo/ # NicePhotoEditor + filters, selection
|
|
321
|
+
animation/ # NiceAnimationEditor + rig, physics, motion paths
|
|
325
322
|
rig/ # Skeleton rigging, IK, FK, pose blending
|
|
326
323
|
shapes/ # SVG body part renderers
|
|
327
|
-
game/ #
|
|
324
|
+
game/ # NiceGameAsset2dEditor
|
|
328
325
|
icon/ # NiceIconEditor
|
|
329
326
|
ui/ # NiceUIDesigner
|
|
330
327
|
texture/ # Nice3DTexturePainter
|
|
@@ -111,8 +111,5 @@ function NiceAnimationEditor({ initialConfig, onChange, storageKey = STORAGE_KEY
|
|
|
111
111
|
};
|
|
112
112
|
return (jsxRuntime.jsxs("div", { className: `ntd-animation-editor ${className !== null && className !== void 0 ? className : ''}`, style: style, children: [jsxRuntime.jsxs("div", { className: "ntd-ae-controls", children: [jsxRuntime.jsx(Row, { title: t('characterEditor.name', 'Name'), children: jsxRuntime.jsx(ui.NiceTextInput, { className: "ntd-ae-input", value: cfg.name || '', onChange: (val) => setCfg({ ...cfg, name: val }), placeholder: t('characterEditor.namePlaceholder', 'Character name') }) }), jsxRuntime.jsxs(Row, { title: t('characters.size', 'Size'), children: [jsxRuntime.jsx(ui.NiceSlider, { min: 140, max: 300, value: (_a = cfg.size) !== null && _a !== void 0 ? _a : 180, onChange: (val) => setCfg({ ...cfg, size: val }) }), jsxRuntime.jsxs("span", { className: "ntd-ae-size-value", children: [(_b = cfg.size) !== null && _b !== void 0 ? _b : 180, "px"] })] }), jsxRuntime.jsx(FeatureEditor, { title: t('characters.faceShape', 'Face'), feature: cfg.face, variants: characterTypes.VARIANTS.face, onChange: (v) => updateFeature('face', v) }), jsxRuntime.jsx(FeatureEditor, { title: t('characters.hairstyle', 'Hair'), feature: cfg.hair, variants: characterTypes.VARIANTS.hair, onChange: (v) => updateFeature('hair', v) }), jsxRuntime.jsx(FeatureEditor, { title: t('characters.eyes', 'Eyes'), feature: cfg.eyes, variants: characterTypes.VARIANTS.eyes, onChange: (v) => updateFeature('eyes', v) }), jsxRuntime.jsx(FeatureEditor, { title: t('characters.nose', 'Nose'), feature: cfg.nose, variants: characterTypes.VARIANTS.nose, onChange: (v) => updateFeature('nose', v) }), jsxRuntime.jsx(FeatureEditor, { title: t('characters.mouth', 'Mouth'), feature: cfg.mouth, variants: characterTypes.VARIANTS.mouth, onChange: (v) => updateFeature('mouth', v) }), jsxRuntime.jsx(FeatureEditor, { title: t('characters.clothing', 'Outfit'), feature: cfg.outfit, variants: characterTypes.VARIANTS.outfit, onChange: (v) => updateFeature('outfit', v) }), jsxRuntime.jsx(FeatureEditor, { title: t('characters.headwear', 'Headwear'), feature: cfg.headwear, variants: characterTypes.VARIANTS.headwear, onChange: (v) => updateFeature('headwear', v) }), jsxRuntime.jsx(FeatureEditor, { title: t('characters.prop', 'Prop'), feature: cfg.prop, variants: characterTypes.VARIANTS.prop, onChange: (v) => updateFeature('prop', v) }), jsxRuntime.jsxs("div", { className: "ntd-ae-action-row", children: [jsxRuntime.jsxs(ui.NiceButton, { className: "ntd-ae-btn", variant: "ghost", onClick: randomizeColors, children: [jsxRuntime.jsx(uiCore.NiceIcon, { name: "shuffle", size: 14 }), ' ', t('characterEditor.randomizeColors', 'Randomize colors')] }), jsxRuntime.jsxs(ui.NiceButton, { className: "ntd-ae-btn", variant: "ghost", onClick: downloadJson, children: [jsxRuntime.jsx(uiCore.NiceIcon, { name: "download", size: 14 }), " ", t('characters.downloadJson', 'Download JSON')] })] }), showJsonPanel && (jsxRuntime.jsxs("div", { className: "ntd-ae-json-panel", children: [jsxRuntime.jsx("div", { className: "ntd-ae-json-label", children: t('characterEditor.jsonSection', 'JSON') }), jsxRuntime.jsx(ui.NiceTextArea, { className: "ntd-ae-textarea", value: json, onChange: (val) => setJson(val) }), jsxRuntime.jsxs("div", { className: "ntd-ae-json-actions", children: [jsxRuntime.jsx(ui.NiceButton, { className: "ntd-ae-btn", variant: "primary", onClick: applyJson, children: t('characterEditor.applyJson', 'Apply JSON') }), jsxRuntime.jsx(ui.NiceButton, { className: "ntd-ae-btn", variant: "ghost", onClick: () => navigator.clipboard.writeText(JSON.stringify(cfg, null, 2)), children: t('characterEditor.copyToClipboard', 'Copy') })] })] }))] }), showPreview && (jsxRuntime.jsxs("div", { className: "ntd-ae-preview", children: [jsxRuntime.jsx("div", { className: "ntd-ae-preview-label", children: t('characterEditor.preview', 'Preview') }), jsxRuntime.jsx(AnimatedPerson, { character: cfg, score: 10, startPose: "idle" })] }))] }));
|
|
113
113
|
}
|
|
114
|
-
/** @deprecated Use NiceAnimationEditor */
|
|
115
|
-
const AnimationEditor = NiceAnimationEditor;
|
|
116
114
|
|
|
117
|
-
exports.AnimationEditor = AnimationEditor;
|
|
118
115
|
exports.NiceAnimationEditor = NiceAnimationEditor;
|
|
@@ -25,11 +25,8 @@ const NiceBodyRenderer = ({ character, size }) => {
|
|
|
25
25
|
const outfitBase = characterTypes.pick(character.outfit.colors, 0, characterTypes.DEFAULT_COLORS.shirt);
|
|
26
26
|
const armColors = [skin, outfitBase, stroke];
|
|
27
27
|
const legColors = [outfitBase, characterTypes.pick(character.outfit.colors, 1, outfitBase), stroke];
|
|
28
|
-
return (jsxRuntime.jsx("svg", { width: S, height: S, viewBox: `0 0 ${S} ${S}`, role: "img", children: jsxRuntime.jsxs("g", { transform: `translate(${S / 2} ${S * 0.86})`, children: [jsxRuntime.jsx(legs.Leg, { colors: legColors, side: -1, variant: "pants", scale: k, transform: "translate(-16 0)" }), jsxRuntime.jsx(legs.Leg, { colors: legColors, side: 1, variant: "pants", scale: k, transform: "translate(16 0)" }), jsxRuntime.jsx(torsos.Torso, { variant: "vShape", colors: [skin, 'var(--anim-transparent, #00000000)', stroke], scale: k }), jsxRuntime.jsx(outfits.Outfit, { variant: character.outfit.variant, colors: character.outfit.colors, scale: k }), jsxRuntime.jsx(arms.Arm, { colors: armColors, side: -1, variant: "sleeveShort", scale: k, transform: "translate(-40 -8)" }), jsxRuntime.jsx(arms.Arm, { colors: armColors, side: 1, variant: "sleeveShort", scale: k, transform: "translate(40 -8)" }), jsxRuntime.jsxs("g", { transform: "translate(0 -84)", children: [jsxRuntime.jsx(heads.
|
|
28
|
+
return (jsxRuntime.jsx("svg", { width: S, height: S, viewBox: `0 0 ${S} ${S}`, role: "img", children: jsxRuntime.jsxs("g", { transform: `translate(${S / 2} ${S * 0.86})`, children: [jsxRuntime.jsx(legs.Leg, { colors: legColors, side: -1, variant: "pants", scale: k, transform: "translate(-16 0)" }), jsxRuntime.jsx(legs.Leg, { colors: legColors, side: 1, variant: "pants", scale: k, transform: "translate(16 0)" }), jsxRuntime.jsx(torsos.Torso, { variant: "vShape", colors: [skin, 'var(--anim-transparent, #00000000)', stroke], scale: k }), jsxRuntime.jsx(outfits.Outfit, { variant: character.outfit.variant, colors: character.outfit.colors, scale: k }), jsxRuntime.jsx(arms.Arm, { colors: armColors, side: -1, variant: "sleeveShort", scale: k, transform: "translate(-40 -8)" }), jsxRuntime.jsx(arms.Arm, { colors: armColors, side: 1, variant: "sleeveShort", scale: k, transform: "translate(40 -8)" }), jsxRuntime.jsxs("g", { transform: "translate(0 -84)", children: [jsxRuntime.jsx(heads.NiceHead, { variant: character.face.variant, colors: character.face.colors, scale: k }), jsxRuntime.jsx(hair.Hair, { variant: character.hair.variant, colors: character.hair.colors, scale: k }), jsxRuntime.jsx(eyes.Eyes, { variant: character.eyes.variant, colors: character.eyes.colors, scale: k }), jsxRuntime.jsx(noses.Nose, { variant: character.nose.variant, colors: character.nose.colors, scale: k }), jsxRuntime.jsx(mouths.Mouth, { variant: character.mouth.variant, colors: character.mouth.colors, scale: k }), jsxRuntime.jsx(headwear.Headwear, { variant: character.headwear.variant, colors: character.headwear.colors, scale: k })] })] }) }));
|
|
29
29
|
};
|
|
30
|
-
/** @deprecated Use NiceBodyRenderer */
|
|
31
|
-
const BodyRenderer = NiceBodyRenderer;
|
|
32
30
|
|
|
33
|
-
exports.BodyRenderer = BodyRenderer;
|
|
34
31
|
exports.NiceBodyRenderer = NiceBodyRenderer;
|
|
35
32
|
exports.default = NiceBodyRenderer;
|
|
@@ -67,11 +67,8 @@ const NiceHead = ({ variant, ...rest }) => {
|
|
|
67
67
|
const Comp = (_a = HEAD_RENDERERS[variant]) !== null && _a !== void 0 ? _a : HeadRound;
|
|
68
68
|
return jsxRuntime.jsx(Comp, { ...rest });
|
|
69
69
|
};
|
|
70
|
-
/** @deprecated Use NiceHead */
|
|
71
|
-
const Head = NiceHead;
|
|
72
70
|
|
|
73
71
|
exports.HEAD_RENDERERS = HEAD_RENDERERS;
|
|
74
|
-
exports.Head = Head;
|
|
75
72
|
exports.HeadChubby = HeadChubby;
|
|
76
73
|
exports.HeadDiamond = HeadDiamond;
|
|
77
74
|
exports.HeadHeart = HeadHeart;
|
|
@@ -570,9 +570,7 @@ const NiceBrushEngine = ({ canvas, color = '#000000', onStrokeEnd, className = '
|
|
|
570
570
|
background: s.name === ((_a = BRUSH_PRESETS[name]) === null || _a === void 0 ? void 0 : _a.name)
|
|
571
571
|
? 'var(--nice-color-accent, #6366f1)'
|
|
572
572
|
: 'transparent',
|
|
573
|
-
color: s.name === ((_b = BRUSH_PRESETS[name]) === null || _b === void 0 ? void 0 : _b.name)
|
|
574
|
-
? 'var(--nice-text-on-primary, #fff)'
|
|
575
|
-
: 'inherit',
|
|
573
|
+
color: s.name === ((_b = BRUSH_PRESETS[name]) === null || _b === void 0 ? void 0 : _b.name) ? 'var(--nice-color-white, #fff)' : 'inherit',
|
|
576
574
|
}, children: BRUSH_PRESETS[name].name }, name));
|
|
577
575
|
}) }), jsxRuntime.jsxs("label", { children: ["Size: ", s.size, "px", jsxRuntime.jsx("input", { type: "range", min: 1, max: 200, value: s.size, onChange: (e) => engine.setSettings({ ...s, size: +e.target.value }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { children: ["Opacity: ", Math.round(s.opacity * 100), "%", jsxRuntime.jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: s.opacity, onChange: (e) => engine.setSettings({ ...s, opacity: +e.target.value }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { children: ["Flow: ", Math.round(s.flow * 100), "%", jsxRuntime.jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: s.flow, onChange: (e) => engine.setSettings({ ...s, flow: +e.target.value }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { children: ["Hardness: ", Math.round(s.hardness * 100), "%", jsxRuntime.jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: s.hardness, onChange: (e) => engine.setSettings({ ...s, hardness: +e.target.value }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { children: ["Smoothing: ", Math.round(s.smoothing * 100), "%", jsxRuntime.jsx("input", { type: "range", min: 0, max: 1, step: 0.01, value: s.smoothing, onChange: (e) => engine.setSettings({ ...s, smoothing: +e.target.value }), style: { width: '100%' } })] }), jsxRuntime.jsxs("label", { children: ["Tip:", jsxRuntime.jsxs("select", { value: s.tipShape, onChange: (e) => engine.setSettings({ ...s, tipShape: e.target.value }), style: { width: '100%' }, children: [jsxRuntime.jsx("option", { value: "circle", children: "Circle" }), jsxRuntime.jsx("option", { value: "square", children: "Square" }), jsxRuntime.jsx("option", { value: "diamond", children: "Diamond" }), jsxRuntime.jsx("option", { value: "texture", children: "Texture" })] })] }), jsxRuntime.jsxs("label", { children: ["Roundness: ", Math.round(s.roundness * 100), "%", jsxRuntime.jsx("input", { type: "range", min: 0.05, max: 1, step: 0.05, value: s.roundness, onChange: (e) => engine.setSettings({ ...s, roundness: +e.target.value }), style: { width: '100%' } })] }), jsxRuntime.jsxs("details", { children: [jsxRuntime.jsxs("summary", { style: { cursor: 'pointer', fontSize: 12 }, children: [jsxRuntime.jsx(uiCore.NiceIcon, { name: "bar-chart", size: 12 }), " Size Dynamics"] }), jsxRuntime.jsxs("label", { children: ["Source:", jsxRuntime.jsxs("select", { value: s.sizeDynamics.source, onChange: (e) => engine.setSettings({
|
|
578
576
|
...s,
|
|
@@ -191,7 +191,7 @@ const NiceFontEditor = ({ fontName = 'MyFont', onSave, className = '', tutorial,
|
|
|
191
191
|
border: 'none',
|
|
192
192
|
cursor: 'pointer',
|
|
193
193
|
background: active ? 'var(--nice-info, #339af0)' : 'var(--nice-bg-secondary, #2c2e33)',
|
|
194
|
-
color: active ? 'var(--nice-
|
|
194
|
+
color: active ? 'var(--nice-color-white, #fff)' : 'var(--nice-text, #c1c2c5)',
|
|
195
195
|
fontSize: 11,
|
|
196
196
|
});
|
|
197
197
|
const fieldStyle = {
|
|
@@ -232,7 +232,7 @@ const NiceFontEditor = ({ fontName = 'MyFont', onSave, className = '', tutorial,
|
|
|
232
232
|
}, children: "Save" }), jsxRuntime.jsx("button", { onClick: handleExportSvg, style: {
|
|
233
233
|
padding: '4px 12px',
|
|
234
234
|
background: '#228be6',
|
|
235
|
-
color: 'var(--nice-
|
|
235
|
+
color: 'var(--nice-color-white, #fff)',
|
|
236
236
|
border: 'none',
|
|
237
237
|
borderRadius: 3,
|
|
238
238
|
cursor: 'pointer',
|
|
@@ -265,7 +265,7 @@ const NiceFontEditor = ({ fontName = 'MyFont', onSave, className = '', tutorial,
|
|
|
265
265
|
? 'var(--nice-bg-secondary, #2c2e33)'
|
|
266
266
|
: '#25262b',
|
|
267
267
|
color: editor.selectedGlyph === g.unicode
|
|
268
|
-
? 'var(--nice-
|
|
268
|
+
? 'var(--nice-color-white, #fff)'
|
|
269
269
|
: g.path
|
|
270
270
|
? 'var(--nice-text, #c1c2c5)'
|
|
271
271
|
: '#5c5f66',
|
|
@@ -392,8 +392,5 @@ const NiceGameAsset2dEditor = ({ className, onSave, onExport, }) => {
|
|
|
392
392
|
};
|
|
393
393
|
return (jsxRuntime.jsx(ui.NiceAppShell, { className: `${GameAsset2dEditor_module.root} ${className || ''}`, flush: true, menubar: jsxRuntime.jsx(MenuBar, { api: api }), toolbar: jsxRuntime.jsx(ModeTabs, { api: api }), statusBar: jsxRuntime.jsx(StatusBar, { api: api }), children: jsxRuntime.jsx("div", { style: { display: 'flex', flexDirection: 'column', minHeight: 0, height: '100%' }, children: renderModeContent() }) }));
|
|
394
394
|
};
|
|
395
|
-
/** @deprecated Use NiceGameAsset2dEditor */
|
|
396
|
-
const GameAsset2dEditor = NiceGameAsset2dEditor;
|
|
397
395
|
|
|
398
|
-
exports.GameAsset2dEditor = GameAsset2dEditor;
|
|
399
396
|
exports.NiceGameAsset2dEditor = NiceGameAsset2dEditor;
|
package/dist/cjs/index.js
CHANGED
|
@@ -73,14 +73,9 @@ var designTools = require('./design/design-tools.js');
|
|
|
73
73
|
|
|
74
74
|
|
|
75
75
|
exports.NicePixelEditor = PixelEditor.NicePixelEditor;
|
|
76
|
-
exports.PixelEditor = PixelEditor.PixelEditor;
|
|
77
76
|
exports.NiceVectorEditor = VectorEditor.NiceVectorEditor;
|
|
78
|
-
exports.VectorEditor = VectorEditor.VectorEditor;
|
|
79
77
|
exports.NicePhotoEditor = PhotoEditor;
|
|
80
|
-
exports.PhotoEditor = PhotoEditor;
|
|
81
|
-
exports.AnimationEditor = AnimationEditor.AnimationEditor;
|
|
82
78
|
exports.NiceAnimationEditor = AnimationEditor.NiceAnimationEditor;
|
|
83
|
-
exports.AnimatedPerson = AnimatedPerson;
|
|
84
79
|
exports.NiceAnimatedPerson = AnimatedPerson;
|
|
85
80
|
exports.ALL_DIRECTIONS = spriteGeneratorCore.ALL_DIRECTIONS;
|
|
86
81
|
exports.applyIsometricProjection = spriteGeneratorCore.applyIsometricProjection;
|
|
@@ -115,8 +110,6 @@ exports.FUR_PALETTES = animalGeneratorPresets.FUR_PALETTES;
|
|
|
115
110
|
exports.SCALE_PALETTES = animalGeneratorPresets.SCALE_PALETTES;
|
|
116
111
|
exports.initAnimalParts = animalGeneratorPresets.initAnimalParts;
|
|
117
112
|
exports.NiceSpriteGeneratorPanel = SpriteGeneratorPanel;
|
|
118
|
-
exports.SpriteGeneratorPanel = SpriteGeneratorPanel;
|
|
119
|
-
exports.GameAsset2dEditor = GameAsset2dEditor.GameAsset2dEditor;
|
|
120
113
|
exports.NiceGameAsset2dEditor = GameAsset2dEditor.NiceGameAsset2dEditor;
|
|
121
114
|
exports.useGameAssetEditor = useGameAssetEditor.useGameAssetEditor;
|
|
122
115
|
exports.NiceI18nProvider = i18n.NiceI18nProvider;
|
|
@@ -190,7 +183,6 @@ exports.booChoreo = choreography.booChoreo;
|
|
|
190
183
|
exports.danceParty = choreography.danceParty;
|
|
191
184
|
exports.showcaseAll = choreography.showcaseAll;
|
|
192
185
|
exports.waveScoreChoreo = choreography.waveScoreChoreo;
|
|
193
|
-
exports.Audience = Audience;
|
|
194
186
|
exports.NiceAudience = Audience;
|
|
195
187
|
exports.attachScoreReactions = karaokeIntegration.attachScoreReactions;
|
|
196
188
|
exports.onScore = karaokeIntegration.onScore;
|
|
@@ -198,12 +190,9 @@ exports.playIntro = karaokeIntegration.playIntro;
|
|
|
198
190
|
exports.reactionForScore = karaokeIntegration.reactionForScore;
|
|
199
191
|
exports.scoreBus = karaokeIntegration.scoreBus;
|
|
200
192
|
exports.simulateScore = karaokeIntegration.simulateScore;
|
|
201
|
-
exports.BodyRenderer = BodyRenderer.BodyRenderer;
|
|
202
|
-
exports.BodyRendererDefault = BodyRenderer.NiceBodyRenderer;
|
|
203
193
|
exports.NiceBodyRenderer = BodyRenderer.NiceBodyRenderer;
|
|
204
194
|
exports.NiceBodyRendererDefault = BodyRenderer.NiceBodyRenderer;
|
|
205
195
|
exports.HEAD_RENDERERS = heads.HEAD_RENDERERS;
|
|
206
|
-
exports.Head = heads.Head;
|
|
207
196
|
exports.NiceHead = heads.NiceHead;
|
|
208
197
|
exports.EYES_RENDERERS = eyes.EYES_RENDERERS;
|
|
209
198
|
exports.Eyes = eyes.Eyes;
|