@nice2dev/ui 1.0.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 +258 -0
- package/LICENSE +21 -0
- package/README.md +702 -0
- package/dist/index.cjs +3762 -0
- package/dist/index.d.ts +13386 -0
- package/dist/index.mjs +46838 -0
- package/dist/ui.css +1 -0
- package/package.json +90 -0
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,258 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
All notable changes to `@nice2dev/ui` will be documented in this file.
|
|
4
|
+
|
|
5
|
+
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
|
|
6
|
+
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
|
+
|
|
8
|
+
---
|
|
9
|
+
|
|
10
|
+
## [1.0.0] — 2026-03-16
|
|
11
|
+
|
|
12
|
+
### 🎉 Initial Release
|
|
13
|
+
|
|
14
|
+
The first stable release of `@nice2dev/ui` — a universal, themeable, i18n-ready React component library with **160+ components**, zero runtime dependencies.
|
|
15
|
+
|
|
16
|
+
### Core Architecture
|
|
17
|
+
|
|
18
|
+
- **Zero runtime dependencies** — only `react` and `react-dom` as peer dependencies
|
|
19
|
+
- **TypeScript-first** — strict mode, full type coverage, exported types for all components
|
|
20
|
+
- **CSS Custom Properties theming** — no SASS/LESS rebuild required
|
|
21
|
+
- **Built-in i18n** — `NiceI18nProvider` + `useNiceTranslation` with pluggable translation function
|
|
22
|
+
- **RTL support** — `NiceRTLProvider` with logical CSS properties
|
|
23
|
+
- **Accessibility (a11y)** — WCAG 2.1 AA, ARIA attributes, keyboard navigation, `NiceA11yProvider`
|
|
24
|
+
- **Animation system** — `useNiceTransition`, `useNiceCollapse`, stagger delays
|
|
25
|
+
- **Responsive utilities** — `useBreakpoint`, `useMediaQuery`, `useResponsiveValue`, `useContainerSize`
|
|
26
|
+
- **Touch support** — `useIsTouchDevice`, `useInputMode`, `useLongPress`, responsive touch CSS
|
|
27
|
+
- **Access control** — `NiceAccessControl` provider with `'full' | 'readOnly' | 'disabled' | 'hidden'` modes
|
|
28
|
+
- **Data source abstraction** — Array, REST, OData, GraphQL, Custom data sources with hooks
|
|
29
|
+
- **Testing utilities** — `testId`, `niceSelectors`, `NiceTestWrapper`, `simulateKeyboard`
|
|
30
|
+
|
|
31
|
+
### Themes (7 built-in presets)
|
|
32
|
+
|
|
33
|
+
- `niceThemeLight` — Clean light theme (default)
|
|
34
|
+
- `niceThemeDark` — Dark mode
|
|
35
|
+
- `niceThemeBlue` — Professional blue
|
|
36
|
+
- `niceThemeHighContrast` — WCAG AAA high contrast
|
|
37
|
+
- `niceThemeMaterial` — Material Design inspired
|
|
38
|
+
- `niceThemeBootstrap` — Bootstrap-like styling
|
|
39
|
+
- `niceThemeFluent` — Microsoft Fluent UI inspired
|
|
40
|
+
|
|
41
|
+
### Editors (28 components)
|
|
42
|
+
|
|
43
|
+
- `NiceTextInput` — Text input with label, validation, icons
|
|
44
|
+
- `NiceTextArea` — Multi-line text input with auto-resize
|
|
45
|
+
- `NiceNumberInput` — Numeric input with spin buttons, formatting
|
|
46
|
+
- `NiceDatePicker` — Date selection with calendar popup
|
|
47
|
+
- `NiceDateTimePicker` — Combined date + time picker
|
|
48
|
+
- `NiceTimePicker` — Standalone time picker (12h/24h, clock dial)
|
|
49
|
+
- `NiceDateRangeBox` — Date range selection
|
|
50
|
+
- `NiceSelect` — Dropdown select with groups, virtualizing, async search
|
|
51
|
+
- `NiceAutocomplete` — Autocomplete with grouped suggestions, highlight matching
|
|
52
|
+
- `NiceCheckbox` — Checkbox with indeterminate state
|
|
53
|
+
- `NiceToggle` — Toggle switch
|
|
54
|
+
- `NiceRadioGroup` — Radio button group
|
|
55
|
+
- `NiceSlider` — Single-value slider
|
|
56
|
+
- `NiceRangeSlider` — Dual-handle range slider
|
|
57
|
+
- `NiceColorPicker` — Color picker with palette and custom input
|
|
58
|
+
- `NiceCalendar` — Full calendar with week numbers, multi-select, custom day rendering
|
|
59
|
+
- `NiceTagBox` — Multi-value tag input
|
|
60
|
+
- `NiceDropDownBox` — Generic dropdown container
|
|
61
|
+
- `NiceForm` — Dynamic form with responsive columns, conditional fields, field groups
|
|
62
|
+
- `NiceHtmlEditor` — Rich text editor with tables, image upload, mentions, code blocks, markdown mode
|
|
63
|
+
- `NiceMaskedInput` — Input with configurable mask patterns
|
|
64
|
+
- `NiceRating` — Star/icon rating input with half-star support
|
|
65
|
+
- `NicePasswordInput` — Password with visibility toggle and strength meter
|
|
66
|
+
- `NiceInputOtp` — OTP verification code input
|
|
67
|
+
- `NiceKnob` — Circular dial numeric input
|
|
68
|
+
- `NiceMention` — @mention component for tagging
|
|
69
|
+
- `NiceTreeSelect` — Tree-based dropdown select
|
|
70
|
+
- `NicePickList` — Dual-list picker (source ↔ target)
|
|
71
|
+
|
|
72
|
+
### Buttons (5 components)
|
|
73
|
+
|
|
74
|
+
- `NiceButton` — Primary button with variants, sizes, icons
|
|
75
|
+
- `NiceButtonGroup` — Grouped buttons
|
|
76
|
+
- `NiceIconButton` — Icon-only button
|
|
77
|
+
- `NiceDropDownButton` — Button with dropdown menu
|
|
78
|
+
- `NiceSpeedDialAction` — Floating speed dial
|
|
79
|
+
|
|
80
|
+
### Data & Tables (15 components)
|
|
81
|
+
|
|
82
|
+
- `NiceTable` — Simple HTML table wrapper
|
|
83
|
+
- `NiceDataGrid` — Full-featured data grid: virtual scrolling, column pinning, inline editing, row grouping, aggregation, master/detail, Excel/CSV/PDF export, clipboard, sparklines, context menu, quick filter, cell flashing
|
|
84
|
+
- `NiceTreeGrid` — Tree + grid hybrid with hierarchy
|
|
85
|
+
- `NiceTreeView` — Tree with drag-and-drop, lazy loading, checkboxes, search, context menu, inline editing
|
|
86
|
+
- `NiceTreeList` — Flat tree list
|
|
87
|
+
- `NiceList` — List with grouping, swipe actions, selection
|
|
88
|
+
- `NiceCardView` — Card-based data view
|
|
89
|
+
- `NiceTileView` — Tile/grid data view
|
|
90
|
+
- `NicePivotGrid` — Pivot table with drill-through, calculated fields, chart integration
|
|
91
|
+
- `NicePivotGridFieldChooser` — Field chooser for pivot grid
|
|
92
|
+
- `NiceKanbanBoard` — Drag-and-drop task board (Trello-style)
|
|
93
|
+
- `NiceSpreadsheet` — Excel-like spreadsheet with formulas and multiple sheets
|
|
94
|
+
- `NiceLookup` — Lookup field with search
|
|
95
|
+
- `NiceCascadeSelect` — Cascading dropdown (Country → City)
|
|
96
|
+
- `NiceMultiColumnComboBox` — Multi-column dropdown
|
|
97
|
+
|
|
98
|
+
### Charts & Visualization (18 components)
|
|
99
|
+
|
|
100
|
+
- `NiceChart` — Line, bar, area, scatter charts with zoom/pan, crosshair, annotations, drill-down, export, real-time updates
|
|
101
|
+
- `NicePieChart` — Pie and donut charts
|
|
102
|
+
- `NicePolarChart` — Radar and polar charts
|
|
103
|
+
- `NiceCircularGauge` — Circular gauge
|
|
104
|
+
- `NiceLinearGauge` — Linear gauge
|
|
105
|
+
- `NiceBarGauge` — Bar gauge
|
|
106
|
+
- `NiceSparkline` — Inline sparkline charts
|
|
107
|
+
- `NiceBullet` — Bullet chart
|
|
108
|
+
- `NiceFunnel` — Funnel chart
|
|
109
|
+
- `NiceSankey` — Sankey diagram
|
|
110
|
+
- `NiceRangeSelector` — Range selection with chart preview
|
|
111
|
+
- `NiceVectorMap` — SVG vector map
|
|
112
|
+
- `NiceOrganizationChart` — Org chart / tree layout
|
|
113
|
+
- `NiceHeatMap` — Heat map
|
|
114
|
+
- `NiceTreeMap` — Treemap visualization
|
|
115
|
+
- `NiceStockChart` — Financial candlestick/OHLC charts
|
|
116
|
+
- `NiceBarcodeGenerator` — Barcode generator (Code128, EAN, UPC)
|
|
117
|
+
- `NiceQRCode` — QR code generator
|
|
118
|
+
|
|
119
|
+
### Display (18 components)
|
|
120
|
+
|
|
121
|
+
- `NiceBadge` — Count/status badge
|
|
122
|
+
- `NiceTag` — Tag/chip component
|
|
123
|
+
- `NiceAvatar` — User avatar
|
|
124
|
+
- `NiceAvatarGroup` — Stacked avatar group
|
|
125
|
+
- `NiceProgress` — Progress bar
|
|
126
|
+
- `NiceDivider` — Horizontal/vertical divider
|
|
127
|
+
- `NiceTooltip` — Tooltip with arrow, follow cursor, rich content
|
|
128
|
+
- `NiceSkeleton` — Loading skeleton
|
|
129
|
+
- `NiceSpinner` — Loading spinner
|
|
130
|
+
- `NiceEmpty` — Empty state placeholder
|
|
131
|
+
- `NiceTimeline` — Vertical/horizontal timeline
|
|
132
|
+
- `NiceCarousel` — Image/content carousel with autoplay
|
|
133
|
+
- `NiceVirtualScroller` — Virtual scrolling container
|
|
134
|
+
- `NiceImageViewer` — Image with zoom, rotate, lightbox
|
|
135
|
+
- `NicePDFViewer` — Embedded PDF viewer
|
|
136
|
+
- `NiceTerminalUI` — CLI-style terminal component
|
|
137
|
+
- `NiceIcon` — SVG icon component (78 built-in icons)
|
|
138
|
+
- `NiceDataDisplay` — Generic data display
|
|
139
|
+
|
|
140
|
+
### Feedback (10 components)
|
|
141
|
+
|
|
142
|
+
- `NiceAlert` — Alert banners (info, success, warning, error)
|
|
143
|
+
- `NiceModal` — Modal dialog with fullscreen, stacking
|
|
144
|
+
- `NiceDrawer` — Slide-out drawer panel
|
|
145
|
+
- `NiceToast` / `NiceToastContainer` — Toast notifications
|
|
146
|
+
- `NiceConfirmDialog` — Pre-built confirmation dialog
|
|
147
|
+
- `NiceCookieConsent` — GDPR cookie consent banner
|
|
148
|
+
- `NiceLoginForm` — Pre-built login form
|
|
149
|
+
|
|
150
|
+
### Navigation (21 components)
|
|
151
|
+
|
|
152
|
+
- `NiceTabs` / `NiceTabPanel` — Tab navigation
|
|
153
|
+
- `NiceAccordion` — Collapsible accordion
|
|
154
|
+
- `NiceBreadcrumb` — Breadcrumb navigation
|
|
155
|
+
- `NicePagination` — Page navigation
|
|
156
|
+
- `NiceCard` — Card container
|
|
157
|
+
- `NiceMenu` — Multi-level menu with keyboard navigation
|
|
158
|
+
- `NiceContextMenu` — Right-click context menu
|
|
159
|
+
- `NiceMultiView` — View switching container
|
|
160
|
+
- `NiceSplitter` — Resizable split panes
|
|
161
|
+
- `NiceToolbar` — Toolbar with items
|
|
162
|
+
- `NiceAppLayout` — Application shell (header + sidebar + content)
|
|
163
|
+
- `NiceBottomNavigation` — Mobile bottom nav bar
|
|
164
|
+
- `NiceMegaMenu` — Full-width mega menu
|
|
165
|
+
- `NiceDashboardLayout` — Drag-and-drop dashboard panels
|
|
166
|
+
- `NiceDock` — macOS-style dock bar
|
|
167
|
+
- `NiceDesktop` — Desktop metaphor with taskbar, start menu, system tray
|
|
168
|
+
- `NiceConsole` — Developer console with tabs and commands
|
|
169
|
+
|
|
170
|
+
### Overlays & Layout (14 components)
|
|
171
|
+
|
|
172
|
+
- `NiceActionSheet` — Bottom action sheet
|
|
173
|
+
- `NicePopover` — Popover with positioning
|
|
174
|
+
- `NiceLoadPanel` — Loading overlay
|
|
175
|
+
- `NiceBox` — Flex box container
|
|
176
|
+
- `NiceResponsiveBox` — Responsive layout container
|
|
177
|
+
- `NiceResizable` — Resizable wrapper
|
|
178
|
+
- `NiceScrollView` — Custom scroll container
|
|
179
|
+
- `NiceBlockUI` — UI blocking overlay
|
|
180
|
+
- `NiceWindow` — Draggable, resizable window
|
|
181
|
+
- `NiceWindowManager` — Multi-window manager with taskbar
|
|
182
|
+
- `NiceTutorial` — Step-by-step tutorial overlay
|
|
183
|
+
- `NiceTutorialProvider` — Tutorial context provider
|
|
184
|
+
|
|
185
|
+
### Planning (4 components)
|
|
186
|
+
|
|
187
|
+
- `NiceScheduler` — Calendar scheduler with day/week/month/timeline/agenda views, recurring events, drag-and-drop, categories, tooltips, work hours, current time indicator
|
|
188
|
+
- `NiceGantt` — Gantt chart with dependencies, resource assignment, critical path, baseline comparison, zoom
|
|
189
|
+
- `NiceDiagram` — Diagram editor with shapes, snap-to-grid, auto-layout, swimlanes, undo/redo, export
|
|
190
|
+
- `NiceStepper` — Step-by-step wizard
|
|
191
|
+
|
|
192
|
+
### Tools (14 components)
|
|
193
|
+
|
|
194
|
+
- `NiceChat` — Chat/messaging component
|
|
195
|
+
- `NiceDraggable` — Draggable wrapper
|
|
196
|
+
- `NiceSortable` — Sortable list
|
|
197
|
+
- `NiceFileUploader` — File upload with drag-and-drop, preview, progress, chunked upload, clipboard paste
|
|
198
|
+
- `NiceFileManager` — File browser with dual-pane Norton Commander mode
|
|
199
|
+
- `NiceFilterBuilder` — Visual query builder with presets, custom operators, nested groups
|
|
200
|
+
- `NiceGallery` — Image gallery
|
|
201
|
+
- `NiceMap` — Interactive map with markers
|
|
202
|
+
- `NiceSpeechToText` — Speech recognition input
|
|
203
|
+
- `NiceValidationGroup` / `NiceValidator` / `NiceValidationSummary` — Form validation system
|
|
204
|
+
- `NiceThemeDesigner` — Visual theme editor
|
|
205
|
+
- `NiceThemeBuilder` — Theme builder tool
|
|
206
|
+
- `NiceControlConfigurator` — Component configurator
|
|
207
|
+
- `NiceShowcase` — Self-contained library showcase / documentation component
|
|
208
|
+
|
|
209
|
+
### Advanced Editors (4 components)
|
|
210
|
+
|
|
211
|
+
- `NiceMarkdownEditor` — Markdown editor with split preview
|
|
212
|
+
- `NiceInPlaceEditor` — Click-to-edit inline editor
|
|
213
|
+
- `NiceImageEditor` — Image editing (crop, rotate, annotate)
|
|
214
|
+
- `NiceDocumentEditor` — Word-processor editor
|
|
215
|
+
- `NiceSignaturePad` — Digital signature capture
|
|
216
|
+
|
|
217
|
+
### View Builder (3 components)
|
|
218
|
+
|
|
219
|
+
- `NiceViewBuilder` — Visual UI builder
|
|
220
|
+
- `NiceViewRenderer` — Renders view definitions
|
|
221
|
+
- View definition utilities: `serializeView`, `deserializeView`, `generateViewId`
|
|
222
|
+
|
|
223
|
+
### Hooks (14 exported hooks)
|
|
224
|
+
|
|
225
|
+
- `useControlId` — Stable unique ID generation
|
|
226
|
+
- `useDebouncedValue` — Debounced value
|
|
227
|
+
- `useClickOutside` — Click outside detection
|
|
228
|
+
- `useFocusTrap` — Focus trapping
|
|
229
|
+
- `useIsTouchDevice` — Touch device detection
|
|
230
|
+
- `useInputMode` — Touch vs mouse mode detection
|
|
231
|
+
- `useLongPress` — Long press gesture
|
|
232
|
+
- `useBreakpoint` — Current breakpoint
|
|
233
|
+
- `useMediaQuery` — CSS media query match
|
|
234
|
+
- `useResponsiveValue` — Responsive value selection
|
|
235
|
+
- `useContainerSize` — Container dimensions
|
|
236
|
+
- `useNiceTranslation` — i18n translation hook
|
|
237
|
+
- `useNiceToast` — Toast notifications
|
|
238
|
+
- `useNiceValidation` — Validation state
|
|
239
|
+
|
|
240
|
+
### Icons
|
|
241
|
+
|
|
242
|
+
- **78 built-in SVG icons** accessible via `<NiceIcon name="..." />`
|
|
243
|
+
- `NiceIconProvider` for pluggable custom icon resolvers
|
|
244
|
+
- Icons: add, alert, arrow-*, calendar, chart, check, close, copy, delete, download, edit, email, file, filter, folder, grid, heart, help, home, image, info, link, list, lock, mail, menu, minus, notification, paste, person, phone, pin, play, plus, print, refresh, save, search, settings, share, sort, star, sync, table, tag, time, trash, tree, undo, redo, upload, view, warning, zoom-in, zoom-out, and more
|
|
245
|
+
|
|
246
|
+
### CSS
|
|
247
|
+
|
|
248
|
+
- **BEM naming convention** throughout
|
|
249
|
+
- **CSS Custom Properties** for all theme tokens
|
|
250
|
+
- **Dark mode** support via `.nice-dark` class or `prefers-color-scheme`
|
|
251
|
+
- **Touch-optimized CSS** — `@media (pointer: coarse)` for larger touch targets
|
|
252
|
+
- **Responsive breakpoints** — Mobile (≤575px), Tablet (≤767px), Desktop (≥992px)
|
|
253
|
+
- **Print styles** — `@media print` with hidden scrollbars, no shadows
|
|
254
|
+
- Two CSS files: `controls.css` (~1500 lines) + `controls-extended.css` (~2400 lines)
|
|
255
|
+
|
|
256
|
+
---
|
|
257
|
+
|
|
258
|
+
_This is the first official release. For feature requests or bug reports, please open an issue on GitHub._
|
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 NiceToDev
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|