@besaitech/ng-design-system 0.0.34 → 0.0.35
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/index.d.ts
CHANGED
|
@@ -21,6 +21,7 @@ declare const SDS_ICONS: {
|
|
|
21
21
|
readonly 'user-round': "<circle cx=\"12\" cy=\"8\" r=\"5\"/><path d=\"M20 21a8 8 0 0 0-16 0\"/>";
|
|
22
22
|
readonly home: "<path d=\"m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z\"/><polyline points=\"9 22 9 12 15 12 15 22\"/>";
|
|
23
23
|
readonly 'user-plus': "<path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"/><circle cx=\"9\" cy=\"7\" r=\"4\"/><line x1=\"19\" x2=\"19\" y1=\"8\" y2=\"14\"/><line x1=\"22\" x2=\"16\" y1=\"11\" y2=\"11\"/>";
|
|
24
|
+
readonly 'user-check': "<path d=\"m16 11 2 2 4-4\"/><path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"/><circle cx=\"9\" cy=\"7\" r=\"4\"/>";
|
|
24
25
|
readonly hand: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-hand-icon lucide-hand\"><path d=\"M18 11V6a2 2 0 0 0-2-2a2 2 0 0 0-2 2\"/><path d=\"M14 10V4a2 2 0 0 0-2-2a2 2 0 0 0-2 2v2\"/><path d=\"M10 10.5V6a2 2 0 0 0-2-2a2 2 0 0 0-2 2v8\"/><path d=\"M18 8a2 2 0 1 1 4 0v6a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15\"/></svg>";
|
|
25
26
|
readonly users: "<path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"/><circle cx=\"9\" cy=\"7\" r=\"4\"/><path d=\"M22 21v-2a4 4 0 0 0-3-3.87\"/><path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/>";
|
|
26
27
|
readonly bike: "<circle cx=\"18.5\" cy=\"17.5\" r=\"3.5\"/><circle cx=\"5.5\" cy=\"17.5\" r=\"3.5\"/><circle cx=\"15\" cy=\"5\" r=\"1\"/><path d=\"M12 17.5V14l-3-3 4-3 2 3h2\"/>";
|
|
@@ -93,7 +94,7 @@ type SdsIconSize = 'sm' | 'md' | 'lg' | 'xl';
|
|
|
93
94
|
declare class SdsIcon {
|
|
94
95
|
private readonly sanitizer;
|
|
95
96
|
/** Icon identifier from the registry. */
|
|
96
|
-
readonly name: _angular_core.InputSignal<"
|
|
97
|
+
readonly name: _angular_core.InputSignal<"chart-column" | "clipboard-list" | "credit-card" | "external-link" | "languages" | "megaphone" | "monitor" | "store" | "user-round" | "home" | "user-plus" | "user-check" | "hand" | "users" | "bike" | "building-2" | "package" | "package-plus" | "package-open" | "rotate-ccw" | "bar-chart-3" | "search" | "log-out" | "panel-left-close" | "panel-left-open" | "panel-left" | "calendar" | "chevron-right" | "chevron-left" | "chevron-down" | "chevrons-left" | "chevrons-right" | "x" | "check" | "alert-circle" | "info" | "copy" | "type" | "tag" | "square" | "circle-user" | "layout-grid" | "panels-top-left" | "panel-top" | "rows-3" | "book-open" | "palette" | "bell" | "phone" | "settings" | "align-left" | "toggle-left" | "arrow-up" | "arrow-down" | "chevrons-up-down" | "filter" | "table" | "eye" | "eye-off" | "user" | "check-circle" | "arrows-clockwise" | "menu" | "file-text" | "hash" | "map-pin" | "inbox" | "arrow-right" | "refresh-cw" | "loader-circle">;
|
|
97
98
|
/** Square size: a pixel number, a numeric string, or a keyword (sm·md·lg·xl). */
|
|
98
99
|
readonly size: _angular_core.InputSignalWithTransform<number, string | number>;
|
|
99
100
|
/** Stroke width of the line icon. */
|
|
@@ -185,8 +186,8 @@ declare class SdsInput implements ControlValueAccessor {
|
|
|
185
186
|
* is its only name.
|
|
186
187
|
*/
|
|
187
188
|
readonly clearLabel: _angular_core.InputSignal<string>;
|
|
188
|
-
readonly leadingIcon: _angular_core.InputSignal<"
|
|
189
|
-
readonly trailingIcon: _angular_core.InputSignal<"
|
|
189
|
+
readonly leadingIcon: _angular_core.InputSignal<"chart-column" | "clipboard-list" | "credit-card" | "external-link" | "languages" | "megaphone" | "monitor" | "store" | "user-round" | "home" | "user-plus" | "user-check" | "hand" | "users" | "bike" | "building-2" | "package" | "package-plus" | "package-open" | "rotate-ccw" | "bar-chart-3" | "search" | "log-out" | "panel-left-close" | "panel-left-open" | "panel-left" | "calendar" | "chevron-right" | "chevron-left" | "chevron-down" | "chevrons-left" | "chevrons-right" | "x" | "check" | "alert-circle" | "info" | "copy" | "type" | "tag" | "square" | "circle-user" | "layout-grid" | "panels-top-left" | "panel-top" | "rows-3" | "book-open" | "palette" | "bell" | "phone" | "settings" | "align-left" | "toggle-left" | "arrow-up" | "arrow-down" | "chevrons-up-down" | "filter" | "table" | "eye" | "eye-off" | "user" | "check-circle" | "arrows-clockwise" | "menu" | "file-text" | "hash" | "map-pin" | "inbox" | "arrow-right" | "refresh-cw" | "loader-circle" | null>;
|
|
190
|
+
readonly trailingIcon: _angular_core.InputSignal<"chart-column" | "clipboard-list" | "credit-card" | "external-link" | "languages" | "megaphone" | "monitor" | "store" | "user-round" | "home" | "user-plus" | "user-check" | "hand" | "users" | "bike" | "building-2" | "package" | "package-plus" | "package-open" | "rotate-ccw" | "bar-chart-3" | "search" | "log-out" | "panel-left-close" | "panel-left-open" | "panel-left" | "calendar" | "chevron-right" | "chevron-left" | "chevron-down" | "chevrons-left" | "chevrons-right" | "x" | "check" | "alert-circle" | "info" | "copy" | "type" | "tag" | "square" | "circle-user" | "layout-grid" | "panels-top-left" | "panel-top" | "rows-3" | "book-open" | "palette" | "bell" | "phone" | "settings" | "align-left" | "toggle-left" | "arrow-up" | "arrow-down" | "chevrons-up-down" | "filter" | "table" | "eye" | "eye-off" | "user" | "check-circle" | "arrows-clockwise" | "menu" | "file-text" | "hash" | "map-pin" | "inbox" | "arrow-right" | "refresh-cw" | "loader-circle" | null>;
|
|
190
191
|
/**
|
|
191
192
|
* A CLICKABLE trailing icon, for the affordances that belong to the field itself — password reveal
|
|
192
193
|
* above all. Distinct from {@link trailingIcon}, which is decorative and explicitly
|
|
@@ -196,7 +197,7 @@ declare class SdsInput implements ControlValueAccessor {
|
|
|
196
197
|
* Always pair it with {@link trailingActionLabel} — an icon-only button with no accessible name is
|
|
197
198
|
* unusable by a screen reader. For a toggle, also bind {@link trailingActionPressed}.
|
|
198
199
|
*/
|
|
199
|
-
readonly trailingAction: _angular_core.InputSignal<"
|
|
200
|
+
readonly trailingAction: _angular_core.InputSignal<"chart-column" | "clipboard-list" | "credit-card" | "external-link" | "languages" | "megaphone" | "monitor" | "store" | "user-round" | "home" | "user-plus" | "user-check" | "hand" | "users" | "bike" | "building-2" | "package" | "package-plus" | "package-open" | "rotate-ccw" | "bar-chart-3" | "search" | "log-out" | "panel-left-close" | "panel-left-open" | "panel-left" | "calendar" | "chevron-right" | "chevron-left" | "chevron-down" | "chevrons-left" | "chevrons-right" | "x" | "check" | "alert-circle" | "info" | "copy" | "type" | "tag" | "square" | "circle-user" | "layout-grid" | "panels-top-left" | "panel-top" | "rows-3" | "book-open" | "palette" | "bell" | "phone" | "settings" | "align-left" | "toggle-left" | "arrow-up" | "arrow-down" | "chevrons-up-down" | "filter" | "table" | "eye" | "eye-off" | "user" | "check-circle" | "arrows-clockwise" | "menu" | "file-text" | "hash" | "map-pin" | "inbox" | "arrow-right" | "refresh-cw" | "loader-circle" | null>;
|
|
200
201
|
/** Accessible name for {@link trailingAction}. Translate it in the consuming app. */
|
|
201
202
|
readonly trailingActionLabel: _angular_core.InputSignal<string>;
|
|
202
203
|
/** `aria-pressed` for a toggling action (e.g. show/hide password). Null renders no attribute. */
|
|
@@ -247,7 +248,7 @@ declare class SdsOtpInput implements ControlValueAccessor {
|
|
|
247
248
|
readonly error: _angular_core.InputSignal<string>;
|
|
248
249
|
readonly size: _angular_core.InputSignal<SdsOtpInputSize>;
|
|
249
250
|
/** `numeric` for digit codes (the default); `text` for alphanumeric codes. */
|
|
250
|
-
readonly inputMode: _angular_core.InputSignal<"
|
|
251
|
+
readonly inputMode: _angular_core.InputSignal<"text" | "numeric">;
|
|
251
252
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
252
253
|
/** Focus the first box on first render. */
|
|
253
254
|
readonly autoFocus: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
@@ -375,9 +376,9 @@ declare class SdsToggleSwitch implements ControlValueAccessor {
|
|
|
375
376
|
/** Value emitted/stored when the switch is off. */
|
|
376
377
|
readonly falseValue: _angular_core.InputSignal<unknown>;
|
|
377
378
|
/** Icon shown on the knob when checked. */
|
|
378
|
-
readonly onIcon: _angular_core.InputSignal<"
|
|
379
|
+
readonly onIcon: _angular_core.InputSignal<"chart-column" | "clipboard-list" | "credit-card" | "external-link" | "languages" | "megaphone" | "monitor" | "store" | "user-round" | "home" | "user-plus" | "user-check" | "hand" | "users" | "bike" | "building-2" | "package" | "package-plus" | "package-open" | "rotate-ccw" | "bar-chart-3" | "search" | "log-out" | "panel-left-close" | "panel-left-open" | "panel-left" | "calendar" | "chevron-right" | "chevron-left" | "chevron-down" | "chevrons-left" | "chevrons-right" | "x" | "check" | "alert-circle" | "info" | "copy" | "type" | "tag" | "square" | "circle-user" | "layout-grid" | "panels-top-left" | "panel-top" | "rows-3" | "book-open" | "palette" | "bell" | "phone" | "settings" | "align-left" | "toggle-left" | "arrow-up" | "arrow-down" | "chevrons-up-down" | "filter" | "table" | "eye" | "eye-off" | "user" | "check-circle" | "arrows-clockwise" | "menu" | "file-text" | "hash" | "map-pin" | "inbox" | "arrow-right" | "refresh-cw" | "loader-circle" | null>;
|
|
379
380
|
/** Icon shown on the knob when unchecked. */
|
|
380
|
-
readonly offIcon: _angular_core.InputSignal<"
|
|
381
|
+
readonly offIcon: _angular_core.InputSignal<"chart-column" | "clipboard-list" | "credit-card" | "external-link" | "languages" | "megaphone" | "monitor" | "store" | "user-round" | "home" | "user-plus" | "user-check" | "hand" | "users" | "bike" | "building-2" | "package" | "package-plus" | "package-open" | "rotate-ccw" | "bar-chart-3" | "search" | "log-out" | "panel-left-close" | "panel-left-open" | "panel-left" | "calendar" | "chevron-right" | "chevron-left" | "chevron-down" | "chevrons-left" | "chevrons-right" | "x" | "check" | "alert-circle" | "info" | "copy" | "type" | "tag" | "square" | "circle-user" | "layout-grid" | "panels-top-left" | "panel-top" | "rows-3" | "book-open" | "palette" | "bell" | "phone" | "settings" | "align-left" | "toggle-left" | "arrow-up" | "arrow-down" | "chevrons-up-down" | "filter" | "table" | "eye" | "eye-off" | "user" | "check-circle" | "arrows-clockwise" | "menu" | "file-text" | "hash" | "map-pin" | "inbox" | "arrow-right" | "refresh-cw" | "loader-circle" | null>;
|
|
381
382
|
readonly hint: _angular_core.InputSignal<string>;
|
|
382
383
|
readonly error: _angular_core.InputSignal<string>;
|
|
383
384
|
/**
|
|
@@ -1802,7 +1803,7 @@ declare class SdsNavGroup {
|
|
|
1802
1803
|
/** Turn the label into an expand/collapse control. */
|
|
1803
1804
|
readonly collapsible: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1804
1805
|
/** Icon for a collapsible header, so it reads at the same weight as the items it sits among. */
|
|
1805
|
-
readonly icon: _angular_core.InputSignal<"
|
|
1806
|
+
readonly icon: _angular_core.InputSignal<"chart-column" | "clipboard-list" | "credit-card" | "external-link" | "languages" | "megaphone" | "monitor" | "store" | "user-round" | "home" | "user-plus" | "user-check" | "hand" | "users" | "bike" | "building-2" | "package" | "package-plus" | "package-open" | "rotate-ccw" | "bar-chart-3" | "search" | "log-out" | "panel-left-close" | "panel-left-open" | "panel-left" | "calendar" | "chevron-right" | "chevron-left" | "chevron-down" | "chevrons-left" | "chevrons-right" | "x" | "check" | "alert-circle" | "info" | "copy" | "type" | "tag" | "square" | "circle-user" | "layout-grid" | "panels-top-left" | "panel-top" | "rows-3" | "book-open" | "palette" | "bell" | "phone" | "settings" | "align-left" | "toggle-left" | "arrow-up" | "arrow-down" | "chevrons-up-down" | "filter" | "table" | "eye" | "eye-off" | "user" | "check-circle" | "arrows-clockwise" | "menu" | "file-text" | "hash" | "map-pin" | "inbox" | "arrow-right" | "refresh-cw" | "loader-circle" | null>;
|
|
1806
1807
|
/**
|
|
1807
1808
|
* URL prefix owned by this group, e.g. `/payments`. While the active route starts with it the
|
|
1808
1809
|
* group counts as active and opens itself — unless the person has explicitly toggled it since.
|
|
@@ -1854,7 +1855,7 @@ declare class SdsNavGroup {
|
|
|
1854
1855
|
*/
|
|
1855
1856
|
declare class SdsNavItem {
|
|
1856
1857
|
protected readonly store: SidebarStore;
|
|
1857
|
-
readonly icon: _angular_core.InputSignal<"
|
|
1858
|
+
readonly icon: _angular_core.InputSignal<"chart-column" | "clipboard-list" | "credit-card" | "external-link" | "languages" | "megaphone" | "monitor" | "store" | "user-round" | "home" | "user-plus" | "user-check" | "hand" | "users" | "bike" | "building-2" | "package" | "package-plus" | "package-open" | "rotate-ccw" | "bar-chart-3" | "search" | "log-out" | "panel-left-close" | "panel-left-open" | "panel-left" | "calendar" | "chevron-right" | "chevron-left" | "chevron-down" | "chevrons-left" | "chevrons-right" | "x" | "check" | "alert-circle" | "info" | "copy" | "type" | "tag" | "square" | "circle-user" | "layout-grid" | "panels-top-left" | "panel-top" | "rows-3" | "book-open" | "palette" | "bell" | "phone" | "settings" | "align-left" | "toggle-left" | "arrow-up" | "arrow-down" | "chevrons-up-down" | "filter" | "table" | "eye" | "eye-off" | "user" | "check-circle" | "arrows-clockwise" | "menu" | "file-text" | "hash" | "map-pin" | "inbox" | "arrow-right" | "refresh-cw" | "loader-circle" | null>;
|
|
1858
1859
|
readonly label: _angular_core.InputSignal<string>;
|
|
1859
1860
|
/** Router link target; when null, the item behaves as a button. */
|
|
1860
1861
|
readonly link: _angular_core.InputSignal<string | unknown[] | null>;
|