@nice2dev/icons 1.2.0 → 1.2.1
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 +103 -0
- package/dist/cjs/NiceDesktopIconExporter.js +2 -6
- package/dist/cjs/NiceFaviconGenerator.js +2 -1
- package/dist/cjs/NiceIconPicker.js +15 -20
- package/dist/cjs/NiceIconSetCreator.js +6 -29
- package/dist/cjs/NtdIconBadge.js +12 -12
- package/dist/cjs/NtdIconMorph.js +21 -11
- package/dist/cjs/NtdStateMorph.js +3 -3
- package/dist/cjs/animationControls.js +10 -3
- package/dist/cjs/createIcon.js +5 -2
- package/dist/cjs/headless-ui.js +3 -3
- package/dist/cjs/iconStyles.js +36 -34
- package/dist/cjs/icons/accessibility.js +13 -13
- package/dist/cjs/icons/actions.js +37 -25
- package/dist/cjs/icons/ai.js +15 -15
- package/dist/cjs/icons/brand.js +7 -7
- package/dist/cjs/icons/business.js +18 -81
- package/dist/cjs/icons/devtech.js +31 -103
- package/dist/cjs/icons/ecommerce.js +16 -16
- package/dist/cjs/icons/education.js +17 -17
- package/dist/cjs/icons/files.js +31 -31
- package/dist/cjs/icons/fintech.js +14 -14
- package/dist/cjs/icons/food.js +16 -16
- package/dist/cjs/icons/fun.js +13 -13
- package/dist/cjs/icons/gaming.js +15 -15
- package/dist/cjs/icons/health.js +13 -22
- package/dist/cjs/icons/index.js +4 -0
- package/dist/cjs/icons/legal.js +13 -13
- package/dist/cjs/icons/media.js +46 -23
- package/dist/cjs/icons/navigation.js +14 -14
- package/dist/cjs/icons/omniverk.js +10 -10
- package/dist/cjs/icons/realestate.js +17 -17
- package/dist/cjs/icons/saas.js +13 -13
- package/dist/cjs/icons/science.js +16 -16
- package/dist/cjs/icons/shapes.js +22 -22
- package/dist/cjs/icons/smarthome.js +13 -13
- package/dist/cjs/icons/social.js +8 -98
- package/dist/cjs/icons/sports.js +14 -14
- package/dist/cjs/icons/sustainability.js +15 -15
- package/dist/cjs/icons/travel.js +15 -15
- package/dist/cjs/icons/ui.js +39 -28
- package/dist/cjs/icons/weather.js +20 -20
- package/dist/cjs/index.js +4 -0
- package/dist/cjs/lottieIntegration.js +3 -3
- package/dist/cjs/nicetodev-icons.css +1 -1
- package/dist/cjs/particleEffects.js +11 -4
- package/dist/cjs/resolver.js +4 -0
- package/dist/esm/NiceDesktopIconExporter.js +2 -6
- package/dist/esm/NiceFaviconGenerator.js +2 -1
- package/dist/esm/NiceIconPicker.js +16 -21
- package/dist/esm/NiceIconSetCreator.js +6 -29
- package/dist/esm/NtdIconBadge.js +12 -12
- package/dist/esm/NtdIconMorph.js +21 -11
- package/dist/esm/NtdStateMorph.js +3 -3
- package/dist/esm/animationControls.js +11 -4
- package/dist/esm/createIcon.js +6 -3
- package/dist/esm/headless-ui.js +3 -3
- package/dist/esm/iconStyles.js +36 -34
- package/dist/esm/icons/accessibility.js +13 -13
- package/dist/esm/icons/actions.js +37 -26
- package/dist/esm/icons/ai.js +15 -15
- package/dist/esm/icons/brand.js +7 -7
- package/dist/esm/icons/business.js +18 -81
- package/dist/esm/icons/devtech.js +31 -103
- package/dist/esm/icons/ecommerce.js +16 -16
- package/dist/esm/icons/education.js +17 -17
- package/dist/esm/icons/files.js +31 -31
- package/dist/esm/icons/fintech.js +14 -14
- package/dist/esm/icons/food.js +16 -16
- package/dist/esm/icons/fun.js +13 -13
- package/dist/esm/icons/gaming.js +15 -15
- package/dist/esm/icons/health.js +13 -22
- package/dist/esm/icons/index.js +3 -3
- package/dist/esm/icons/legal.js +13 -13
- package/dist/esm/icons/media.js +45 -24
- package/dist/esm/icons/navigation.js +14 -14
- package/dist/esm/icons/omniverk.js +10 -10
- package/dist/esm/icons/realestate.js +17 -17
- package/dist/esm/icons/saas.js +13 -13
- package/dist/esm/icons/science.js +16 -16
- package/dist/esm/icons/shapes.js +22 -22
- package/dist/esm/icons/smarthome.js +13 -13
- package/dist/esm/icons/social.js +8 -98
- package/dist/esm/icons/sports.js +14 -14
- package/dist/esm/icons/sustainability.js +15 -15
- package/dist/esm/icons/travel.js +15 -15
- package/dist/esm/icons/ui.js +39 -29
- package/dist/esm/icons/weather.js +20 -20
- package/dist/esm/index.js +3 -3
- package/dist/esm/lottieIntegration.js +3 -3
- package/dist/esm/nicetodev-icons.css +1 -1
- package/dist/esm/particleEffects.js +11 -4
- package/dist/esm/resolver.js +4 -0
- package/dist/esm/smilAnimations.js +1 -1
- package/dist/types/NiceDesktopIconExporter.d.ts +1 -0
- package/dist/types/NtdIconBadge.d.ts +12 -4
- package/dist/types/NtdIconMorph.d.ts +9 -3
- package/dist/types/NtdStateMorph.d.ts +3 -1
- package/dist/types/headless-ui.d.ts +6 -2
- package/dist/types/iconStyles.d.ts +33 -11
- package/dist/types/icons/actions.d.ts +1 -0
- package/dist/types/icons/index.d.ts +3 -3
- package/dist/types/icons/media.d.ts +3 -0
- package/dist/types/icons/ui.d.ts +2 -0
- package/dist/types/lottieIntegration.d.ts +3 -1
- package/dist/types/particleEffects.d.ts +3 -1
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { createIcon } from '../createIcon.js';
|
|
3
3
|
|
|
4
|
-
const NtdSunrise = createIcon({
|
|
4
|
+
const NtdSunrise = /* @__PURE__ */ createIcon({
|
|
5
5
|
displayName: 'NtdSunrise',
|
|
6
6
|
paths: {
|
|
7
7
|
solid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M1 18h22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M5 14l-1-1", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M19 14l1-1", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M12 2v3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M17 18a5 5 0 10-10 0", fill: secondaryColor }), jsx("path", { d: "M17 18a5 5 0 10-10 0", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
|
|
@@ -10,7 +10,7 @@ const NtdSunrise = createIcon({
|
|
|
10
10
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M17 18a5 5 0 10-10 0", fill: primaryColor }), jsx("path", { d: "M17 18a5 5 0 10-10 0", fill: "white", opacity: "0.1" }), jsx("path", { d: "M1 18h22", stroke: secondaryColor, strokeWidth: "1.8" }), jsx("path", { d: "M5 14l-1-1", stroke: "#F59E0B", strokeWidth: "1.5" }), jsx("path", { d: "M19 14l1-1", stroke: "#F59E0B", strokeWidth: "1.5" }), jsx("path", { d: "M12 2v3", stroke: "#F59E0B", strokeWidth: "1.5" }), jsx("path", { d: "M17 18a5 5 0 10-10 0", stroke: "#F59E0B", strokeWidth: "1.5", fill: "none" })] })),
|
|
11
11
|
},
|
|
12
12
|
});
|
|
13
|
-
const NtdSunset = createIcon({
|
|
13
|
+
const NtdSunset = /* @__PURE__ */ createIcon({
|
|
14
14
|
displayName: 'NtdSunset',
|
|
15
15
|
paths: {
|
|
16
16
|
solid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M17 18a5 5 0 10-10 0", fill: secondaryColor }), jsx("path", { d: "M17 18a5 5 0 10-10 0", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "1", y1: "18", x2: "23", y2: "18", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "12", y1: "9", x2: "12", y2: "2", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("polyline", { points: "8,5 12,9 16,5", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
|
|
@@ -19,7 +19,7 @@ const NtdSunset = createIcon({
|
|
|
19
19
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M17 18a5 5 0 10-10 0", fill: primaryColor }), jsx("path", { d: "M17 18a5 5 0 10-10 0", fill: "white", opacity: "0.1" }), jsx("path", { d: "M17 18a5 5 0 10-10 0", stroke: secondaryColor, strokeWidth: "1.8", fill: "none" }), jsx("line", { x1: "1", y1: "18", x2: "23", y2: "18", stroke: "#F59E0B", strokeWidth: "1.5" }), jsx("line", { x1: "12", y1: "9", x2: "12", y2: "2", stroke: "#F59E0B", strokeWidth: "1.5" }), jsx("polyline", { points: "8,5 12,9 16,5", stroke: "#F59E0B", strokeWidth: "1.5", fill: "none" })] })),
|
|
20
20
|
},
|
|
21
21
|
});
|
|
22
|
-
const NtdRain = createIcon({
|
|
22
|
+
const NtdRain = /* @__PURE__ */ createIcon({
|
|
23
23
|
displayName: 'NtdRain',
|
|
24
24
|
paths: {
|
|
25
25
|
solid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M20 17.58A5 5 0 0018 8h-1.26A8 8 0 104 16.25", fill: primaryColor }), jsx("line", { x1: "16", y1: "16", x2: "16", y2: "20", stroke: secondaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "8", y1: "16", x2: "8", y2: "20", stroke: secondaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "12", y1: "18", x2: "12", y2: "22", stroke: secondaryColor, strokeWidth: strokeWidth })] })),
|
|
@@ -28,7 +28,7 @@ const NtdRain = createIcon({
|
|
|
28
28
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M20 17.58A5 5 0 0018 8h-1.26A8 8 0 104 16.25", fill: primaryColor }), jsx("path", { d: "M20 17.58A5 5 0 0018 8h-1.26A8 8 0 104 16.25", fill: "white", opacity: "0.1" }), jsx("line", { x1: "16", y1: "16", x2: "16", y2: "20", stroke: secondaryColor, strokeWidth: "1.8" }), jsx("line", { x1: "8", y1: "16", x2: "8", y2: "20", stroke: "#F59E0B", strokeWidth: "1.5" }), jsx("line", { x1: "12", y1: "18", x2: "12", y2: "22", stroke: "#F59E0B", strokeWidth: "1.5" })] })),
|
|
29
29
|
},
|
|
30
30
|
});
|
|
31
|
-
const NtdSnow = createIcon({
|
|
31
|
+
const NtdSnow = /* @__PURE__ */ createIcon({
|
|
32
32
|
displayName: 'NtdSnow',
|
|
33
33
|
paths: {
|
|
34
34
|
solid: ({ primaryColor, secondaryColor, strokeWidth: _strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M20 17.58A5 5 0 0018 8h-1.26A8 8 0 104 16.25", fill: primaryColor }), jsx("circle", { cx: "8", cy: "19", r: "1", fill: secondaryColor }), jsx("circle", { cx: "12", cy: "21", r: "1", fill: secondaryColor }), jsx("circle", { cx: "16", cy: "19", r: "1", fill: secondaryColor })] })),
|
|
@@ -37,7 +37,7 @@ const NtdSnow = createIcon({
|
|
|
37
37
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M20 17.58A5 5 0 0018 8h-1.26A8 8 0 104 16.25", fill: primaryColor }), jsx("path", { d: "M20 17.58A5 5 0 0018 8h-1.26A8 8 0 104 16.25", fill: "white", opacity: "0.08" }), jsx("circle", { cx: "8", cy: "19", r: "1", fill: secondaryColor }), jsx("circle", { cx: "12", cy: "21", r: "1", fill: "#F59E0B" }), jsx("circle", { cx: "16", cy: "19", r: "1", fill: "#60A5FA" })] })),
|
|
38
38
|
},
|
|
39
39
|
});
|
|
40
|
-
const NtdThunderstorm = createIcon({
|
|
40
|
+
const NtdThunderstorm = /* @__PURE__ */ createIcon({
|
|
41
41
|
displayName: 'NtdThunderstorm',
|
|
42
42
|
paths: {
|
|
43
43
|
solid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M19 16.9A5 5 0 0018 7h-1.26a8 8 0 10-11.62 9", fill: primaryColor }), jsx("polyline", { points: "13,11 9,17 13,17 11,21", fill: "none", stroke: secondaryColor, strokeWidth: strokeWidth })] })),
|
|
@@ -46,7 +46,7 @@ const NtdThunderstorm = createIcon({
|
|
|
46
46
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M19 16.9A5 5 0 0018 7h-1.26a8 8 0 10-11.62 9", fill: primaryColor }), jsx("path", { d: "M19 16.9A5 5 0 0018 7h-1.26a8 8 0 10-11.62 9", fill: "white", opacity: "0.1" }), jsx("polyline", { points: "13,11 9,17 13,17 11,21", fill: "none", stroke: secondaryColor, strokeWidth: "1.8" })] })),
|
|
47
47
|
},
|
|
48
48
|
});
|
|
49
|
-
const NtdWind = createIcon({
|
|
49
|
+
const NtdWind = /* @__PURE__ */ createIcon({
|
|
50
50
|
displayName: 'NtdWind',
|
|
51
51
|
paths: {
|
|
52
52
|
solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M9.59 4.59A2 2 0 1111 8H2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M12.59 19.41A2 2 0 1014 16H2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M17.73 7.73A2.5 2.5 0 1119.5 12H2", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
|
|
@@ -62,7 +62,7 @@ const NtdWind = createIcon({
|
|
|
62
62
|
* ellipse (rx 5.6 / ry 6.2), taller than it is wide — the previous r=8 circular
|
|
63
63
|
* arc was what made it look round and fat.
|
|
64
64
|
*/
|
|
65
|
-
const NtdDroplet = createIcon({
|
|
65
|
+
const NtdDroplet = /* @__PURE__ */ createIcon({
|
|
66
66
|
displayName: 'NtdDroplet',
|
|
67
67
|
paths: {
|
|
68
68
|
solid: ({ primaryColor, strokeWidth: _strokeWidth }) => (jsx("path", { d: "M12 2.5C13.1 6.2 17.6 9.4 17.6 14.4a5.6 6.2 0 1 1-11.2 0C6.4 9.4 10.9 6.2 12 2.5z", fill: primaryColor })),
|
|
@@ -71,7 +71,7 @@ const NtdDroplet = createIcon({
|
|
|
71
71
|
vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M12 2.5C13.1 6.2 17.6 9.4 17.6 14.4a5.6 6.2 0 1 1-11.2 0C6.4 9.4 10.9 6.2 12 2.5z", fill: primaryColor }), jsx("path", { d: "M12 2.5C13.1 6.2 17.6 9.4 17.6 14.4a5.6 6.2 0 1 1-11.2 0C6.4 9.4 10.9 6.2 12 2.5z", fill: "white", opacity: "0.1" })] })),
|
|
72
72
|
},
|
|
73
73
|
});
|
|
74
|
-
const NtdThermometer = createIcon({
|
|
74
|
+
const NtdThermometer = /* @__PURE__ */ createIcon({
|
|
75
75
|
displayName: 'NtdThermometer',
|
|
76
76
|
paths: {
|
|
77
77
|
solid: ({ primaryColor, secondaryColor, strokeWidth: _strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M14 14.76V3.5a2.5 2.5 0 00-5 0v11.26a4.5 4.5 0 105 0z", fill: primaryColor }), jsx("circle", { cx: "11.5", cy: "17.5", r: "2", fill: secondaryColor })] })),
|
|
@@ -80,7 +80,7 @@ const NtdThermometer = createIcon({
|
|
|
80
80
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M14 14.76V3.5a2.5 2.5 0 00-5 0v11.26a4.5 4.5 0 105 0z", fill: primaryColor }), jsx("path", { d: "M14 14.76V3.5a2.5 2.5 0 00-5 0v11.26a4.5 4.5 0 105 0z", fill: "white", opacity: "0.08" }), jsx("circle", { cx: "11.5", cy: "17.5", r: "2", fill: secondaryColor })] })),
|
|
81
81
|
},
|
|
82
82
|
});
|
|
83
|
-
const NtdUmbrella = createIcon({
|
|
83
|
+
const NtdUmbrella = /* @__PURE__ */ createIcon({
|
|
84
84
|
displayName: 'NtdUmbrella',
|
|
85
85
|
paths: {
|
|
86
86
|
solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M23 12a11 11 0 00-22 0", fill: primaryColor }), jsx("path", { d: "M12 12v8a2 2 0 004 0", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
|
|
@@ -89,7 +89,7 @@ const NtdUmbrella = createIcon({
|
|
|
89
89
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M23 12a11 11 0 00-22 0", fill: primaryColor }), jsx("path", { d: "M23 12a11 11 0 00-22 0", fill: "white", opacity: "0.1" }), jsx("path", { d: "M12 12v8a2 2 0 004 0", stroke: secondaryColor, strokeWidth: "1.8", fill: "none" })] })),
|
|
90
90
|
},
|
|
91
91
|
});
|
|
92
|
-
const NtdLeaf = createIcon({
|
|
92
|
+
const NtdLeaf = /* @__PURE__ */ createIcon({
|
|
93
93
|
displayName: 'NtdLeaf',
|
|
94
94
|
paths: {
|
|
95
95
|
solid: ({ primaryColor, strokeWidth: _strokeWidth }) => (jsx(Fragment, { children: jsx("path", { d: "M17 8C8 10 5.9 16.17 3.82 21.34l1.89.66.95-2.3c.48.17.98.3 1.34.3C19 20 22 3 22 3c-1 2-8 2.25-13 3.25S2 11.5 2 13.5s1.75 3.75 1.75 3.75", fill: primaryColor }) })),
|
|
@@ -98,7 +98,7 @@ const NtdLeaf = createIcon({
|
|
|
98
98
|
vivid: ({ primaryColor, secondaryColor: _secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M17 8C8 10 5.9 16.17 3.82 21.34l1.89.66.95-2.3c.48.17.98.3 1.34.3C19 20 22 3 22 3c-1 2-8 2.25-13 3.25S2 11.5 2 13.5s1.75 3.75 1.75 3.75", fill: primaryColor }), jsx("path", { d: "M17 8C8 10 5.9 16.17 3.82 21.34l1.89.66.95-2.3c.48.17.98.3 1.34.3C19 20 22 3 22 3c-1 2-8 2.25-13 3.25S2 11.5 2 13.5s1.75 3.75 1.75 3.75", fill: "white", opacity: "0.1" })] })),
|
|
99
99
|
},
|
|
100
100
|
});
|
|
101
|
-
const NtdFlower = createIcon({
|
|
101
|
+
const NtdFlower = /* @__PURE__ */ createIcon({
|
|
102
102
|
displayName: 'NtdFlower',
|
|
103
103
|
paths: {
|
|
104
104
|
solid: ({ primaryColor, secondaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "8", r: "3", fill: primaryColor }), jsx("circle", { cx: "8", cy: "11", r: "3", fill: primaryColor, opacity: 0.8 }), jsx("circle", { cx: "16", cy: "11", r: "3", fill: primaryColor, opacity: 0.8 }), jsx("circle", { cx: "9", cy: "15", r: "3", fill: primaryColor, opacity: 0.6 }), jsx("circle", { cx: "15", cy: "15", r: "3", fill: primaryColor, opacity: 0.6 }), jsx("circle", { cx: "12", cy: "12", r: "2.5", fill: secondaryColor }), jsx("line", { x1: "12", y1: "14.5", x2: "12", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth })] })),
|
|
@@ -107,7 +107,7 @@ const NtdFlower = createIcon({
|
|
|
107
107
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "8", r: "3", fill: primaryColor }), jsx("circle", { cx: "12", cy: "8", r: "3", fill: "white", opacity: "0.08" }), jsx("circle", { cx: "8", cy: "11", r: "3", fill: secondaryColor }), jsx("circle", { cx: "16", cy: "11", r: "3", fill: "#F59E0B" }), jsx("circle", { cx: "9", cy: "15", r: "3", fill: "#60A5FA" }), jsx("circle", { cx: "15", cy: "15", r: "3", fill: "#E2E8F0" }), jsx("circle", { cx: "12", cy: "12", r: "2.5", fill: "#E2E8F0" }), jsx("line", { x1: "12", y1: "14.5", x2: "12", y2: "22", stroke: "white", strokeWidth: "1" })] })),
|
|
108
108
|
},
|
|
109
109
|
});
|
|
110
|
-
const NtdTree = createIcon({
|
|
110
|
+
const NtdTree = /* @__PURE__ */ createIcon({
|
|
111
111
|
displayName: 'NtdTree',
|
|
112
112
|
paths: {
|
|
113
113
|
solid: ({ primaryColor, secondaryColor, strokeWidth: _strokeWidth }) => (jsxs(Fragment, { children: [jsx("polygon", { points: "12,2 4,14 8,14 5,22 19,22 16,14 20,14", fill: primaryColor }), jsx("rect", { x: "10", y: "19", width: "4", height: "4", fill: secondaryColor })] })),
|
|
@@ -116,7 +116,7 @@ const NtdTree = createIcon({
|
|
|
116
116
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("polygon", { points: "12,2 4,14 8,14 5,22 19,22 16,14 20,14", fill: primaryColor }), jsx("polygon", { points: "12,2 4,14 8,14 5,22 19,22 16,14 20,14", fill: "white", opacity: "0.08" }), jsx("rect", { x: "10", y: "19", width: "4", height: "4", fill: secondaryColor })] })),
|
|
117
117
|
},
|
|
118
118
|
});
|
|
119
|
-
const NtdMountain = createIcon({
|
|
119
|
+
const NtdMountain = /* @__PURE__ */ createIcon({
|
|
120
120
|
displayName: 'NtdMountain',
|
|
121
121
|
paths: {
|
|
122
122
|
solid: ({ primaryColor, secondaryColor, strokeWidth: _strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M12 2L2 22h20L12 2z", fill: primaryColor }), jsx("path", { d: "M12 2l3 6-3 2-3-2 3-6z", fill: secondaryColor, opacity: 0.5 })] })),
|
|
@@ -125,7 +125,7 @@ const NtdMountain = createIcon({
|
|
|
125
125
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M12 2L2 22h20L12 2z", fill: primaryColor }), jsx("path", { d: "M12 2L2 22h20L12 2z", fill: "white", opacity: "0.08" }), jsx("path", { d: "M12 2l3 6-3 2-3-2 3-6z", fill: secondaryColor })] })),
|
|
126
126
|
},
|
|
127
127
|
});
|
|
128
|
-
const NtdWave = createIcon({
|
|
128
|
+
const NtdWave = /* @__PURE__ */ createIcon({
|
|
129
129
|
displayName: 'NtdWave',
|
|
130
130
|
paths: {
|
|
131
131
|
solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M2 12c2-3 4-3 6 0s4 3 6 0 4-3 6 0", stroke: primaryColor, strokeWidth: "2.5", fill: "none" }), jsx("path", { d: "M2 17c2-3 4-3 6 0s4 3 6 0 4-3 6 0", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none", opacity: 0.5 }), jsx("path", { d: "M2 7c2-3 4-3 6 0s4 3 6 0 4-3 6 0", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none", opacity: 0.5 })] })),
|
|
@@ -134,7 +134,7 @@ const NtdWave = createIcon({
|
|
|
134
134
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M2 12c2-3 4-3 6 0s4 3 6 0 4-3 6 0", stroke: primaryColor, strokeWidth: "2", fill: "none" }), jsx("path", { d: "M2 17c2-3 4-3 6 0s4 3 6 0 4-3 6 0", stroke: secondaryColor, strokeWidth: "1.8", fill: "none" }), jsx("path", { d: "M2 7c2-3 4-3 6 0s4 3 6 0 4-3 6 0", stroke: "#F59E0B", strokeWidth: "1.5", fill: "none" })] })),
|
|
135
135
|
},
|
|
136
136
|
});
|
|
137
|
-
const NtdFire = createIcon({
|
|
137
|
+
const NtdFire = /* @__PURE__ */ createIcon({
|
|
138
138
|
displayName: 'NtdFire',
|
|
139
139
|
paths: {
|
|
140
140
|
solid: ({ primaryColor, secondaryColor, strokeWidth: _strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M12 23c-4.97 0-9-2.69-9-7 0-3.5 2.5-6 4-7.5 0 0 .5 3.5 3 5s3-3 3-3c2 2 4 4.5 4 7.5 0 2.5-1 5-5 5z", fill: primaryColor }), jsx("path", { d: "M12 23c-2.21 0-4-1.34-4-3.5 0-1.5 1-2.5 2-3.5.5 1.5 1.5 2 2 2s1.5-1 1.5-1c.5 1 1 2 1 3 0 1.66-1.12 3-2.5 3z", fill: secondaryColor })] })),
|
|
@@ -149,7 +149,7 @@ const NtdFire = createIcon({
|
|
|
149
149
|
pair of barbs on every one of the six spokes — anchored at r 6.5, 3 long, at
|
|
150
150
|
±60° to their arm. All five variants now draw the same crystal; previously
|
|
151
151
|
outline and duotone silently dropped the barbs and used a different weight. */
|
|
152
|
-
const NtdSnowflake = createIcon({
|
|
152
|
+
const NtdSnowflake = /* @__PURE__ */ createIcon({
|
|
153
153
|
displayName: 'NtdSnowflake',
|
|
154
154
|
paths: {
|
|
155
155
|
solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M12 2V22M3.34 7L20.66 17M20.66 7L3.34 17", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("path", { d: "M9.4 4L12 5.5L14.6 4M9.4 20L12 18.5L14.6 20M17.63 5.75L17.63 8.75L20.23 10.25M6.37 18.25L6.37 15.25L3.77 13.75M20.23 13.75L17.63 15.25L17.63 18.25M3.77 10.25L6.37 8.75L6.37 5.75", stroke: primaryColor, strokeWidth: "1.5", fill: "none" })] })),
|
|
@@ -158,7 +158,7 @@ const NtdSnowflake = createIcon({
|
|
|
158
158
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M12 2V22", stroke: primaryColor, strokeWidth: "2", fill: "none" }), jsx("path", { d: "M3.34 7L20.66 17M20.66 7L3.34 17", stroke: secondaryColor, strokeWidth: "1.8", fill: "none" }), jsx("path", { d: "M9.4 4L12 5.5L14.6 4M9.4 20L12 18.5L14.6 20M17.63 5.75L17.63 8.75L20.23 10.25M6.37 18.25L6.37 15.25L3.77 13.75M20.23 13.75L17.63 15.25L17.63 18.25M3.77 10.25L6.37 8.75L6.37 5.75", stroke: secondaryColor, strokeWidth: "1.5", fill: "none" })] })),
|
|
159
159
|
},
|
|
160
160
|
});
|
|
161
|
-
const NtdCompass = createIcon({
|
|
161
|
+
const NtdCompass = /* @__PURE__ */ createIcon({
|
|
162
162
|
displayName: 'NtdCompass',
|
|
163
163
|
paths: {
|
|
164
164
|
solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth: _strokeWidth }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), jsx("polygon", { points: "16.24,7.76 14.12,14.12 7.76,16.24 9.88,9.88", fill: accentColor, opacity: accentOpacity })] })),
|
|
@@ -167,7 +167,7 @@ const NtdCompass = createIcon({
|
|
|
167
167
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "12", r: "10", fill: primaryColor }), jsx("circle", { cx: "12", cy: "12", r: "10", fill: "white", opacity: "0.08" }), jsx("polygon", { points: "16.24,7.76 14.12,14.12 7.76,16.24 9.88,9.88", fill: secondaryColor })] })),
|
|
168
168
|
},
|
|
169
169
|
});
|
|
170
|
-
const NtdAnchor = createIcon({
|
|
170
|
+
const NtdAnchor = /* @__PURE__ */ createIcon({
|
|
171
171
|
displayName: 'NtdAnchor',
|
|
172
172
|
paths: {
|
|
173
173
|
solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "5", r: "3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" }), jsx("line", { x1: "12", y1: "8", x2: "12", y2: "21", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M5 12H2a10 10 0 0020 0h-3", stroke: primaryColor, strokeWidth: strokeWidth, fill: "none" })] })),
|
|
@@ -176,7 +176,7 @@ const NtdAnchor = createIcon({
|
|
|
176
176
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("circle", { cx: "12", cy: "5", r: "3", stroke: primaryColor, strokeWidth: "2", fill: "none" }), jsx("line", { x1: "12", y1: "8", x2: "12", y2: "21", stroke: secondaryColor, strokeWidth: "1.8" }), jsx("path", { d: "M5 12H2a10 10 0 0020 0h-3", stroke: "#F59E0B", strokeWidth: "1.5", fill: "none" })] })),
|
|
177
177
|
},
|
|
178
178
|
});
|
|
179
|
-
const NtdFeather = createIcon({
|
|
179
|
+
const NtdFeather = /* @__PURE__ */ createIcon({
|
|
180
180
|
displayName: 'NtdFeather',
|
|
181
181
|
paths: {
|
|
182
182
|
solid: ({ primaryColor, strokeWidth }) => (jsxs(Fragment, { children: [jsx("path", { d: "M20.24 12.24a6 6 0 00-8.49-8.49L5 10.5V19h8.5z", fill: primaryColor }), jsx("line", { x1: "16", y1: "8", x2: "2", y2: "22", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("line", { x1: "17.5", y1: "15", x2: "9", y2: "15", stroke: primaryColor, strokeWidth: strokeWidth })] })),
|
|
@@ -185,7 +185,7 @@ const NtdFeather = createIcon({
|
|
|
185
185
|
vivid: ({ primaryColor, secondaryColor }) => (jsxs(Fragment, { children: [jsx("path", { d: "M20.24 12.24a6 6 0 00-8.49-8.49L5 10.5V19h8.5z", fill: primaryColor }), jsx("path", { d: "M20.24 12.24a6 6 0 00-8.49-8.49L5 10.5V19h8.5z", fill: "white", opacity: "0.1" }), jsx("line", { x1: "16", y1: "8", x2: "2", y2: "22", stroke: secondaryColor, strokeWidth: "1.8" }), jsx("line", { x1: "17.5", y1: "15", x2: "9", y2: "15", stroke: "#F59E0B", strokeWidth: "1.5" })] })),
|
|
186
186
|
},
|
|
187
187
|
});
|
|
188
|
-
const NtdBug = createIcon({
|
|
188
|
+
const NtdBug = /* @__PURE__ */ createIcon({
|
|
189
189
|
displayName: 'NtdBug',
|
|
190
190
|
paths: {
|
|
191
191
|
solid: ({ primaryColor, accentColor, accentOpacity, strokeWidth }) => (jsxs(Fragment, { children: [jsx("rect", { x: "8", y: "6", width: "8", height: "14", rx: "4", fill: primaryColor }), jsx("line", { x1: "8", y1: "13", x2: "16", y2: "13", stroke: accentColor, strokeWidth: "1.5", opacity: accentOpacity }), jsx("path", { d: "M5 11H2", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M22 11h-3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M5 17H2", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M22 17h-3", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M8 6l-2-4", stroke: primaryColor, strokeWidth: strokeWidth }), jsx("path", { d: "M16 6l2-4", stroke: primaryColor, strokeWidth: strokeWidth })] })),
|
package/dist/esm/index.js
CHANGED
|
@@ -5,12 +5,12 @@ export { NiceIconPicker } from './NiceIconPicker.js';
|
|
|
5
5
|
export { AnimationController, InteractiveIcon, AnimationController as NiceAnimationController, InteractiveIcon as NiceInteractiveIcon, PRESET_INTERACTIONS, PRESET_SEQUENCES, createAnimationSequence, createClickAnimation, createHoverAnimation, createVisibilityAnimation, useAnimationSequence } from './animationControls.js';
|
|
6
6
|
export { batchExportIcons, copyIconToClipboard, downloadIconAsPng, downloadIconAsSvg, exportIconToDataUrl, exportIconToFigmaNode, exportIconToSvgString, generateFigmaPluginManifest } from './figmaExport.js';
|
|
7
7
|
export { NtdArrowDown, NtdArrowLeft, NtdArrowRight, NtdArrowUp, NtdChevronDown, NtdChevronLeft, NtdChevronRight, NtdChevronUp, NtdClose, NtdExternalLink, NtdMenu, NtdMoreHorizontal, NtdMoreVertical, NtdRefresh } from './icons/navigation.js';
|
|
8
|
-
export { NtdCheck, NtdClipboard, NtdCopy, NtdDownload, NtdEdit, NtdFilter, NtdLink, NtdLock, NtdLogIn, NtdLogOut, NtdMinus, NtdPlus, NtdPrint, NtdRedo, NtdSave, NtdSearch, NtdSettings, NtdShare, NtdSort, NtdTrash, NtdUndo, NtdUnlock, NtdUpload, NtdZoomIn, NtdZoomOut } from './icons/actions.js';
|
|
9
|
-
export { NtdBell, NtdBookmark, NtdCalendar, NtdClock, NtdCursor, NtdError, NtdEye, NtdEyeOff, NtdFlag, NtdGlobe, NtdHeart, NtdHelp, NtdHome, NtdInfo, NtdMap, NtdMoon, NtdPin, NtdShield, NtdStar, NtdSuccess, NtdSun, NtdTag, NtdThumbDown, NtdThumbUp, NtdUser, NtdUsers, NtdWarning, NtdWireframe } from './icons/ui.js';
|
|
8
|
+
export { NtdCheck, NtdClipboard, NtdCopy, NtdDownload, NtdEdit, NtdFilter, NtdLink, NtdLock, NtdLogIn, NtdLogOut, NtdMinus, NtdPlus, NtdPrint, NtdRedo, NtdReply, NtdSave, NtdSearch, NtdSettings, NtdShare, NtdSort, NtdTrash, NtdUndo, NtdUnlock, NtdUpload, NtdZoomIn, NtdZoomOut } from './icons/actions.js';
|
|
9
|
+
export { NtdBackspace, NtdBell, NtdBookmark, NtdCalendar, NtdClock, NtdCursor, NtdError, NtdEye, NtdEyeOff, NtdFlag, NtdGlobe, NtdHeart, NtdHelp, NtdHome, NtdInfo, NtdMap, NtdMoon, NtdPin, NtdShield, NtdStar, NtdSuccess, NtdSun, NtdTag, NtdThumbDown, NtdThumbUp, NtdUser, NtdUsers, NtdWarning, NtdWireframe } from './icons/ui.js';
|
|
10
10
|
export { NtdBiodegradable, NtdCarbonFootprint, NtdCo2, NtdCompost, NtdEcoFriendly, NtdEvCharger, NtdHydropower, NtdNetZero, NtdOrganic, NtdPlantTree, NtdRecycle, NtdSolarPanel, NtdTrashSort, NtdWildlife, NtdWindTurbine, sustainabilityIcons } from './icons/sustainability.js';
|
|
11
11
|
export { NtdAccessibility, NtdAssistiveTech, NtdAudioDescription, NtdBlind, NtdBraille, NtdClosedCaptions, NtdDeaf, NtdDyslexia, NtdEasyRead, NtdHearingAid, NtdScreenReader, NtdSignLanguage, NtdWheelchair, accessibilityIcons } from './icons/accessibility.js';
|
|
12
12
|
export { NtdAudit, NtdCcpa, NtdCertified, NtdCompliance, NtdContract, NtdCookieConsent, NtdCopyright, NtdGdpr, NtdLegalDocument, NtdPatent, NtdPrivacyPolicy, NtdTermsOfService, NtdTrademark, legalIcons } from './icons/legal.js';
|
|
13
|
-
export { NtdBluetooth, NtdBrush, NtdCamera, NtdChat, NtdImage, NtdMail, NtdMicrophone, NtdMusic, NtdNotification, NtdPalette, NtdPause, NtdPenTool, NtdPhone, NtdPlay, NtdSend, NtdSkipBack, NtdSkipForward, NtdSpline, NtdStop, NtdVideo, NtdVolume, NtdVolumeMute, NtdWifi } from './icons/media.js';
|
|
13
|
+
export { NtdBluetooth, NtdBrush, NtdCamera, NtdChat, NtdImage, NtdInbox, NtdMail, NtdMicrophone, NtdMicrophoneOff, NtdMusic, NtdNotification, NtdPalette, NtdPause, NtdPenTool, NtdPhone, NtdPlay, NtdSend, NtdSkipBack, NtdSkipForward, NtdSpline, NtdStop, NtdVideo, NtdVolume, NtdVolumeMute, NtdWifi } from './icons/media.js';
|
|
14
14
|
export { NtdActivity, NtdArchive, NtdAward, NtdBarChart, NtdCart, NtdCloud, NtdCloudDownload, NtdCloudUpload, NtdCode, NtdCoffee, NtdCpu, NtdCreditCard, NtdDatabase, NtdFile, NtdFileText, NtdFolder, NtdFolderOpen, NtdGit, NtdGrid, NtdKey, NtdLayers, NtdList, NtdMonitor, NtdPackage, NtdPieChart, NtdSmartphone, NtdTable, NtdTarget, NtdTerminal, NtdTruck, NtdZap } from './icons/files.js';
|
|
15
15
|
export { NtdCrown, NtdDice, NtdDumpsterFire, NtdGamepad, NtdGhost, NtdLightning, NtdPartyPopper, NtdPuzzle, NtdRocket, NtdSad, NtdSkull, NtdSmiley, NtdTrophy } from './icons/fun.js';
|
|
16
16
|
export { NtdAnchor, NtdBug, NtdCompass, NtdDroplet, NtdFeather, NtdFire, NtdFlower, NtdLeaf, NtdMountain, NtdRain, NtdSnow, NtdSnowflake, NtdSunrise, NtdSunset, NtdThermometer, NtdThunderstorm, NtdTree, NtdUmbrella, NtdWave, NtdWind } from './icons/weather.js';
|
|
@@ -91,7 +91,8 @@ function extractPaths(shapes, result) {
|
|
|
91
91
|
* Uses a lightweight built-in renderer for static frames.
|
|
92
92
|
* For animated playback, renders the first frame as a static fallback.
|
|
93
93
|
*/
|
|
94
|
-
const NtdLottieIcon =
|
|
94
|
+
const NtdLottieIcon = /* @__PURE__ */ Object.assign(
|
|
95
|
+
/* @__PURE__ */ forwardRef(({ data, size = 'md', autoplay: _autoplay = true, loop: _loop = true, speed: _speed = 1, frame: _frame, className, style, 'aria-label': ariaLabel, }, ref) => {
|
|
95
96
|
var _a;
|
|
96
97
|
const resolvedSize = typeof size === 'number' ? size : ((_a = SIZE_MAP[size]) !== null && _a !== void 0 ? _a : 24);
|
|
97
98
|
const svgRef = useRef(null);
|
|
@@ -111,8 +112,7 @@ const NtdLottieIcon = forwardRef(({ data, size = 'md', autoplay: _autoplay = tru
|
|
|
111
112
|
var _a, _b;
|
|
112
113
|
return (jsx("path", { d: p.d, fill: (_a = p.fill) !== null && _a !== void 0 ? _a : 'currentColor', stroke: (_b = p.stroke) !== null && _b !== void 0 ? _b : 'none', strokeWidth: p.strokeWidth }, i));
|
|
113
114
|
}) }));
|
|
114
|
-
});
|
|
115
|
-
NtdLottieIcon.displayName = 'NtdLottieIcon';
|
|
115
|
+
}), { displayName: 'NtdLottieIcon' });
|
|
116
116
|
/* ────────────────────────────────────────────────────────────────────────────
|
|
117
117
|
LOTTIE → ICON CONVERTER
|
|
118
118
|
───────────────────────────────────────────────────────────────────────────── */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.ntd-picker{--ntd-picker-border:var(--nice-border-color,#3a3a4a);--ntd-picker-radius:var(--nice-radius-lg,10px);--ntd-picker-bg:var(--nice-bg-elevated,#1e1e2a);--ntd-picker-text:var(--nice-text-primary,#f0f0f5);--ntd-picker-accent:var(--nice-color-primary,#6c5ce7);--ntd-picker-accent-hover:var(--nice-color-primary-hover,#5b4cdb);--ntd-picker-accent-alpha:var(--nice-primary-tint-20,rgba(108,92,231,.2));--ntd-picker-muted:var(--nice-text-muted,#606078);--ntd-picker-input-bg:var(--nice-bg-inset,#14141c);display:inline-block;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;position:relative}.ntd-picker-trigger{align-items:center;background:var(--ntd-picker-bg,#1e1e2a);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:var(--ntd-picker-radius,10px);color:var(--ntd-picker-text,#f0f0f5);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.875rem;gap:8px;min-width:160px;padding:8px 14px;transition:border-color .2s,box-shadow .2s;user-select:none}.ntd-picker-trigger:hover{border-color:var(--ntd-picker-accent,#6c5ce7)}.ntd-picker-trigger:focus-visible{border-color:var(--ntd-picker-accent,#6c5ce7);box-shadow:0 0 0 3px var(--ntd-picker-accent-alpha,rgba(108,92,231,.25));outline:none}.ntd-picker-trigger-icon{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));border-radius:6px;display:flex;flex-shrink:0;height:28px;justify-content:center;width:28px}.ntd-picker-trigger-label{flex:1;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.ntd-picker-trigger-chevron,.ntd-picker-trigger-placeholder{color:var(--ntd-picker-muted,#606078)}.ntd-picker-trigger-chevron{flex-shrink:0;transition:transform .2s}.ntd-picker.open .ntd-picker-trigger-chevron{transform:rotate(180deg)}.ntd-picker-dropdown{animation:ntd-picker-appear .2s ease-out;background:var(--ntd-picker-bg,#1e1e2a);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:var(--ntd-picker-radius,10px);box-shadow:0 12px 40px rgba(0,0,0,.4),0 4px 12px rgba(0,0,0,.2);display:flex;flex-direction:column;left:0;max-height:460px;overflow:hidden;position:absolute;top:calc(100% + 6px);width:380px;z-index:1000}@keyframes ntd-picker-appear{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-picker-search{border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);flex-shrink:0;padding:10px 12px;position:relative}.ntd-picker-search-icon{color:var(--ntd-picker-muted,#606078);left:22px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.ntd-picker-search input{background:var(--ntd-picker-input-bg,#14141c);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:8px;color:var(--ntd-picker-text,#f0f0f5);font-family:inherit;font-size:.82rem;outline:none;padding:8px 12px 8px 34px;transition:border-color .2s;width:100%}.ntd-picker-search input:focus{border-color:var(--ntd-picker-accent,#6c5ce7)}.ntd-picker-search input::placeholder{color:var(--ntd-picker-muted,#606078)}.ntd-picker-tabs{border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);display:flex;flex-shrink:0;gap:2px;overflow-x:auto;padding:6px 10px;scrollbar-width:none}.ntd-picker-tabs::-webkit-scrollbar{display:none}.ntd-picker-tab{background:transparent;border:none;border-radius:6px;color:var(--ntd-picker-muted,#606078);cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:500;letter-spacing:.03em;padding:5px 10px;text-transform:uppercase;transition:all .15s;white-space:nowrap}.ntd-picker-tab:hover{background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));color:var(--ntd-picker-text,#f0f0f5)}.ntd-picker-tab.active{background:var(--ntd-picker-accent,#6c5ce7);color:#fff}.ntd-picker-grid-wrap{flex:1;overflow-y:auto;padding:8px;scrollbar-color:var(--ntd-picker-border,#3a3a4a) transparent;scrollbar-width:thin}.ntd-picker-grid-wrap::-webkit-scrollbar{width:5px}.ntd-picker-grid-wrap::-webkit-scrollbar-track{background:transparent}.ntd-picker-grid-wrap::-webkit-scrollbar-thumb{background:var(--ntd-picker-border,#3a3a4a);border-radius:3px}.ntd-picker-category-label{color:var(--ntd-picker-muted,#606078);font-size:.68rem;font-weight:600;letter-spacing:.05em;margin-top:4px;padding:6px 4px 4px;text-transform:uppercase}.ntd-picker-category-label:first-child{margin-top:0}.ntd-picker-grid{display:grid;gap:4px;grid-template-columns:repeat(auto-fill,minmax(44px,1fr))}.ntd-picker-cell{align-items:center;aspect-ratio:1;background:transparent;border:none;border-radius:8px;color:var(--ntd-picker-text,#f0f0f5);cursor:pointer;display:flex;justify-content:center;position:relative;transition:all .15s;width:100%}.ntd-picker-cell:hover{background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));transform:scale(1.1)}.ntd-picker-cell.selected{background:var(--ntd-picker-accent,#6c5ce7);box-shadow:0 2px 8px var(--ntd-picker-accent-alpha,rgba(108,92,231,.25));color:#fff}.ntd-picker-cell:focus-visible{outline:2px solid var(--ntd-picker-accent,#6c5ce7);outline-offset:1px}.ntd-picker-cell:after{background:var(--ntd-picker-text,#f0f0f5);border-radius:5px;bottom:calc(100% + 6px);color:var(--ntd-picker-bg,#1e1e2a);content:attr(data-name);font-size:.65rem;font-weight:500;left:50%;opacity:0;padding:3px 8px;pointer-events:none;position:absolute;transform:translateX(-50%);transition:opacity .15s;white-space:nowrap;z-index:10}.ntd-picker-cell:hover:after{opacity:1}.ntd-picker-cell.draggable{cursor:grab}.ntd-picker-cell.draggable:active{cursor:grabbing}.ntd-picker-cell.draggable:hover:before{border:2px dashed var(--ntd-picker-accent,#6c5ce7);border-radius:8px;content:"";inset:0;opacity:.5;pointer-events:none;position:absolute}.ntd-picker-empty{color:var(--ntd-picker-muted,#606078);font-size:.82rem;padding:32px 16px;text-align:center}.ntd-picker-empty-icon{font-size:2rem;margin-bottom:8px;opacity:.4}.ntd-picker-footer{align-items:center;border-top:1px solid var(--ntd-picker-border,#3a3a4a);display:flex;flex-shrink:0;justify-content:space-between;padding:8px 12px}.ntd-picker-count{font-size:.7rem}.ntd-picker-clear,.ntd-picker-count{color:var(--ntd-picker-muted,#606078)}.ntd-picker-clear{background:transparent;border:none;border-radius:5px;cursor:pointer;font-family:inherit;font-size:.72rem;padding:4px 10px;transition:all .15s}.ntd-picker-clear:hover{background:rgba(255,80,80,.12);color:#ff5050}.ntd-picker-multi-badge{border-radius:10px;font-size:.7rem;font-weight:600;height:20px;min-width:20px;padding:0 6px}.ntd-picker-cell-check,.ntd-picker-multi-badge{align-items:center;background:var(--ntd-picker-accent,#6c5ce7);color:#fff;display:flex;justify-content:center}.ntd-picker-cell-check{border-radius:50%;height:16px;pointer-events:none;position:absolute;right:2px;top:2px;width:16px}.ntd-picker-cell.multi-select{position:relative}.ntd-picker-cell-fav{align-items:center;background:transparent;border:none;border-radius:50%;color:var(--ntd-picker-muted,#606078);cursor:pointer;display:flex;height:16px;justify-content:center;left:2px;opacity:0;padding:0;position:absolute;top:2px;transition:all .15s;width:16px}.ntd-picker-cell-fav.active,.ntd-picker-cell:hover .ntd-picker-cell-fav{opacity:1}.ntd-picker-cell-fav:hover{color:#feca57;transform:scale(1.2)}.ntd-picker-cell-fav.active{color:#feca57}.ntd-picker-tab-special{align-items:center;display:inline-flex;gap:4px}.ntd-picker-tab-special svg{height:10px;width:10px}.ntd-picker-tab-count{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.2));border-radius:8px;display:inline-flex;font-size:.65rem;font-weight:600;height:16px;justify-content:center;margin-left:2px;min-width:16px;padding:0 4px}.ntd-picker-tab.active .ntd-picker-tab-count{background:hsla(0,0%,100%,.2)}.ntd-picker-done{background:var(--ntd-picker-accent,#6c5ce7);border:none;border-radius:5px;color:#fff;cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:500;padding:4px 12px;transition:all .15s}.ntd-picker-done:hover{background:var(--ntd-picker-accent-hover,#5b4cdb);transform:translateY(-1px)}.ntd-picker.disabled .ntd-picker-trigger{cursor:not-allowed;opacity:.5}.ntd-picker.multi .ntd-picker-trigger{border-style:dashed}.ntd-icon{display:inline-block;flex-shrink:0;transition:color .2s ease,transform .2s ease;vertical-align:-.125em}.ntd-anim-spin{animation:ntd-spin 1s linear infinite}.ntd-anim-spin-reverse{animation:ntd-spin 1s linear infinite reverse}@keyframes ntd-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ntd-anim-pulse{animation:ntd-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes ntd-pulse{0%,to{opacity:1}50%{opacity:.4}}.ntd-anim-bounce{animation:ntd-bounce 1s ease infinite}@keyframes ntd-bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(0)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:translateY(-25%)}}.ntd-anim-shake{animation:ntd-shake .6s ease-in-out infinite}@keyframes ntd-shake{0%,to{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-2px)}20%,40%,60%,80%{transform:translateX(2px)}}.ntd-anim-float{animation:ntd-float 3s ease-in-out infinite}@keyframes ntd-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.ntd-anim-flip{animation:ntd-flip 1.2s ease-in-out infinite}@keyframes ntd-flip{0%{transform:perspective(400px) rotateY(0)}40%{transform:perspective(400px) rotateY(170deg)}50%{transform:perspective(400px) rotateY(190deg)}80%{transform:perspective(400px) rotateY(1turn)}to{transform:perspective(400px) rotateY(1turn)}}.ntd-anim-glow{animation:ntd-glow 2s ease-in-out infinite}@keyframes ntd-glow{0%,to{filter:drop-shadow(0 0 2px currentColor)}50%{filter:drop-shadow(0 0 12px currentColor) drop-shadow(0 0 20px currentColor)}}.ntd-anim-wiggle{animation:ntd-wiggle 1s ease-in-out infinite}@keyframes ntd-wiggle{0%,to{transform:rotate(0deg)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}.ntd-anim-rubber{animation:ntd-rubber 1s ease-in-out infinite}@keyframes ntd-rubber{0%{transform:scale(1)}30%{transform:scaleX(1.25) scaleY(.75)}40%{transform:scaleX(.75) scaleY(1.25)}50%{transform:scaleX(1.15) scaleY(.85)}65%{transform:scaleX(.95) scaleY(1.05)}75%{transform:scaleX(1.05) scaleY(.95)}to{transform:scale(1)}}.ntd-anim-swing{animation:ntd-swing 1s ease-in-out infinite;transform-origin:top center}@keyframes ntd-swing{20%{transform:rotate(15deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}to{transform:rotate(0deg)}}.ntd-anim-tada{animation:ntd-tada 1.2s ease-in-out infinite}@keyframes ntd-tada{0%{transform:scale(1) rotate(0deg)}10%,20%{transform:scale(.9) rotate(-3deg)}30%,50%,70%,90%{transform:scale(1.1) rotate(3deg)}40%,60%,80%{transform:scale(1.1) rotate(-3deg)}to{transform:scale(1) rotate(0deg)}}.ntd-anim-heartbeat{animation:ntd-heartbeat 1.2s ease-in-out infinite}@keyframes ntd-heartbeat{0%{transform:scale(1)}14%{transform:scale(1.3)}28%{transform:scale(1)}42%{transform:scale(1.3)}70%{transform:scale(1)}}.ntd-anim-fade-in{animation:ntd-fade-in .5s ease-out forwards}@keyframes ntd-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.ntd-anim-slide-up{animation:ntd-slide-up .4s ease-out forwards}@keyframes ntd-slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-jello{animation:ntd-jello 1s ease-in-out infinite}@keyframes ntd-jello{0%,to{transform:skewX(0deg) skewY(0deg)}11.1%{transform:skewX(-12.5deg) skewY(-12.5deg)}22.2%{transform:skewX(6.25deg) skewY(6.25deg)}33.3%{transform:skewX(-3.125deg) skewY(-3.125deg)}44.4%{transform:skewX(1.5625deg) skewY(1.5625deg)}55.5%{transform:skewX(-.78125deg) skewY(-.78125deg)}66.6%{transform:skewX(.390625deg) skewY(.390625deg)}77.7%{transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.ntd-anim-pop{animation:ntd-pop .6s ease-out infinite}@keyframes ntd-pop{0%{transform:scale(1)}15%{transform:scale(1.35)}30%{transform:scale(.9)}45%{transform:scale(1.1)}60%{transform:scale(.97)}75%{transform:scale(1.03)}to{transform:scale(1)}}.ntd-anim-squeeze{animation:ntd-squeeze 1.4s ease-in-out infinite}@keyframes ntd-squeeze{0%,to{transform:scaleX(1) scaleY(1)}25%{transform:scaleX(.7) scaleY(1.3)}50%{transform:scaleX(1) scaleY(1)}75%{transform:scaleX(1.3) scaleY(.7)}}.ntd-anim-drop{animation:ntd-drop .8s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-drop{0%{opacity:0;transform:translateY(-40px) scale(.8)}60%{opacity:1;transform:translateY(4px) scale(1.05)}75%{transform:translateY(-2px) scale(.98)}90%{transform:translateY(1px) scale(1.01)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-rise{animation:ntd-rise .7s cubic-bezier(.16,1,.3,1) forwards}@keyframes ntd-rise{0%{opacity:0;transform:translateY(30px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-slide-left{animation:ntd-slide-left .5s ease-out forwards}@keyframes ntd-slide-left{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-right{animation:ntd-slide-right .5s ease-out forwards}@keyframes ntd-slide-right{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-down{animation:ntd-slide-down .4s ease-out forwards}@keyframes ntd-slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-roll-in{animation:ntd-roll-in .8s ease-out forwards}@keyframes ntd-roll-in{0%{opacity:0;transform:translateX(-100%) rotate(-120deg)}to{opacity:1;transform:translateX(0) rotate(0deg)}}.ntd-anim-flash{animation:ntd-flash 1s ease-in-out infinite}@keyframes ntd-flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.ntd-anim-vibrate{animation:ntd-vibrate .3s linear infinite}@keyframes ntd-vibrate{0%{transform:translate(0)}20%{transform:translate(-1px,1px)}40%{transform:translate(1px,-1px)}60%{transform:translate(-1px,-1px)}80%{transform:translate(1px,1px)}to{transform:translate(0)}}.ntd-anim-wobble{animation:ntd-wobble 1.2s ease-in-out infinite}@keyframes ntd-wobble{0%{transform:translateX(0) rotate(0deg)}15%{transform:translateX(-15%) rotate(-5deg)}30%{transform:translateX(10%) rotate(3deg)}45%{transform:translateX(-10%) rotate(-3deg)}60%{transform:translateX(5%) rotate(2deg)}75%{transform:translateX(-3%) rotate(-1deg)}to{transform:translateX(0) rotate(0deg)}}.ntd-anim-spiral{animation:ntd-spiral 2s linear infinite}@keyframes ntd-spiral{0%{transform:rotate(0deg) scale(.8)}25%{transform:rotate(90deg) scale(1.1)}50%{transform:rotate(180deg) scale(.8)}75%{transform:rotate(270deg) scale(1.1)}to{transform:rotate(1turn) scale(.8)}}.ntd-anim-ping{animation:ntd-ping 1.5s ease-out infinite}@keyframes ntd-ping{0%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(1.6)}71%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1)}}.ntd-anim-flicker{animation:ntd-flicker 1.5s steps(1) infinite}@keyframes ntd-flicker{0%{opacity:1}4%{opacity:.3}8%{opacity:1}12%{opacity:.6}16%{opacity:1}20%{opacity:.2}22%{opacity:1}50%{opacity:1}52%{opacity:.4}54%{opacity:1}80%{opacity:1}82%{opacity:.3}85%{opacity:1}90%{opacity:.5}92%{opacity:1}}.ntd-anim-tilt{animation:ntd-tilt 2s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-tilt{0%,to{transform:rotate(0deg)}25%{transform:rotate(8deg)}75%{transform:rotate(-8deg)}}.ntd-anim-breathe{animation:ntd-breathe 4s ease-in-out infinite}@keyframes ntd-breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.08)}}.ntd-anim-drift{animation:ntd-drift 4s ease-in-out infinite}@keyframes ntd-drift{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(5px) rotate(1deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-5px) rotate(-1deg)}}.ntd-anim-orbit{animation:ntd-orbit 3s linear infinite}@keyframes ntd-orbit{0%{transform:translate(0)}25%{transform:translate(4px,-4px)}50%{transform:translateY(-6px)}75%{transform:translate(-4px,-4px)}to{transform:translate(0)}}.ntd-anim-crush{animation:ntd-crush .8s ease-in-out infinite}@keyframes ntd-crush{0%,to{transform:scaleY(1) scaleX(1)}40%{transform:scaleY(.3) scaleX(1.3)}60%{transform:scaleY(1.15) scaleX(.9)}80%{transform:scaleY(.95) scaleX(1.02)}}.ntd-anim-stretch{animation:ntd-stretch 1s ease-in-out infinite}@keyframes ntd-stretch{0%,to{transform:scaleY(1) scaleX(1)}30%{transform:scaleY(1.4) scaleX(.8)}50%{transform:scaleY(.85) scaleX(1.1)}70%{transform:scaleY(1.1) scaleX(.95)}}.ntd-anim-dissolve{animation:ntd-dissolve 2s ease-in-out infinite}@keyframes ntd-dissolve{0%,to{filter:blur(0);opacity:1}50%{filter:blur(4px);opacity:.1}}.ntd-anim-materialize{animation:ntd-materialize .8s ease-out forwards}@keyframes ntd-materialize{0%{filter:blur(8px);opacity:0;transform:scale(.6)}60%{filter:blur(1px);opacity:.8;transform:scale(1.05)}to{filter:blur(0);opacity:1;transform:scale(1)}}.ntd-anim-sway{animation:ntd-sway 2.5s ease-in-out infinite;transform-origin:top center}@keyframes ntd-sway{0%,to{transform:rotate(0deg)}20%{transform:rotate(12deg)}40%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-3deg)}}.ntd-anim-tremble{animation:ntd-tremble .15s linear infinite}@keyframes ntd-tremble{0%{transform:translate(0) rotate(0deg)}25%{transform:translate(-.5px,.5px) rotate(-.5deg)}50%{transform:translate(.5px,-.5px) rotate(.5deg)}75%{transform:translate(-.5px,-.5px) rotate(-.5deg)}to{transform:translate(0) rotate(0deg)}}.ntd-anim-rock{animation:ntd-rock 1.5s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-rock{0%,to{transform:rotate(0deg)}25%{transform:rotate(15deg)}75%{transform:rotate(-15deg)}}.ntd-anim-snap{animation:ntd-snap 1.5s ease-in-out infinite}@keyframes ntd-snap{0%,30%{transform:rotate(0deg)}50%{transform:rotate(190deg)}55%{transform:rotate(175deg)}60%{transform:rotate(182deg)}65%,to{transform:rotate(180deg)}}.ntd-anim-warp{animation:ntd-warp 2s ease-in-out infinite}@keyframes ntd-warp{0%,to{transform:perspective(300px) rotateX(0deg) rotateY(0deg)}25%{transform:perspective(300px) rotateX(10deg) rotateY(10deg)}50%{transform:perspective(300px) rotateX(-5deg) rotateY(-10deg)}75%{transform:perspective(300px) rotateX(8deg) rotateY(-5deg)}}.ntd-anim-glitch{animation:ntd-glitch .8s steps(1) infinite}@keyframes ntd-glitch{0%{transform:translate(0)}5%{transform:translate(-3px,2px) skewX(2deg)}10%{transform:translate(3px,-1px) skewX(-1deg)}15%{transform:translate(0)}40%{transform:translate(0)}42%{transform:translate(2px,1px) skewX(-3deg)}44%{transform:translate(-2px,-2px) skewX(1deg)}46%{transform:translate(0)}70%{transform:translate(0)}72%{transform:translate(-1px,3px) skewX(2deg)}74%{transform:translate(1px,-1px)}76%{transform:translate(0)}to{transform:translate(0)}}.ntd-anim-zoom-pulse{animation:ntd-zoom-pulse 1.5s ease-in-out infinite}@keyframes ntd-zoom-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.ntd-anim-ripple{animation:ntd-ripple 1.6s ease-out infinite}@keyframes ntd-ripple{0%{opacity:1;transform:scale(1)}30%{opacity:.8;transform:scale(1.15)}50%{opacity:1;transform:scale(1)}70%{opacity:.9;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}.ntd-anim-implode{animation:ntd-implode 1.2s ease-in-out infinite}@keyframes ntd-implode{0%,to{opacity:1;transform:scale(1)}40%{opacity:.3;transform:scale(.2) rotate(20deg)}60%{opacity:.2;transform:scale(.15) rotate(25deg)}80%{opacity:1;transform:scale(1.1) rotate(0deg)}}.ntd-anim-explode{animation:ntd-explode 1.4s ease-in-out infinite}@keyframes ntd-explode{0%,to{opacity:1;transform:scale(1)}30%{opacity:.6;transform:scale(1.8)}50%{opacity:0;transform:scale(2)}51%{opacity:0;transform:scale(.5)}70%{opacity:.8;transform:scale(1.1)}85%{opacity:1;transform:scale(.95)}}.ntd-anim-rotate-x{animation:ntd-rotate-x 1.5s ease-in-out infinite}@keyframes ntd-rotate-x{0%{transform:perspective(400px) rotateX(0deg)}to{transform:perspective(400px) rotateX(1turn)}}.ntd-anim-morph{animation:ntd-morph 3s ease-in-out infinite}@keyframes ntd-morph{0%,to{border-radius:0;transform:scaleX(1) scaleY(1) rotate(0deg)}20%{transform:scaleX(1.1) scaleY(.9) rotate(2deg)}40%{transform:scaleX(.9) scaleY(1.1) rotate(-1deg)}60%{transform:scaleX(1.05) scaleY(.95) rotate(1deg)}80%{transform:scaleX(.95) scaleY(1.05) rotate(-2deg)}}.ntd-anim-levitate{animation:ntd-levitate 3s ease-in-out infinite}@keyframes ntd-levitate{0%,to{filter:drop-shadow(0 2px 2px rgba(0,0,0,.2));transform:translateY(0)}50%{filter:drop-shadow(0 12px 8px rgba(0,0,0,.1));transform:translateY(-10px)}}.ntd-anim-dash{animation:ntd-dash .8s ease-in-out infinite}@keyframes ntd-dash{0%,to{opacity:1;transform:translateX(0) scaleX(1)}30%{opacity:.8;transform:translateX(-3px) scaleX(.9)}60%{opacity:.6;transform:translateX(15px) scaleX(1.15)}80%{opacity:.9;transform:translateX(2px) scaleX(1)}}.ntd-anim-twist{animation:ntd-twist 1.5s ease-in-out infinite}@keyframes ntd-twist{0%,to{transform:rotate(0deg) scale(1)}25%{transform:rotate(30deg) scale(.9)}50%{transform:rotate(0deg) scale(1.05)}75%{transform:rotate(-30deg) scale(.9)}}.ntd-anim-stomp{animation:ntd-stomp 1s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-stomp{0%,to{transform:translateY(0) scaleY(1) scaleX(1)}20%{transform:translateY(-15px) scaleY(1.1) scaleX(.95)}50%{transform:translateY(0) scaleY(.7) scaleX(1.2)}65%{transform:translateY(-3px) scaleY(1.05) scaleX(.98)}80%{transform:translateY(0) scaleY(.95) scaleX(1.03)}}.ntd-anim-flap{animation:ntd-flap .6s ease-in-out infinite}@keyframes ntd-flap{0%,to{transform:perspective(400px) rotateX(0deg) translateY(0)}50%{transform:perspective(400px) rotateX(25deg) translateY(-5px)}}.ntd-anim-skate{animation:ntd-skate 2s ease-in-out infinite}@keyframes ntd-skate{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(8px) rotate(2deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-8px) rotate(-2deg)}}.ntd-anim-blink{animation:ntd-blink 1.4s steps(1) infinite}@keyframes ntd-blink{0%,49%{opacity:1}50%,99%{opacity:0}}.ntd-anim-reveal{animation:ntd-reveal 1s ease-out forwards}@keyframes ntd-reveal{0%{clip-path:circle(0 at 50% 50%);opacity:.5}to{clip-path:circle(75% at 50% 50%);opacity:1}}.ntd-anim-vortex{animation:ntd-vortex .8s ease-out forwards}@keyframes ntd-vortex{0%{opacity:0;transform:rotate(-540deg) scale(0)}60%{opacity:1;transform:rotate(20deg) scale(1.1)}80%{transform:rotate(-10deg) scale(.95)}to{opacity:1;transform:rotate(0deg) scale(1)}}.ntd-anim-meteor{animation:ntd-meteor .7s ease-out forwards}@keyframes ntd-meteor{0%{opacity:0;transform:translate(30px,-30px) rotate(15deg) scale(.5)}70%{opacity:1;transform:translate(-2px,2px) rotate(-2deg) scale(1.05)}to{opacity:1;transform:translate(0) rotate(0deg) scale(1)}}.ntd-anim-scale-in{animation:ntd-scale-in .5s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-scale-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.ntd-anim-scale-out{animation:ntd-scale-out .4s ease-in forwards}@keyframes ntd-scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.ntd-anim-pendulum{animation:ntd-pendulum 2s ease-in-out infinite;transform-origin:top center}@keyframes ntd-pendulum{0%{transform:rotate(0deg)}25%{transform:rotate(25deg)}50%{transform:rotate(0deg)}75%{transform:rotate(-25deg)}to{transform:rotate(0deg)}}.ntd-anim-surge{animation:ntd-surge 1.5s ease-in-out infinite}@keyframes ntd-surge{0%,to{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}15%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor);transform:scale(1.2)}30%{filter:drop-shadow(0 0 2px currentColor);transform:scale(.95)}45%{filter:drop-shadow(0 0 6px currentColor);transform:scale(1.1)}60%{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}}.ntd-anim-radar{animation:ntd-radar 2s linear infinite}@keyframes ntd-radar{0%{opacity:1;transform:rotate(0deg)}50%{opacity:.4}to{opacity:1;transform:rotate(1turn)}}.ntd-anim-typewriter{animation:ntd-typewriter 1s steps(12) forwards}@keyframes ntd-typewriter{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}.ntd-anim-unfold{animation:ntd-unfold .7s ease-out forwards}@keyframes ntd-unfold{0%{opacity:.3;transform:scaleY(.05) scaleX(1.3)}50%{opacity:.9;transform:scaleY(1.1) scaleX(.95)}70%{opacity:1;transform:scaleY(.95) scaleX(1.02)}to{opacity:1;transform:scaleY(1) scaleX(1)}}.ntd-anim-fold{animation:ntd-fold .6s ease-in forwards}@keyframes ntd-fold{0%{opacity:1;transform:scaleY(1) scaleX(1)}to{opacity:0;transform:scaleY(.05) scaleX(1.3)}}.ntd-anim-scatter{animation:ntd-scatter 1.5s ease-in-out infinite}@keyframes ntd-scatter{0%,to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}20%{filter:blur(2px);opacity:.6;transform:scale(1.3) rotate(5deg)}40%{filter:blur(4px);opacity:.2;transform:scale(1.5) rotate(-3deg)}50%{filter:blur(6px);opacity:0;transform:scale(.8) rotate(0deg)}65%{filter:blur(3px);opacity:.3;transform:scale(.6) rotate(-5deg)}80%{filter:blur(1px);opacity:.8;transform:scale(.95) rotate(2deg)}}.ntd-anim-assemble{animation:ntd-assemble 1s ease-out forwards}@keyframes ntd-assemble{0%{filter:blur(8px);opacity:0;transform:scale(2) rotate(15deg)}30%{filter:blur(3px);opacity:.5;transform:scale(.8) rotate(-5deg)}60%{filter:blur(1px);opacity:.9;transform:scale(1.1) rotate(2deg)}80%{filter:blur(0);opacity:1;transform:scale(.97) rotate(-1deg)}to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}}.ntd-anim-neon{animation:ntd-neon 2s ease-in-out infinite}@keyframes ntd-neon{0%,to{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}10%{filter:drop-shadow(0 0 0 currentColor);opacity:.4}11%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}15%{filter:drop-shadow(0 0 0 currentColor);opacity:.3}16%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}50%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor) drop-shadow(0 0 24px currentColor);opacity:1}}.ntd-anim-earthquake{animation:ntd-earthquake .5s ease-in-out infinite}@keyframes ntd-earthquake{0%,to{transform:translate(0)}10%{transform:translate(-4px,2px) rotate(-1deg)}20%{transform:translate(3px,-3px) rotate(1deg)}30%{transform:translate(-2px,4px) rotate(-2deg)}40%{transform:translate(4px,-1px) rotate(2deg)}50%{transform:translate(-3px,3px) rotate(-1deg)}60%{transform:translate(2px,-4px) rotate(1deg)}70%{transform:translate(-4px,1px) rotate(-2deg)}80%{transform:translate(3px,2px) rotate(2deg)}90%{transform:translate(-1px,-3px) rotate(-1deg)}}.ntd-anim-signature{animation:ntd-signature-enter .65s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-signature circle,.ntd-anim-signature ellipse,.ntd-anim-signature line,.ntd-anim-signature path,.ntd-anim-signature polygon,.ntd-anim-signature polyline,.ntd-anim-signature rect{stroke-dasharray:150;stroke-dashoffset:150;animation:ntd-signature-stroke 1.7s ease-out .05s forwards,ntd-signature-fill .55s ease-out 1.05s forwards;filter:drop-shadow(0 0 0 currentColor)}@keyframes ntd-signature-enter{0%{opacity:.08;transform:scale(.05) rotate(-8deg)}60%{opacity:1;transform:scale(1.06) rotate(0deg)}to{opacity:1;transform:scale(1)}}@keyframes ntd-signature-stroke{0%{stroke-dashoffset:150;filter:drop-shadow(0 0 0 currentColor)}65%{stroke-dashoffset:0;filter:drop-shadow(0 0 6px currentColor)}to{stroke-dashoffset:0;filter:drop-shadow(0 0 2px currentColor)}}@keyframes ntd-signature-fill{0%{fill-opacity:.05}to{fill-opacity:1}}.ntd-anim-draw-sequence circle,.ntd-anim-draw-sequence ellipse,.ntd-anim-draw-sequence line,.ntd-anim-draw-sequence path,.ntd-anim-draw-sequence polygon,.ntd-anim-draw-sequence polyline,.ntd-anim-draw-sequence rect{stroke-dasharray:160;stroke-dashoffset:160;fill-opacity:0;animation:ntd-draw-sequence 1.6s ease-out forwards}.ntd-anim-draw-sequence circle:first-child,.ntd-anim-draw-sequence ellipse:first-child,.ntd-anim-draw-sequence line:first-child,.ntd-anim-draw-sequence path:first-child,.ntd-anim-draw-sequence polygon:first-child,.ntd-anim-draw-sequence polyline:first-child,.ntd-anim-draw-sequence rect:first-child{animation-delay:0s}.ntd-anim-draw-sequence circle:nth-child(2),.ntd-anim-draw-sequence ellipse:nth-child(2),.ntd-anim-draw-sequence line:nth-child(2),.ntd-anim-draw-sequence path:nth-child(2),.ntd-anim-draw-sequence polygon:nth-child(2),.ntd-anim-draw-sequence polyline:nth-child(2),.ntd-anim-draw-sequence rect:nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence circle:nth-child(3),.ntd-anim-draw-sequence ellipse:nth-child(3),.ntd-anim-draw-sequence line:nth-child(3),.ntd-anim-draw-sequence path:nth-child(3),.ntd-anim-draw-sequence polygon:nth-child(3),.ntd-anim-draw-sequence polyline:nth-child(3),.ntd-anim-draw-sequence rect:nth-child(3){animation-delay:.4s}@keyframes ntd-draw-sequence{0%{stroke-dashoffset:160;fill-opacity:0}75%{stroke-dashoffset:0;fill-opacity:.15}to{stroke-dashoffset:0;fill-opacity:1}}.ntd-anim-stroke-order circle,.ntd-anim-stroke-order ellipse,.ntd-anim-stroke-order line,.ntd-anim-stroke-order path,.ntd-anim-stroke-order polygon,.ntd-anim-stroke-order polyline,.ntd-anim-stroke-order rect{stroke-dasharray:220;stroke-dashoffset:220;animation:ntd-stroke-order 2s linear forwards}@keyframes ntd-stroke-order{0%{stroke-dashoffset:220;opacity:.2}30%{opacity:1}to{stroke-dashoffset:0;opacity:1}}.ntd-anim-glow-trace circle,.ntd-anim-glow-trace ellipse,.ntd-anim-glow-trace line,.ntd-anim-glow-trace path,.ntd-anim-glow-trace polygon,.ntd-anim-glow-trace polyline,.ntd-anim-glow-trace rect{stroke-dasharray:180;animation:ntd-glow-trace 2.8s ease-in-out infinite}@keyframes ntd-glow-trace{0%{stroke-dashoffset:180;filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{stroke-dashoffset:0;filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 14px currentColor);opacity:1}to{stroke-dashoffset:-180;filter:drop-shadow(0 0 2px currentColor);opacity:.5}}.ntd-anim-seal-stamp{animation:ntd-seal-stamp .75s cubic-bezier(.22,1,.36,1) forwards;transform-origin:center}@keyframes ntd-seal-stamp{0%{filter:blur(2px);opacity:0;transform:translateY(-14px) scale(1.25) rotate(-4deg)}45%{filter:blur(0);opacity:1;transform:translateY(2px) scale(.94) rotate(0deg)}70%{transform:translateY(-1px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-draw circle,.ntd-anim-draw ellipse,.ntd-anim-draw line,.ntd-anim-draw path,.ntd-anim-draw polygon,.ntd-anim-draw polyline,.ntd-anim-draw rect{stroke-dasharray:120;stroke-dashoffset:120;fill-opacity:0;animation:ntd-draw-stroke 1.2s ease-out forwards,ntd-draw-fill .4s ease-out .8s forwards}@keyframes ntd-draw-stroke{0%{stroke-dashoffset:120}to{stroke-dashoffset:0}}@keyframes ntd-draw-fill{0%{fill-opacity:0}to{fill-opacity:1}}.ntd-anim-draw-from-dot{animation:ntd-draw-dot-enter .45s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-draw-from-dot circle,.ntd-anim-draw-from-dot ellipse,.ntd-anim-draw-from-dot line,.ntd-anim-draw-from-dot path,.ntd-anim-draw-from-dot polygon,.ntd-anim-draw-from-dot polyline,.ntd-anim-draw-from-dot rect{stroke-dasharray:140;stroke-dashoffset:140;fill-opacity:0;animation:ntd-draw-dot-stroke 1.35s ease-out .15s forwards,ntd-draw-fill .45s ease-out .95s forwards}@keyframes ntd-draw-dot-enter{0%{opacity:.15;transform:scale(.08)}60%{opacity:1;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes ntd-draw-dot-stroke{0%{stroke-dashoffset:140}to{stroke-dashoffset:0}}.ntd-anim-draw-loop circle,.ntd-anim-draw-loop ellipse,.ntd-anim-draw-loop line,.ntd-anim-draw-loop path,.ntd-anim-draw-loop polygon,.ntd-anim-draw-loop polyline,.ntd-anim-draw-loop rect{stroke-dasharray:140;animation:ntd-draw-loop-stroke 2.4s ease-in-out infinite}@keyframes ntd-draw-loop-stroke{0%{stroke-dashoffset:140;opacity:0}25%{stroke-dashoffset:0;opacity:1}60%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-140;opacity:.2}}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-shape-pop .7s cubic-bezier(.34,1.56,.64,1) .35s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.5s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.65s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.8s}@keyframes ntd-draw-shape-pop{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);transform:scale(.5)}60%{fill-opacity:.9;clip-path:circle(75% at 50% 50%);transform:scale(1.08)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-dot-shape-burst .65s cubic-bezier(.34,1.56,.64,1) .25s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.4s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.55s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.7s}@keyframes ntd-draw-dot-shape-burst{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);transform:scale(.1)}50%{fill-opacity:.85;clip-path:circle(65% at 50% 50%);transform:scale(1.14)}75%{clip-path:circle(88% at 50% 50%);transform:scale(.97)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-seq-shape-wipe .6s cubic-bezier(.22,1,.36,1) forwards;clip-path:inset(100% 0 0 0);transform-box:fill-box;transform-origin:center bottom}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):first-child{animation-delay:0s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.4s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.6s}@keyframes ntd-draw-seq-shape-wipe{0%{fill-opacity:0;clip-path:inset(100% 0 0 0);transform:scaleY(.6)}70%{fill-opacity:.9;clip-path:inset(5% 0 0 0);transform:scaleY(1.04)}to{fill-opacity:1;clip-path:inset(0 0 0 0);transform:scaleY(1)}}.ntd-anim-draw-loop :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-draw-loop-shape-pulse 2.4s ease-in-out infinite}@keyframes ntd-draw-loop-shape-pulse{0%{clip-path:circle(0 at 50% 50%);opacity:0}25%{clip-path:circle(100% at 50% 50%);opacity:1}60%{clip-path:circle(100% at 50% 50%);opacity:1}to{clip-path:circle(0 at 50% 50%);opacity:.2}}.ntd-anim-signature :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-signature-shape-stamp .8s cubic-bezier(.22,1,.36,1) .5s forwards;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform-box:fill-box;transform-origin:center}@keyframes ntd-signature-shape-stamp{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform:scale(.35) rotate(-6deg)}55%{fill-opacity:.85;clip-path:circle(70% at 50% 50%);filter:drop-shadow(0 0 8px currentColor);transform:scale(1.08) rotate(0deg)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 2px currentColor);transform:scale(1)}}.ntd-anim-stroke-order :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-stroke-order-shape-wipe 1.2s ease-out .3s forwards;clip-path:inset(0 100% 0 0)}@keyframes ntd-stroke-order-shape-wipe{0%{fill-opacity:0;clip-path:inset(0 100% 0 0)}40%{fill-opacity:.7}to{fill-opacity:1;clip-path:inset(0 0 0 0)}}.ntd-anim-glow-trace :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-glow-trace-shape 2.8s ease-in-out infinite}@keyframes ntd-glow-trace-shape{0%{clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 0 16px currentColor);opacity:1}to{clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 2px currentColor);opacity:.4}}
|
|
1
|
+
.ntd-picker{--ntd-picker-border:var(--nice-border-color,#3a3a4a);--ntd-picker-radius:var(--nice-radius-lg,10px);--ntd-picker-bg:var(--nice-bg-elevated,#1e1e2a);--ntd-picker-text:var(--nice-text-primary,#f0f0f5);--ntd-picker-accent:var(--nice-color-primary,#6c5ce7);--ntd-picker-accent-hover:var(--nice-color-primary-hover,#5b4cdb);--ntd-picker-accent-alpha:var(--nice-primary-tint-20,rgba(108,92,231,.2));--ntd-picker-muted:var(--nice-text-muted,#606078);--ntd-picker-input-bg:var(--nice-bg-inset,#14141c);display:inline-block;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;position:relative}.ntd-picker-trigger{align-items:center;background:var(--ntd-picker-bg,#1e1e2a);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:var(--ntd-picker-radius,10px);color:var(--ntd-picker-text,#f0f0f5);cursor:pointer;display:inline-flex;font-family:inherit;font-size:.875rem;gap:8px;min-width:160px;padding:8px 14px;transition:border-color .2s,box-shadow .2s;user-select:none}.ntd-picker-trigger:hover{border-color:var(--ntd-picker-accent,#6c5ce7)}.ntd-picker-trigger:focus-visible{border-color:var(--ntd-picker-accent,#6c5ce7);box-shadow:0 0 0 3px var(--ntd-picker-accent-alpha,rgba(108,92,231,.25));outline:none}.ntd-picker-trigger-icon{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));border-radius:6px;display:flex;flex-shrink:0;height:28px;justify-content:center;width:28px}.ntd-picker-trigger-label{flex:1;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.ntd-picker-trigger-chevron,.ntd-picker-trigger-placeholder{color:var(--ntd-picker-muted,#606078)}.ntd-picker-trigger-chevron{flex-shrink:0;transition:transform .2s}.ntd-picker.ntd-picker--open .ntd-picker-trigger-chevron{transform:rotate(180deg)}.ntd-picker-dropdown{animation:ntd-picker-appear .2s ease-out;background:var(--ntd-picker-bg,#1e1e2a);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:var(--ntd-picker-radius,10px);box-shadow:0 12px 40px rgba(0,0,0,.4),0 4px 12px rgba(0,0,0,.2);display:flex;flex-direction:column;left:0;max-height:460px;overflow:hidden;position:absolute;top:calc(100% + 6px);width:380px;z-index:1000}@keyframes ntd-picker-appear{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-picker-search{border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);flex-shrink:0;padding:10px 12px;position:relative}.ntd-picker-search-icon{color:var(--ntd-picker-muted,#606078);left:22px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.ntd-picker-search input{background:var(--ntd-picker-input-bg,#14141c);border:1px solid var(--ntd-picker-border,#3a3a4a);border-radius:8px;color:var(--ntd-picker-text,#f0f0f5);font-family:inherit;font-size:.82rem;outline:none;padding:8px 12px 8px 34px;transition:border-color .2s;width:100%}.ntd-picker-search input:focus{border-color:var(--ntd-picker-accent,#6c5ce7)}.ntd-picker-search input::placeholder{color:var(--ntd-picker-muted,#606078)}.ntd-picker-tabs{border-bottom:1px solid var(--ntd-picker-border,#3a3a4a);display:flex;flex-shrink:0;gap:2px;overflow-x:auto;padding:6px 10px;scrollbar-width:none}.ntd-picker-tabs::-webkit-scrollbar{display:none}.ntd-picker-tab{background:transparent;border:none;border-radius:6px;color:var(--ntd-picker-muted,#606078);cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:500;letter-spacing:.03em;padding:5px 10px;text-transform:uppercase;transition:all .15s;white-space:nowrap}.ntd-picker-tab:hover{background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));color:var(--ntd-picker-text,#f0f0f5)}.ntd-picker-tab.ntd-picker-tab--active{background:var(--ntd-picker-accent,#6c5ce7);color:#fff}.ntd-picker-grid-wrap{flex:1;overflow-y:auto;padding:8px;scrollbar-color:var(--ntd-picker-border,#3a3a4a) transparent;scrollbar-width:thin}.ntd-picker-grid-wrap::-webkit-scrollbar{width:5px}.ntd-picker-grid-wrap::-webkit-scrollbar-track{background:transparent}.ntd-picker-grid-wrap::-webkit-scrollbar-thumb{background:var(--ntd-picker-border,#3a3a4a);border-radius:3px}.ntd-picker-category-label{color:var(--ntd-picker-muted,#606078);font-size:.68rem;font-weight:600;letter-spacing:.05em;margin-top:4px;padding:6px 4px 4px;text-transform:uppercase}.ntd-picker-category-label:first-child{margin-top:0}.ntd-picker-grid{display:grid;gap:4px;grid-template-columns:repeat(auto-fill,minmax(44px,1fr))}.ntd-picker-cell{align-items:center;aspect-ratio:1;background:transparent;border:none;border-radius:8px;color:var(--ntd-picker-text,#f0f0f5);cursor:pointer;display:flex;justify-content:center;position:relative;transition:all .15s;width:100%}.ntd-picker-cell:hover{background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.12));transform:scale(1.1)}.ntd-picker-cell.ntd-picker-cell--selected{background:var(--ntd-picker-accent,#6c5ce7);box-shadow:0 2px 8px var(--ntd-picker-accent-alpha,rgba(108,92,231,.25));color:#fff}.ntd-picker-cell:focus-visible{outline:2px solid var(--ntd-picker-accent,#6c5ce7);outline-offset:1px}.ntd-picker-cell:after{background:var(--ntd-picker-text,#f0f0f5);border-radius:5px;bottom:calc(100% + 6px);color:var(--ntd-picker-bg,#1e1e2a);content:attr(data-name);font-size:.65rem;font-weight:500;left:50%;opacity:0;padding:3px 8px;pointer-events:none;position:absolute;transform:translateX(-50%);transition:opacity .15s;white-space:nowrap;z-index:10}.ntd-picker-cell:hover:after{opacity:1}.ntd-picker-cell.ntd-picker-cell--draggable{cursor:grab}.ntd-picker-cell.ntd-picker-cell--draggable:active{cursor:grabbing}.ntd-picker-cell.ntd-picker-cell--draggable:hover:before{border:2px dashed var(--ntd-picker-accent,#6c5ce7);border-radius:8px;content:"";inset:0;opacity:.5;pointer-events:none;position:absolute}.ntd-picker-empty{color:var(--ntd-picker-muted,#606078);font-size:.82rem;padding:32px 16px;text-align:center}.ntd-picker-empty-icon{font-size:2rem;margin-bottom:8px;opacity:.4}.ntd-picker-footer{align-items:center;border-top:1px solid var(--ntd-picker-border,#3a3a4a);display:flex;flex-shrink:0;justify-content:space-between;padding:8px 12px}.ntd-picker-count{font-size:.7rem}.ntd-picker-clear,.ntd-picker-count{color:var(--ntd-picker-muted,#606078)}.ntd-picker-clear{background:transparent;border:none;border-radius:5px;cursor:pointer;font-family:inherit;font-size:.72rem;padding:4px 10px;transition:all .15s}.ntd-picker-clear:hover{background:rgba(255,80,80,.12);color:#ff5050}.ntd-picker-multi-badge{border-radius:10px;font-size:.7rem;font-weight:600;height:20px;min-width:20px;padding:0 6px}.ntd-picker-cell-check,.ntd-picker-multi-badge{align-items:center;background:var(--ntd-picker-accent,#6c5ce7);color:#fff;display:flex;justify-content:center}.ntd-picker-cell-check{border-radius:50%;height:16px;pointer-events:none;position:absolute;right:2px;top:2px;width:16px}.ntd-picker-cell.ntd-picker-cell--multi-select{position:relative}.ntd-picker-cell-fav{align-items:center;background:transparent;border:none;border-radius:50%;color:var(--ntd-picker-muted,#606078);cursor:pointer;display:flex;height:16px;justify-content:center;left:2px;opacity:0;padding:0;position:absolute;top:2px;transition:all .15s;width:16px}.ntd-picker-cell-fav.ntd-picker-cell-fav--active,.ntd-picker-cell:hover .ntd-picker-cell-fav{opacity:1}.ntd-picker-cell-fav:hover{color:#feca57;transform:scale(1.2)}.ntd-picker-cell-fav.ntd-picker-cell-fav--active{color:#feca57}.ntd-picker-tab-special{align-items:center;display:inline-flex;gap:4px}.ntd-picker-tab-special svg{height:10px;width:10px}.ntd-picker-tab-count{align-items:center;background:var(--ntd-picker-accent-alpha,rgba(108,92,231,.2));border-radius:8px;display:inline-flex;font-size:.65rem;font-weight:600;height:16px;justify-content:center;margin-left:2px;min-width:16px;padding:0 4px}.ntd-picker-tab.ntd-picker-tab--active .ntd-picker-tab-count{background:hsla(0,0%,100%,.2)}.ntd-picker-done{background:var(--ntd-picker-accent,#6c5ce7);border:none;border-radius:5px;color:#fff;cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:500;padding:4px 12px;transition:all .15s}.ntd-picker-done:hover{background:var(--ntd-picker-accent-hover,#5b4cdb);transform:translateY(-1px)}.ntd-picker.ntd-picker--disabled .ntd-picker-trigger{cursor:not-allowed;opacity:.5}.ntd-picker.ntd-picker--multi .ntd-picker-trigger{border-style:dashed}.nice-desktop-icon-exporter{color:var(--nice-text-primary,inherit);display:grid;font-size:var(--nice-font-size-sm,.8125rem);gap:var(--nice-space-4,16px);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));min-width:0}.nice-desktop-icon-exporter :where(h3,h4){font-weight:var(--nice-font-weight-semibold,600);margin:0 0 var(--nice-space-2,8px)}.nice-desktop-icon-exporter :where(h3){font-size:var(--nice-font-size-md,.875rem)}.nice-desktop-icon-exporter :where(h4){color:var(--nice-text-secondary,#64748b);font-size:var(--nice-font-size-xs,.75rem)}.nice-desktop-icon-exporter :where(button){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);color:var(--nice-text-primary,inherit);cursor:pointer;font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-3,12px)}.nice-desktop-icon-exporter :where(button:hover:not(:disabled)){background:var(--nice-bg-secondary,#f8fafc)}.nice-desktop-icon-exporter :where(button:disabled){cursor:not-allowed;opacity:.5}.nice-desktop-icon-exporter :where(input[type=text]){background:var(--nice-bg-primary,#fff);border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);box-sizing:border-box;color:var(--nice-text-primary,inherit);font:inherit;padding:var(--nice-space-1-5,6px) var(--nice-space-2,8px)}.nice-desktop-icon-exporter :where(input[type=range]){accent-color:var(--nice-color-primary,#3b82f6)}.nice-desktop-icon-exporter :where(button,input):focus-visible{box-shadow:var(--nice-focus-ring,0 0 0 2px var(--nice-color-primary,#3b82f6));outline:none}.nice-desktop-icon-exporter__config,.nice-desktop-icon-exporter__preview,.nice-desktop-icon-exporter__results{background:var(--nice-bg-elevated,var(--nice-bg-primary,#fff));border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-lg,8px);min-width:0;padding:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-grid{align-items:flex-end;display:flex;flex-wrap:wrap;gap:var(--nice-space-3,12px)}.nice-desktop-icon-exporter__preview-item{align-items:center;color:var(--nice-text-muted,#94a3b8);display:flex;flex-direction:column;font-size:var(--nice-font-size-xs,.75rem);font-variant-numeric:tabular-nums;gap:var(--nice-space-1,4px)}.nice-desktop-icon-exporter__preview-box{align-items:center;border-radius:var(--nice-radius-sm,4px);display:flex;justify-content:center}.nice-desktop-icon-exporter__config{display:flex;flex-direction:column;gap:var(--nice-space-2-5,10px)}.nice-desktop-icon-exporter__config>label{align-items:center;color:var(--nice-text-secondary,#64748b);display:flex;flex-wrap:wrap;font-weight:var(--nice-font-weight-medium,500);gap:var(--nice-space-2,8px)}.nice-desktop-icon-exporter__config>label>input[type=range],.nice-desktop-icon-exporter__config>label>input[type=text]{flex:1 1 140px;min-width:0}.nice-desktop-icon-exporter__platforms,.nice-desktop-icon-exporter__sizes{display:flex;flex-wrap:wrap;gap:var(--nice-space-1-5,6px) var(--nice-space-4,16px)}.nice-desktop-icon-exporter__sizes>h4{flex-basis:100%;margin:0}.nice-desktop-icon-exporter__platforms label,.nice-desktop-icon-exporter__sizes label{align-items:center;cursor:pointer;display:inline-flex;gap:var(--nice-space-1-5,6px)}.nice-desktop-icon-exporter__actions{display:flex;flex-wrap:wrap;gap:var(--nice-space-2,8px);grid-column:1/-1}.nice-desktop-icon-exporter__actions>button:first-child{background:var(--nice-color-primary,#3b82f6);border-color:var(--nice-color-primary,#3b82f6);color:var(--nice-text-on-primary,#fff);font-weight:var(--nice-font-weight-medium,500)}.nice-desktop-icon-exporter__results{grid-column:1/-1}.nice-desktop-icon-exporter__results-grid{display:grid;gap:var(--nice-space-2,8px);grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.nice-desktop-icon-exporter__result-item{align-items:center;border:1px solid var(--nice-border-color,#e2e8f0);border-radius:var(--nice-radius-md,6px);display:flex;flex-direction:column;gap:var(--nice-space-1,4px);padding:var(--nice-space-2,8px);text-align:center}.nice-desktop-icon-exporter__result-item>img{max-height:64px;max-width:64px}.nice-desktop-icon-exporter__result-item>span{color:var(--nice-text-secondary,#64748b);font-family:var(--nice-font-mono,ui-monospace,monospace);font-size:var(--nice-font-size-xxs,.625rem);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ntd-icon{display:inline-block;flex-shrink:0;transition:color .2s ease,transform .2s ease;vertical-align:-.125em}.ntd-anim-spin{animation:ntd-spin 1s linear infinite}.ntd-anim-spin-reverse{animation:ntd-spin 1s linear infinite reverse}@keyframes ntd-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ntd-anim-pulse{animation:ntd-pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes ntd-pulse{0%,to{opacity:1}50%{opacity:.4}}.ntd-anim-bounce{animation:ntd-bounce 1s ease infinite}@keyframes ntd-bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(0)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:translateY(-25%)}}.ntd-anim-shake{animation:ntd-shake .6s ease-in-out infinite}@keyframes ntd-shake{0%,to{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-2px)}20%,40%,60%,80%{transform:translateX(2px)}}.ntd-anim-float{animation:ntd-float 3s ease-in-out infinite}@keyframes ntd-float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.ntd-anim-flip{animation:ntd-flip 1.2s ease-in-out infinite}@keyframes ntd-flip{0%{transform:perspective(400px) rotateY(0)}40%{transform:perspective(400px) rotateY(170deg)}50%{transform:perspective(400px) rotateY(190deg)}80%{transform:perspective(400px) rotateY(1turn)}to{transform:perspective(400px) rotateY(1turn)}}.ntd-anim-glow{animation:ntd-glow 2s ease-in-out infinite}@keyframes ntd-glow{0%,to{filter:drop-shadow(0 0 2px currentColor)}50%{filter:drop-shadow(0 0 12px currentColor) drop-shadow(0 0 20px currentColor)}}.ntd-anim-wiggle{animation:ntd-wiggle 1s ease-in-out infinite}@keyframes ntd-wiggle{0%,to{transform:rotate(0deg)}25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}.ntd-anim-rubber{animation:ntd-rubber 1s ease-in-out infinite}@keyframes ntd-rubber{0%{transform:scale(1)}30%{transform:scaleX(1.25) scaleY(.75)}40%{transform:scaleX(.75) scaleY(1.25)}50%{transform:scaleX(1.15) scaleY(.85)}65%{transform:scaleX(.95) scaleY(1.05)}75%{transform:scaleX(1.05) scaleY(.95)}to{transform:scale(1)}}.ntd-anim-swing{animation:ntd-swing 1s ease-in-out infinite;transform-origin:top center}@keyframes ntd-swing{20%{transform:rotate(15deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-5deg)}to{transform:rotate(0deg)}}.ntd-anim-tada{animation:ntd-tada 1.2s ease-in-out infinite}@keyframes ntd-tada{0%{transform:scale(1) rotate(0deg)}10%,20%{transform:scale(.9) rotate(-3deg)}30%,50%,70%,90%{transform:scale(1.1) rotate(3deg)}40%,60%,80%{transform:scale(1.1) rotate(-3deg)}to{transform:scale(1) rotate(0deg)}}.ntd-anim-heartbeat{animation:ntd-heartbeat 1.2s ease-in-out infinite}@keyframes ntd-heartbeat{0%{transform:scale(1)}14%{transform:scale(1.3)}28%{transform:scale(1)}42%{transform:scale(1.3)}70%{transform:scale(1)}}.ntd-anim-fade-in{animation:ntd-fade-in .5s ease-out forwards}@keyframes ntd-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.ntd-anim-slide-up{animation:ntd-slide-up .4s ease-out forwards}@keyframes ntd-slide-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-jello{animation:ntd-jello 1s ease-in-out infinite}@keyframes ntd-jello{0%,to{transform:skewX(0deg) skewY(0deg)}11.1%{transform:skewX(-12.5deg) skewY(-12.5deg)}22.2%{transform:skewX(6.25deg) skewY(6.25deg)}33.3%{transform:skewX(-3.125deg) skewY(-3.125deg)}44.4%{transform:skewX(1.5625deg) skewY(1.5625deg)}55.5%{transform:skewX(-.78125deg) skewY(-.78125deg)}66.6%{transform:skewX(.390625deg) skewY(.390625deg)}77.7%{transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.ntd-anim-pop{animation:ntd-pop .6s ease-out infinite}@keyframes ntd-pop{0%{transform:scale(1)}15%{transform:scale(1.35)}30%{transform:scale(.9)}45%{transform:scale(1.1)}60%{transform:scale(.97)}75%{transform:scale(1.03)}to{transform:scale(1)}}.ntd-anim-squeeze{animation:ntd-squeeze 1.4s ease-in-out infinite}@keyframes ntd-squeeze{0%,to{transform:scaleX(1) scaleY(1)}25%{transform:scaleX(.7) scaleY(1.3)}50%{transform:scaleX(1) scaleY(1)}75%{transform:scaleX(1.3) scaleY(.7)}}.ntd-anim-drop{animation:ntd-drop .8s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-drop{0%{opacity:0;transform:translateY(-40px) scale(.8)}60%{opacity:1;transform:translateY(4px) scale(1.05)}75%{transform:translateY(-2px) scale(.98)}90%{transform:translateY(1px) scale(1.01)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-rise{animation:ntd-rise .7s cubic-bezier(.16,1,.3,1) forwards}@keyframes ntd-rise{0%{opacity:0;transform:translateY(30px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-slide-left{animation:ntd-slide-left .5s ease-out forwards}@keyframes ntd-slide-left{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-right{animation:ntd-slide-right .5s ease-out forwards}@keyframes ntd-slide-right{0%{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}.ntd-anim-slide-down{animation:ntd-slide-down .4s ease-out forwards}@keyframes ntd-slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.ntd-anim-roll-in{animation:ntd-roll-in .8s ease-out forwards}@keyframes ntd-roll-in{0%{opacity:0;transform:translateX(-100%) rotate(-120deg)}to{opacity:1;transform:translateX(0) rotate(0deg)}}.ntd-anim-flash{animation:ntd-flash 1s ease-in-out infinite}@keyframes ntd-flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.ntd-anim-vibrate{animation:ntd-vibrate .3s linear infinite}@keyframes ntd-vibrate{0%{transform:translate(0)}20%{transform:translate(-1px,1px)}40%{transform:translate(1px,-1px)}60%{transform:translate(-1px,-1px)}80%{transform:translate(1px,1px)}to{transform:translate(0)}}.ntd-anim-wobble{animation:ntd-wobble 1.2s ease-in-out infinite}@keyframes ntd-wobble{0%{transform:translateX(0) rotate(0deg)}15%{transform:translateX(-15%) rotate(-5deg)}30%{transform:translateX(10%) rotate(3deg)}45%{transform:translateX(-10%) rotate(-3deg)}60%{transform:translateX(5%) rotate(2deg)}75%{transform:translateX(-3%) rotate(-1deg)}to{transform:translateX(0) rotate(0deg)}}.ntd-anim-spiral{animation:ntd-spiral 2s linear infinite}@keyframes ntd-spiral{0%{transform:rotate(0deg) scale(.8)}25%{transform:rotate(90deg) scale(1.1)}50%{transform:rotate(180deg) scale(.8)}75%{transform:rotate(270deg) scale(1.1)}to{transform:rotate(1turn) scale(.8)}}.ntd-anim-ping{animation:ntd-ping 1.5s ease-out infinite}@keyframes ntd-ping{0%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(1.6)}71%{opacity:0;transform:scale(1)}to{opacity:1;transform:scale(1)}}.ntd-anim-flicker{animation:ntd-flicker 1.5s steps(1) infinite}@keyframes ntd-flicker{0%{opacity:1}4%{opacity:.3}8%{opacity:1}12%{opacity:.6}16%{opacity:1}20%{opacity:.2}22%{opacity:1}50%{opacity:1}52%{opacity:.4}54%{opacity:1}80%{opacity:1}82%{opacity:.3}85%{opacity:1}90%{opacity:.5}92%{opacity:1}}.ntd-anim-tilt{animation:ntd-tilt 2s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-tilt{0%,to{transform:rotate(0deg)}25%{transform:rotate(8deg)}75%{transform:rotate(-8deg)}}.ntd-anim-breathe{animation:ntd-breathe 4s ease-in-out infinite}@keyframes ntd-breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.08)}}.ntd-anim-drift{animation:ntd-drift 4s ease-in-out infinite}@keyframes ntd-drift{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(5px) rotate(1deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-5px) rotate(-1deg)}}.ntd-anim-orbit{animation:ntd-orbit 3s linear infinite}@keyframes ntd-orbit{0%{transform:translate(0)}25%{transform:translate(4px,-4px)}50%{transform:translateY(-6px)}75%{transform:translate(-4px,-4px)}to{transform:translate(0)}}.ntd-anim-crush{animation:ntd-crush .8s ease-in-out infinite}@keyframes ntd-crush{0%,to{transform:scaleY(1) scaleX(1)}40%{transform:scaleY(.3) scaleX(1.3)}60%{transform:scaleY(1.15) scaleX(.9)}80%{transform:scaleY(.95) scaleX(1.02)}}.ntd-anim-stretch{animation:ntd-stretch 1s ease-in-out infinite}@keyframes ntd-stretch{0%,to{transform:scaleY(1) scaleX(1)}30%{transform:scaleY(1.4) scaleX(.8)}50%{transform:scaleY(.85) scaleX(1.1)}70%{transform:scaleY(1.1) scaleX(.95)}}.ntd-anim-dissolve{animation:ntd-dissolve 2s ease-in-out infinite}@keyframes ntd-dissolve{0%,to{filter:blur(0);opacity:1}50%{filter:blur(4px);opacity:.1}}.ntd-anim-materialize{animation:ntd-materialize .8s ease-out forwards}@keyframes ntd-materialize{0%{filter:blur(8px);opacity:0;transform:scale(.6)}60%{filter:blur(1px);opacity:.8;transform:scale(1.05)}to{filter:blur(0);opacity:1;transform:scale(1)}}.ntd-anim-sway{animation:ntd-sway 2.5s ease-in-out infinite;transform-origin:top center}@keyframes ntd-sway{0%,to{transform:rotate(0deg)}20%{transform:rotate(12deg)}40%{transform:rotate(-8deg)}60%{transform:rotate(5deg)}80%{transform:rotate(-3deg)}}.ntd-anim-tremble{animation:ntd-tremble .15s linear infinite}@keyframes ntd-tremble{0%{transform:translate(0) rotate(0deg)}25%{transform:translate(-.5px,.5px) rotate(-.5deg)}50%{transform:translate(.5px,-.5px) rotate(.5deg)}75%{transform:translate(-.5px,-.5px) rotate(-.5deg)}to{transform:translate(0) rotate(0deg)}}.ntd-anim-rock{animation:ntd-rock 1.5s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-rock{0%,to{transform:rotate(0deg)}25%{transform:rotate(15deg)}75%{transform:rotate(-15deg)}}.ntd-anim-snap{animation:ntd-snap 1.5s ease-in-out infinite}@keyframes ntd-snap{0%,30%{transform:rotate(0deg)}50%{transform:rotate(190deg)}55%{transform:rotate(175deg)}60%{transform:rotate(182deg)}65%,to{transform:rotate(180deg)}}.ntd-anim-warp{animation:ntd-warp 2s ease-in-out infinite}@keyframes ntd-warp{0%,to{transform:perspective(300px) rotateX(0deg) rotateY(0deg)}25%{transform:perspective(300px) rotateX(10deg) rotateY(10deg)}50%{transform:perspective(300px) rotateX(-5deg) rotateY(-10deg)}75%{transform:perspective(300px) rotateX(8deg) rotateY(-5deg)}}.ntd-anim-glitch{animation:ntd-glitch .8s steps(1) infinite}@keyframes ntd-glitch{0%{transform:translate(0)}5%{transform:translate(-3px,2px) skewX(2deg)}10%{transform:translate(3px,-1px) skewX(-1deg)}15%{transform:translate(0)}40%{transform:translate(0)}42%{transform:translate(2px,1px) skewX(-3deg)}44%{transform:translate(-2px,-2px) skewX(1deg)}46%{transform:translate(0)}70%{transform:translate(0)}72%{transform:translate(-1px,3px) skewX(2deg)}74%{transform:translate(1px,-1px)}76%{transform:translate(0)}to{transform:translate(0)}}.ntd-anim-zoom-pulse{animation:ntd-zoom-pulse 1.5s ease-in-out infinite}@keyframes ntd-zoom-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.ntd-anim-ripple{animation:ntd-ripple 1.6s ease-out infinite}@keyframes ntd-ripple{0%{opacity:1;transform:scale(1)}30%{opacity:.8;transform:scale(1.15)}50%{opacity:1;transform:scale(1)}70%{opacity:.9;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}.ntd-anim-implode{animation:ntd-implode 1.2s ease-in-out infinite}@keyframes ntd-implode{0%,to{opacity:1;transform:scale(1)}40%{opacity:.3;transform:scale(.2) rotate(20deg)}60%{opacity:.2;transform:scale(.15) rotate(25deg)}80%{opacity:1;transform:scale(1.1) rotate(0deg)}}.ntd-anim-explode{animation:ntd-explode 1.4s ease-in-out infinite}@keyframes ntd-explode{0%,to{opacity:1;transform:scale(1)}30%{opacity:.6;transform:scale(1.8)}50%{opacity:0;transform:scale(2)}51%{opacity:0;transform:scale(.5)}70%{opacity:.8;transform:scale(1.1)}85%{opacity:1;transform:scale(.95)}}.ntd-anim-rotate-x{animation:ntd-rotate-x 1.5s ease-in-out infinite}@keyframes ntd-rotate-x{0%{transform:perspective(400px) rotateX(0deg)}to{transform:perspective(400px) rotateX(1turn)}}.ntd-anim-morph{animation:ntd-morph 3s ease-in-out infinite}@keyframes ntd-morph{0%,to{border-radius:0;transform:scaleX(1) scaleY(1) rotate(0deg)}20%{transform:scaleX(1.1) scaleY(.9) rotate(2deg)}40%{transform:scaleX(.9) scaleY(1.1) rotate(-1deg)}60%{transform:scaleX(1.05) scaleY(.95) rotate(1deg)}80%{transform:scaleX(.95) scaleY(1.05) rotate(-2deg)}}.ntd-anim-levitate{animation:ntd-levitate 3s ease-in-out infinite}@keyframes ntd-levitate{0%,to{filter:drop-shadow(0 2px 2px rgba(0,0,0,.2));transform:translateY(0)}50%{filter:drop-shadow(0 12px 8px rgba(0,0,0,.1));transform:translateY(-10px)}}.ntd-anim-dash{animation:ntd-dash .8s ease-in-out infinite}@keyframes ntd-dash{0%,to{opacity:1;transform:translateX(0) scaleX(1)}30%{opacity:.8;transform:translateX(-3px) scaleX(.9)}60%{opacity:.6;transform:translateX(15px) scaleX(1.15)}80%{opacity:.9;transform:translateX(2px) scaleX(1)}}.ntd-anim-twist{animation:ntd-twist 1.5s ease-in-out infinite}@keyframes ntd-twist{0%,to{transform:rotate(0deg) scale(1)}25%{transform:rotate(30deg) scale(.9)}50%{transform:rotate(0deg) scale(1.05)}75%{transform:rotate(-30deg) scale(.9)}}.ntd-anim-stomp{animation:ntd-stomp 1s ease-in-out infinite;transform-origin:bottom center}@keyframes ntd-stomp{0%,to{transform:translateY(0) scaleY(1) scaleX(1)}20%{transform:translateY(-15px) scaleY(1.1) scaleX(.95)}50%{transform:translateY(0) scaleY(.7) scaleX(1.2)}65%{transform:translateY(-3px) scaleY(1.05) scaleX(.98)}80%{transform:translateY(0) scaleY(.95) scaleX(1.03)}}.ntd-anim-flap{animation:ntd-flap .6s ease-in-out infinite}@keyframes ntd-flap{0%,to{transform:perspective(400px) rotateX(0deg) translateY(0)}50%{transform:perspective(400px) rotateX(25deg) translateY(-5px)}}.ntd-anim-skate{animation:ntd-skate 2s ease-in-out infinite}@keyframes ntd-skate{0%,to{transform:translateX(0) rotate(0deg)}25%{transform:translateX(8px) rotate(2deg)}50%{transform:translateX(0) rotate(0deg)}75%{transform:translateX(-8px) rotate(-2deg)}}.ntd-anim-blink{animation:ntd-blink 1.4s steps(1) infinite}@keyframes ntd-blink{0%,49%{opacity:1}50%,99%{opacity:0}}.ntd-anim-reveal{animation:ntd-reveal 1s ease-out forwards}@keyframes ntd-reveal{0%{clip-path:circle(0 at 50% 50%);opacity:.5}to{clip-path:circle(75% at 50% 50%);opacity:1}}.ntd-anim-vortex{animation:ntd-vortex .8s ease-out forwards}@keyframes ntd-vortex{0%{opacity:0;transform:rotate(-540deg) scale(0)}60%{opacity:1;transform:rotate(20deg) scale(1.1)}80%{transform:rotate(-10deg) scale(.95)}to{opacity:1;transform:rotate(0deg) scale(1)}}.ntd-anim-meteor{animation:ntd-meteor .7s ease-out forwards}@keyframes ntd-meteor{0%{opacity:0;transform:translate(30px,-30px) rotate(15deg) scale(.5)}70%{opacity:1;transform:translate(-2px,2px) rotate(-2deg) scale(1.05)}to{opacity:1;transform:translate(0) rotate(0deg) scale(1)}}.ntd-anim-scale-in{animation:ntd-scale-in .5s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes ntd-scale-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.ntd-anim-scale-out{animation:ntd-scale-out .4s ease-in forwards}@keyframes ntd-scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}.ntd-anim-pendulum{animation:ntd-pendulum 2s ease-in-out infinite;transform-origin:top center}@keyframes ntd-pendulum{0%{transform:rotate(0deg)}25%{transform:rotate(25deg)}50%{transform:rotate(0deg)}75%{transform:rotate(-25deg)}to{transform:rotate(0deg)}}.ntd-anim-surge{animation:ntd-surge 1.5s ease-in-out infinite}@keyframes ntd-surge{0%,to{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}15%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor);transform:scale(1.2)}30%{filter:drop-shadow(0 0 2px currentColor);transform:scale(.95)}45%{filter:drop-shadow(0 0 6px currentColor);transform:scale(1.1)}60%{filter:drop-shadow(0 0 0 currentColor);transform:scale(1)}}.ntd-anim-radar{animation:ntd-radar 2s linear infinite}@keyframes ntd-radar{0%{opacity:1;transform:rotate(0deg)}50%{opacity:.4}to{opacity:1;transform:rotate(1turn)}}.ntd-anim-typewriter{animation:ntd-typewriter 1s steps(12) forwards}@keyframes ntd-typewriter{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}.ntd-anim-unfold{animation:ntd-unfold .7s ease-out forwards}@keyframes ntd-unfold{0%{opacity:.3;transform:scaleY(.05) scaleX(1.3)}50%{opacity:.9;transform:scaleY(1.1) scaleX(.95)}70%{opacity:1;transform:scaleY(.95) scaleX(1.02)}to{opacity:1;transform:scaleY(1) scaleX(1)}}.ntd-anim-fold{animation:ntd-fold .6s ease-in forwards}@keyframes ntd-fold{0%{opacity:1;transform:scaleY(1) scaleX(1)}to{opacity:0;transform:scaleY(.05) scaleX(1.3)}}.ntd-anim-scatter{animation:ntd-scatter 1.5s ease-in-out infinite}@keyframes ntd-scatter{0%,to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}20%{filter:blur(2px);opacity:.6;transform:scale(1.3) rotate(5deg)}40%{filter:blur(4px);opacity:.2;transform:scale(1.5) rotate(-3deg)}50%{filter:blur(6px);opacity:0;transform:scale(.8) rotate(0deg)}65%{filter:blur(3px);opacity:.3;transform:scale(.6) rotate(-5deg)}80%{filter:blur(1px);opacity:.8;transform:scale(.95) rotate(2deg)}}.ntd-anim-assemble{animation:ntd-assemble 1s ease-out forwards}@keyframes ntd-assemble{0%{filter:blur(8px);opacity:0;transform:scale(2) rotate(15deg)}30%{filter:blur(3px);opacity:.5;transform:scale(.8) rotate(-5deg)}60%{filter:blur(1px);opacity:.9;transform:scale(1.1) rotate(2deg)}80%{filter:blur(0);opacity:1;transform:scale(.97) rotate(-1deg)}to{filter:blur(0);opacity:1;transform:scale(1) rotate(0deg)}}.ntd-anim-neon{animation:ntd-neon 2s ease-in-out infinite}@keyframes ntd-neon{0%,to{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}10%{filter:drop-shadow(0 0 0 currentColor);opacity:.4}11%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}15%{filter:drop-shadow(0 0 0 currentColor);opacity:.3}16%{filter:drop-shadow(0 0 5px currentColor) drop-shadow(0 0 10px currentColor);opacity:1}50%{filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 16px currentColor) drop-shadow(0 0 24px currentColor);opacity:1}}.ntd-anim-earthquake{animation:ntd-earthquake .5s ease-in-out infinite}@keyframes ntd-earthquake{0%,to{transform:translate(0)}10%{transform:translate(-4px,2px) rotate(-1deg)}20%{transform:translate(3px,-3px) rotate(1deg)}30%{transform:translate(-2px,4px) rotate(-2deg)}40%{transform:translate(4px,-1px) rotate(2deg)}50%{transform:translate(-3px,3px) rotate(-1deg)}60%{transform:translate(2px,-4px) rotate(1deg)}70%{transform:translate(-4px,1px) rotate(-2deg)}80%{transform:translate(3px,2px) rotate(2deg)}90%{transform:translate(-1px,-3px) rotate(-1deg)}}.ntd-anim-signature{animation:ntd-signature-enter .65s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-signature circle,.ntd-anim-signature ellipse,.ntd-anim-signature line,.ntd-anim-signature path,.ntd-anim-signature polygon,.ntd-anim-signature polyline,.ntd-anim-signature rect{stroke-dasharray:150;stroke-dashoffset:150;animation:ntd-signature-stroke 1.7s ease-out .05s forwards,ntd-signature-fill .55s ease-out 1.05s forwards;filter:drop-shadow(0 0 0 currentColor)}@keyframes ntd-signature-enter{0%{opacity:.08;transform:scale(.05) rotate(-8deg)}60%{opacity:1;transform:scale(1.06) rotate(0deg)}to{opacity:1;transform:scale(1)}}@keyframes ntd-signature-stroke{0%{stroke-dashoffset:150;filter:drop-shadow(0 0 0 currentColor)}65%{stroke-dashoffset:0;filter:drop-shadow(0 0 6px currentColor)}to{stroke-dashoffset:0;filter:drop-shadow(0 0 2px currentColor)}}@keyframes ntd-signature-fill{0%{fill-opacity:.05}to{fill-opacity:1}}.ntd-anim-draw-sequence circle,.ntd-anim-draw-sequence ellipse,.ntd-anim-draw-sequence line,.ntd-anim-draw-sequence path,.ntd-anim-draw-sequence polygon,.ntd-anim-draw-sequence polyline,.ntd-anim-draw-sequence rect{stroke-dasharray:160;stroke-dashoffset:160;fill-opacity:0;animation:ntd-draw-sequence 1.6s ease-out forwards}.ntd-anim-draw-sequence circle:first-child,.ntd-anim-draw-sequence ellipse:first-child,.ntd-anim-draw-sequence line:first-child,.ntd-anim-draw-sequence path:first-child,.ntd-anim-draw-sequence polygon:first-child,.ntd-anim-draw-sequence polyline:first-child,.ntd-anim-draw-sequence rect:first-child{animation-delay:0s}.ntd-anim-draw-sequence circle:nth-child(2),.ntd-anim-draw-sequence ellipse:nth-child(2),.ntd-anim-draw-sequence line:nth-child(2),.ntd-anim-draw-sequence path:nth-child(2),.ntd-anim-draw-sequence polygon:nth-child(2),.ntd-anim-draw-sequence polyline:nth-child(2),.ntd-anim-draw-sequence rect:nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence circle:nth-child(3),.ntd-anim-draw-sequence ellipse:nth-child(3),.ntd-anim-draw-sequence line:nth-child(3),.ntd-anim-draw-sequence path:nth-child(3),.ntd-anim-draw-sequence polygon:nth-child(3),.ntd-anim-draw-sequence polyline:nth-child(3),.ntd-anim-draw-sequence rect:nth-child(3){animation-delay:.4s}@keyframes ntd-draw-sequence{0%{stroke-dashoffset:160;fill-opacity:0}75%{stroke-dashoffset:0;fill-opacity:.15}to{stroke-dashoffset:0;fill-opacity:1}}.ntd-anim-stroke-order circle,.ntd-anim-stroke-order ellipse,.ntd-anim-stroke-order line,.ntd-anim-stroke-order path,.ntd-anim-stroke-order polygon,.ntd-anim-stroke-order polyline,.ntd-anim-stroke-order rect{stroke-dasharray:220;stroke-dashoffset:220;animation:ntd-stroke-order 2s linear forwards}@keyframes ntd-stroke-order{0%{stroke-dashoffset:220;opacity:.2}30%{opacity:1}to{stroke-dashoffset:0;opacity:1}}.ntd-anim-glow-trace circle,.ntd-anim-glow-trace ellipse,.ntd-anim-glow-trace line,.ntd-anim-glow-trace path,.ntd-anim-glow-trace polygon,.ntd-anim-glow-trace polyline,.ntd-anim-glow-trace rect{stroke-dasharray:180;animation:ntd-glow-trace 2.8s ease-in-out infinite}@keyframes ntd-glow-trace{0%{stroke-dashoffset:180;filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{stroke-dashoffset:0;filter:drop-shadow(0 0 8px currentColor) drop-shadow(0 0 14px currentColor);opacity:1}to{stroke-dashoffset:-180;filter:drop-shadow(0 0 2px currentColor);opacity:.5}}.ntd-anim-seal-stamp{animation:ntd-seal-stamp .75s cubic-bezier(.22,1,.36,1) forwards;transform-origin:center}@keyframes ntd-seal-stamp{0%{filter:blur(2px);opacity:0;transform:translateY(-14px) scale(1.25) rotate(-4deg)}45%{filter:blur(0);opacity:1;transform:translateY(2px) scale(.94) rotate(0deg)}70%{transform:translateY(-1px) scale(1.03)}to{opacity:1;transform:translateY(0) scale(1)}}.ntd-anim-draw circle,.ntd-anim-draw ellipse,.ntd-anim-draw line,.ntd-anim-draw path,.ntd-anim-draw polygon,.ntd-anim-draw polyline,.ntd-anim-draw rect{stroke-dasharray:120;stroke-dashoffset:120;fill-opacity:0;animation:ntd-draw-stroke 1.2s ease-out forwards,ntd-draw-fill .4s ease-out .8s forwards}@keyframes ntd-draw-stroke{0%{stroke-dashoffset:120}to{stroke-dashoffset:0}}@keyframes ntd-draw-fill{0%{fill-opacity:0}to{fill-opacity:1}}.ntd-anim-draw-from-dot{animation:ntd-draw-dot-enter .45s cubic-bezier(.34,1.56,.64,1) forwards;transform-origin:center}.ntd-anim-draw-from-dot circle,.ntd-anim-draw-from-dot ellipse,.ntd-anim-draw-from-dot line,.ntd-anim-draw-from-dot path,.ntd-anim-draw-from-dot polygon,.ntd-anim-draw-from-dot polyline,.ntd-anim-draw-from-dot rect{stroke-dasharray:140;stroke-dashoffset:140;fill-opacity:0;animation:ntd-draw-dot-stroke 1.35s ease-out .15s forwards,ntd-draw-fill .45s ease-out .95s forwards}@keyframes ntd-draw-dot-enter{0%{opacity:.15;transform:scale(.08)}60%{opacity:1;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes ntd-draw-dot-stroke{0%{stroke-dashoffset:140}to{stroke-dashoffset:0}}.ntd-anim-draw-loop circle,.ntd-anim-draw-loop ellipse,.ntd-anim-draw-loop line,.ntd-anim-draw-loop path,.ntd-anim-draw-loop polygon,.ntd-anim-draw-loop polyline,.ntd-anim-draw-loop rect{stroke-dasharray:140;animation:ntd-draw-loop-stroke 2.4s ease-in-out infinite}@keyframes ntd-draw-loop-stroke{0%{stroke-dashoffset:140;opacity:0}25%{stroke-dashoffset:0;opacity:1}60%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-140;opacity:.2}}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-shape-pop .7s cubic-bezier(.34,1.56,.64,1) .35s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.5s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.65s}.ntd-anim-draw :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.8s}@keyframes ntd-draw-shape-pop{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);transform:scale(.5)}60%{fill-opacity:.9;clip-path:circle(75% at 50% 50%);transform:scale(1.08)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-dot-shape-burst .65s cubic-bezier(.34,1.56,.64,1) .25s forwards;clip-path:circle(0 at 50% 50%);transform-box:fill-box;transform-origin:center}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.4s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.55s}.ntd-anim-draw-from-dot :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.7s}@keyframes ntd-draw-dot-shape-burst{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);transform:scale(.1)}50%{fill-opacity:.85;clip-path:circle(65% at 50% 50%);transform:scale(1.14)}75%{clip-path:circle(88% at 50% 50%);transform:scale(.97)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);transform:scale(1)}}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-draw-seq-shape-wipe .6s cubic-bezier(.22,1,.36,1) forwards;clip-path:inset(100% 0 0 0);transform-box:fill-box;transform-origin:center bottom}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):first-child{animation-delay:0s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(2){animation-delay:.2s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(3){animation-delay:.4s}.ntd-anim-draw-sequence :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]):nth-child(n+4){animation-delay:.6s}@keyframes ntd-draw-seq-shape-wipe{0%{fill-opacity:0;clip-path:inset(100% 0 0 0);transform:scaleY(.6)}70%{fill-opacity:.9;clip-path:inset(5% 0 0 0);transform:scaleY(1.04)}to{fill-opacity:1;clip-path:inset(0 0 0 0);transform:scaleY(1)}}.ntd-anim-draw-loop :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-draw-loop-shape-pulse 2.4s ease-in-out infinite}@keyframes ntd-draw-loop-shape-pulse{0%{clip-path:circle(0 at 50% 50%);opacity:0}25%{clip-path:circle(100% at 50% 50%);opacity:1}60%{clip-path:circle(100% at 50% 50%);opacity:1}to{clip-path:circle(0 at 50% 50%);opacity:.2}}.ntd-anim-signature :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-signature-shape-stamp .8s cubic-bezier(.22,1,.36,1) .5s forwards;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform-box:fill-box;transform-origin:center}@keyframes ntd-signature-shape-stamp{0%{fill-opacity:0;clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);transform:scale(.35) rotate(-6deg)}55%{fill-opacity:.85;clip-path:circle(70% at 50% 50%);filter:drop-shadow(0 0 8px currentColor);transform:scale(1.08) rotate(0deg)}to{fill-opacity:1;clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 2px currentColor);transform:scale(1)}}.ntd-anim-stroke-order :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;fill-opacity:0;animation:ntd-stroke-order-shape-wipe 1.2s ease-out .3s forwards;clip-path:inset(0 100% 0 0)}@keyframes ntd-stroke-order-shape-wipe{0%{fill-opacity:0;clip-path:inset(0 100% 0 0)}40%{fill-opacity:.7}to{fill-opacity:1;clip-path:inset(0 0 0 0)}}.ntd-anim-glow-trace :is(path,rect,circle,ellipse,polygon)[fill]:not([fill=none]){stroke-dasharray:0;animation:ntd-glow-trace-shape 2.8s ease-in-out infinite}@keyframes ntd-glow-trace-shape{0%{clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 0 currentColor);opacity:.3}45%{clip-path:circle(100% at 50% 50%);filter:drop-shadow(0 0 10px currentColor) drop-shadow(0 0 16px currentColor);opacity:1}to{clip-path:circle(0 at 50% 50%);filter:drop-shadow(0 0 2px currentColor);opacity:.4}}
|
|
@@ -172,7 +172,8 @@ function drawParticle(ctx, p) {
|
|
|
172
172
|
/* ────────────────────────────────────────────────────────────────────────────
|
|
173
173
|
COMPONENT
|
|
174
174
|
───────────────────────────────────────────────────────────────────────────── */
|
|
175
|
-
const NtdParticleIcon =
|
|
175
|
+
const NtdParticleIcon = /* @__PURE__ */ Object.assign(
|
|
176
|
+
/* @__PURE__ */ forwardRef(({ icon: Icon, particle, trigger = 'click', active, size = 'md', iconProps, className, style, onEffectEnd, }, ref) => {
|
|
176
177
|
var _a;
|
|
177
178
|
const containerRef = useRef(null);
|
|
178
179
|
const canvasRef = useRef(null);
|
|
@@ -261,7 +262,14 @@ const NtdParticleIcon = forwardRef(({ icon: Icon, particle, trigger = 'click', a
|
|
|
261
262
|
height: resolvedSize,
|
|
262
263
|
cursor: trigger === 'click' || trigger === 'hover' ? 'pointer' : undefined,
|
|
263
264
|
...style,
|
|
264
|
-
}, onClick: trigger === 'click' ? emit : undefined,
|
|
265
|
+
}, onClick: trigger === 'click' ? emit : undefined, onKeyDown: trigger === 'click'
|
|
266
|
+
? (e) => {
|
|
267
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
268
|
+
e.preventDefault();
|
|
269
|
+
emit();
|
|
270
|
+
}
|
|
271
|
+
}
|
|
272
|
+
: undefined, role: trigger === 'click' ? 'button' : undefined, tabIndex: trigger === 'click' ? 0 : undefined, onMouseEnter: trigger === 'hover' ? emit : undefined, children: [jsx(Icon, { size: size, ...iconProps }), jsx("canvas", { ref: canvasRef, width: canvasSize, height: canvasSize, style: {
|
|
265
273
|
position: 'absolute',
|
|
266
274
|
top: -canvasOffset,
|
|
267
275
|
left: -canvasOffset,
|
|
@@ -269,7 +277,6 @@ const NtdParticleIcon = forwardRef(({ icon: Icon, particle, trigger = 'click', a
|
|
|
269
277
|
height: canvasSize,
|
|
270
278
|
pointerEvents: 'none',
|
|
271
279
|
} })] }));
|
|
272
|
-
});
|
|
273
|
-
NtdParticleIcon.displayName = 'NtdParticleIcon';
|
|
280
|
+
}), { displayName: 'NtdParticleIcon' });
|
|
274
281
|
|
|
275
282
|
export { NtdParticleIcon };
|
package/dist/esm/resolver.js
CHANGED
|
@@ -68,6 +68,7 @@ const NAME_MAP = {
|
|
|
68
68
|
'zoom-out': 'NtdZoomOut',
|
|
69
69
|
undo: 'NtdUndo',
|
|
70
70
|
redo: 'NtdRedo',
|
|
71
|
+
reply: 'NtdReply',
|
|
71
72
|
link: 'NtdLink',
|
|
72
73
|
login: 'NtdLogIn',
|
|
73
74
|
logout: 'NtdLogOut',
|
|
@@ -87,6 +88,7 @@ const NAME_MAP = {
|
|
|
87
88
|
image: 'NtdImage',
|
|
88
89
|
'link-2': 'NtdLink',
|
|
89
90
|
mail: 'NtdMail',
|
|
91
|
+
inbox: 'NtdInbox',
|
|
90
92
|
phone: 'NtdPhone',
|
|
91
93
|
user: 'NtdUser',
|
|
92
94
|
users: 'NtdUsers',
|
|
@@ -96,6 +98,7 @@ const NAME_MAP = {
|
|
|
96
98
|
bell: 'NtdBell',
|
|
97
99
|
grip: 'NtdGrid',
|
|
98
100
|
tag: 'NtdTag',
|
|
101
|
+
backspace: 'NtdBackspace',
|
|
99
102
|
bookmark: 'NtdBookmark',
|
|
100
103
|
flag: 'NtdFlag',
|
|
101
104
|
globe: 'NtdGlobe',
|
|
@@ -113,6 +116,7 @@ const NAME_MAP = {
|
|
|
113
116
|
camera: 'NtdCamera',
|
|
114
117
|
video: 'NtdVideo',
|
|
115
118
|
microphone: 'NtdMicrophone',
|
|
119
|
+
'microphone-off': 'NtdMicrophoneOff',
|
|
116
120
|
music: 'NtdMusic',
|
|
117
121
|
palette: 'NtdPalette',
|
|
118
122
|
// Misc
|
|
@@ -125,7 +125,9 @@ export interface NtdIconOverlayProps {
|
|
|
125
125
|
* />
|
|
126
126
|
* ```
|
|
127
127
|
*/
|
|
128
|
-
export declare const NtdBadge: React.ForwardRefExoticComponent<NtdBadgeProps & React.RefAttributes<HTMLDivElement
|
|
128
|
+
export declare const NtdBadge: React.ForwardRefExoticComponent<NtdBadgeProps & React.RefAttributes<HTMLDivElement>> & {
|
|
129
|
+
displayName: string;
|
|
130
|
+
};
|
|
129
131
|
/**
|
|
130
132
|
* Status indicator dot overlay for icons.
|
|
131
133
|
*
|
|
@@ -141,7 +143,9 @@ export declare const NtdBadge: React.ForwardRefExoticComponent<NtdBadgeProps & R
|
|
|
141
143
|
* <NtdStatusDot icon={NtdUser} status="away" position="bottom-right" />
|
|
142
144
|
* ```
|
|
143
145
|
*/
|
|
144
|
-
export declare const NtdStatusDot: React.ForwardRefExoticComponent<NtdStatusDotProps & React.RefAttributes<HTMLDivElement
|
|
146
|
+
export declare const NtdStatusDot: React.ForwardRefExoticComponent<NtdStatusDotProps & React.RefAttributes<HTMLDivElement>> & {
|
|
147
|
+
displayName: string;
|
|
148
|
+
};
|
|
145
149
|
/**
|
|
146
150
|
* Generic overlay component for composing icons.
|
|
147
151
|
*
|
|
@@ -163,7 +167,9 @@ export declare const NtdStatusDot: React.ForwardRefExoticComponent<NtdStatusDotP
|
|
|
163
167
|
* />
|
|
164
168
|
* ```
|
|
165
169
|
*/
|
|
166
|
-
export declare const NtdIconOverlay: React.ForwardRefExoticComponent<NtdIconOverlayProps & React.RefAttributes<HTMLDivElement
|
|
170
|
+
export declare const NtdIconOverlay: React.ForwardRefExoticComponent<NtdIconOverlayProps & React.RefAttributes<HTMLDivElement>> & {
|
|
171
|
+
displayName: string;
|
|
172
|
+
};
|
|
167
173
|
export interface NtdIconStackProps {
|
|
168
174
|
/** Base (background) icon */
|
|
169
175
|
base: ComponentType<NtdIconProps>;
|
|
@@ -205,5 +211,7 @@ export interface NtdIconStackProps {
|
|
|
205
211
|
* />
|
|
206
212
|
* ```
|
|
207
213
|
*/
|
|
208
|
-
export declare const NtdIconStack: React.ForwardRefExoticComponent<NtdIconStackProps & React.RefAttributes<HTMLDivElement
|
|
214
|
+
export declare const NtdIconStack: React.ForwardRefExoticComponent<NtdIconStackProps & React.RefAttributes<HTMLDivElement>> & {
|
|
215
|
+
displayName: string;
|
|
216
|
+
};
|
|
209
217
|
export default NtdBadge;
|
|
@@ -87,7 +87,9 @@ export type MorphPairName = 'menu-close' | 'play-pause' | 'plus-minus' | 'check-
|
|
|
87
87
|
* />
|
|
88
88
|
* ```
|
|
89
89
|
*/
|
|
90
|
-
export declare const NtdIconMorph: React.ForwardRefExoticComponent<NtdIconMorphProps & React.RefAttributes<HTMLDivElement
|
|
90
|
+
export declare const NtdIconMorph: React.ForwardRefExoticComponent<NtdIconMorphProps & React.RefAttributes<HTMLDivElement>> & {
|
|
91
|
+
displayName: string;
|
|
92
|
+
};
|
|
91
93
|
export interface NtdPathMorphProps {
|
|
92
94
|
/** Predefined morph pair name */
|
|
93
95
|
pair: MorphPairName;
|
|
@@ -132,7 +134,9 @@ export interface NtdPathMorphProps {
|
|
|
132
134
|
* />
|
|
133
135
|
* ```
|
|
134
136
|
*/
|
|
135
|
-
export declare const NtdPathMorph: React.ForwardRefExoticComponent<NtdPathMorphProps & React.RefAttributes<SVGSVGElement
|
|
137
|
+
export declare const NtdPathMorph: React.ForwardRefExoticComponent<NtdPathMorphProps & React.RefAttributes<SVGSVGElement>> & {
|
|
138
|
+
displayName: string;
|
|
139
|
+
};
|
|
136
140
|
/**
|
|
137
141
|
* Convenience component for predefined icon morph pairs.
|
|
138
142
|
*
|
|
@@ -142,7 +146,9 @@ export declare const NtdPathMorph: React.ForwardRefExoticComponent<NtdPathMorphP
|
|
|
142
146
|
* <NtdMorphPair pair="sun-moon" trigger="click" />
|
|
143
147
|
* ```
|
|
144
148
|
*/
|
|
145
|
-
export declare const NtdMorphPair: React.ForwardRefExoticComponent<NtdMorphPairProps & React.RefAttributes<HTMLDivElement
|
|
149
|
+
export declare const NtdMorphPair: React.ForwardRefExoticComponent<NtdMorphPairProps & React.RefAttributes<HTMLDivElement>> & {
|
|
150
|
+
displayName: string;
|
|
151
|
+
};
|
|
146
152
|
export interface UseMorphStateOptions {
|
|
147
153
|
/** Initial morphed state */
|
|
148
154
|
initial?: boolean;
|
|
@@ -71,7 +71,9 @@ export interface StateMorphHandle {
|
|
|
71
71
|
/** Get SVG element ref */
|
|
72
72
|
getSvgElement: () => SVGSVGElement | null;
|
|
73
73
|
}
|
|
74
|
-
export declare const NtdStateMorph: React.ForwardRefExoticComponent<NtdStateMorphProps & React.RefAttributes<StateMorphHandle
|
|
74
|
+
export declare const NtdStateMorph: React.ForwardRefExoticComponent<NtdStateMorphProps & React.RefAttributes<StateMorphHandle>> & {
|
|
75
|
+
displayName: string;
|
|
76
|
+
};
|
|
75
77
|
/**
|
|
76
78
|
* Hook for managing morph state transitions.
|
|
77
79
|
*
|
|
@@ -67,7 +67,9 @@ export type ForwardRefIcon = ForwardRefExoticComponent<PropsWithoutRef<HeadlessI
|
|
|
67
67
|
* Simple Slot implementation for asChild pattern.
|
|
68
68
|
* Compatible with Radix UI's Slot component behavior.
|
|
69
69
|
*/
|
|
70
|
-
export declare const Slot: React.ForwardRefExoticComponent<Omit<SlotProps & Record<string, unknown>, "ref"> & React.RefAttributes<Element
|
|
70
|
+
export declare const Slot: React.ForwardRefExoticComponent<Omit<SlotProps & Record<string, unknown>, "ref"> & React.RefAttributes<Element>> & {
|
|
71
|
+
displayName: string;
|
|
72
|
+
};
|
|
71
73
|
/**
|
|
72
74
|
* Wraps a NtdIcon component with forwardRef for Headless UI / Radix compatibility.
|
|
73
75
|
* Supports the asChild pattern used by shadcn/ui and Radix primitives.
|
|
@@ -333,7 +335,9 @@ declare const _default: {
|
|
|
333
335
|
getShadcnIconProps: typeof getShadcnIconProps;
|
|
334
336
|
mergeIconProps: typeof mergeIconProps;
|
|
335
337
|
getIconClassName: typeof getIconClassName;
|
|
336
|
-
Slot: React.ForwardRefExoticComponent<Omit<SlotProps & Record<string, unknown>, "ref"> & React.RefAttributes<Element
|
|
338
|
+
Slot: React.ForwardRefExoticComponent<Omit<SlotProps & Record<string, unknown>, "ref"> & React.RefAttributes<Element>> & {
|
|
339
|
+
displayName: string;
|
|
340
|
+
};
|
|
337
341
|
SHADCN_ICON_SIZES: {
|
|
338
342
|
readonly default: "1rem";
|
|
339
343
|
readonly sm: "0.875rem";
|