@nordhealth/components 2.17.1 → 3.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (177) hide show
  1. package/README.md +14 -1
  2. package/custom-elements.json +1321 -873
  3. package/lib/Avatar.js +1 -1
  4. package/lib/Avatar.js.map +1 -1
  5. package/lib/Badge.js +1 -1
  6. package/lib/Badge.js.map +1 -1
  7. package/lib/Banner.js +1 -1
  8. package/lib/Banner.js.map +1 -1
  9. package/lib/Button.js +1 -1
  10. package/lib/Button.js.map +1 -1
  11. package/lib/ButtonGroup.js +1 -1
  12. package/lib/ButtonGroup.js.map +1 -1
  13. package/lib/Calendar-62409139.js +2 -0
  14. package/lib/{Calendar-70103fd4.js.map → Calendar-62409139.js.map} +1 -1
  15. package/lib/Calendar.js +1 -1
  16. package/lib/CommandMenu.js +1 -1
  17. package/lib/CommandMenu.js.map +1 -1
  18. package/lib/CommandMenuAction.js +1 -1
  19. package/lib/CommandMenuAction.js.map +1 -1
  20. package/lib/DatePicker.js +1 -1
  21. package/lib/DatePicker.js.map +1 -1
  22. package/lib/{DirectionController-8b298382.js → DirectionController-f35f5476.js} +2 -2
  23. package/lib/{DirectionController-8b298382.js.map → DirectionController-f35f5476.js.map} +1 -1
  24. package/lib/Divider.js.map +1 -1
  25. package/lib/Drawer.js +1 -1
  26. package/lib/Drawer.js.map +1 -1
  27. package/lib/Dropdown.js +1 -1
  28. package/lib/Dropdown.js.map +1 -1
  29. package/lib/DropdownGroup.js +1 -1
  30. package/lib/DropdownGroup.js.map +1 -1
  31. package/lib/DropdownItem-a9bf32f4.js +2 -0
  32. package/lib/DropdownItem-a9bf32f4.js.map +1 -0
  33. package/lib/DropdownItem.js +1 -1
  34. package/lib/DropdownItem.js.map +1 -1
  35. package/lib/EventController-d99ebeef.js.map +1 -1
  36. package/lib/Header.js +1 -1
  37. package/lib/Header.js.map +1 -1
  38. package/lib/Icon.js.map +1 -1
  39. package/lib/IconManager.js +1 -1
  40. package/lib/Input.js +1 -1
  41. package/lib/Input.js.map +1 -1
  42. package/lib/Layout.js +1 -1
  43. package/lib/Layout.js.map +1 -1
  44. package/lib/LocalizeController.js +1 -1
  45. package/lib/LocalizeController.js.map +1 -1
  46. package/lib/Message.js +2 -0
  47. package/lib/Message.js.map +1 -0
  48. package/lib/Modal.js +1 -1
  49. package/lib/Modal.js.map +1 -1
  50. package/lib/ModalController.js.map +1 -1
  51. package/lib/NavGroup.js +1 -1
  52. package/lib/NavGroup.js.map +1 -1
  53. package/lib/NavItem.js +1 -1
  54. package/lib/NavItem.js.map +1 -1
  55. package/lib/NavToggle-d34fed72.js +2 -0
  56. package/lib/NavToggle-d34fed72.js.map +1 -0
  57. package/lib/NavToggle.js +1 -1
  58. package/lib/NavToggle.js.map +1 -1
  59. package/lib/Navigation.js +1 -1
  60. package/lib/Navigation.js.map +1 -1
  61. package/lib/Notification.js +1 -1
  62. package/lib/Notification.js.map +1 -1
  63. package/lib/NotificationGroup.js +1 -1
  64. package/lib/NotificationGroup.js.map +1 -1
  65. package/lib/NotificationMixin-c06bb631.js.map +1 -1
  66. package/lib/{Popout-9f0393b2.js → Popout-c6ee2d7a.js} +2 -2
  67. package/lib/Popout-c6ee2d7a.js.map +1 -0
  68. package/lib/Popout.js +1 -1
  69. package/lib/ProgressBar.js +1 -1
  70. package/lib/ProgressBar.js.map +1 -1
  71. package/lib/Qrcode.js.map +1 -1
  72. package/lib/Radio.js.map +1 -1
  73. package/lib/Range.js +1 -1
  74. package/lib/ScrollbarController-773c79f4.js.map +1 -1
  75. package/lib/Select.js.map +1 -1
  76. package/lib/SelectEvent.js.map +1 -1
  77. package/lib/Stack.js +1 -1
  78. package/lib/Stack.js.map +1 -1
  79. package/lib/{Sticky-69666e8c.js → Sticky-acc92284.js} +2 -2
  80. package/lib/Sticky-acc92284.js.map +1 -0
  81. package/lib/Tab.js +1 -1
  82. package/lib/Tab.js.map +1 -1
  83. package/lib/TabGroup.js +1 -1
  84. package/lib/TabGroup.js.map +1 -1
  85. package/lib/TextField-8b226327.js +2 -0
  86. package/lib/{TextField-d617d0ad.js.map → TextField-8b226327.js.map} +1 -1
  87. package/lib/Textarea.js +1 -1
  88. package/lib/Textarea.js.map +1 -1
  89. package/lib/Toast.js.map +1 -1
  90. package/lib/Toggle.js +1 -1
  91. package/lib/Toggle.js.map +1 -1
  92. package/lib/Tooltip.js +1 -1
  93. package/lib/Tooltip.js.map +1 -1
  94. package/lib/TopBar.js +2 -0
  95. package/lib/TopBar.js.map +1 -0
  96. package/lib/bundle.js +16 -15
  97. package/lib/bundle.js.map +1 -1
  98. package/lib/en-us.js +1 -1
  99. package/lib/en-us.js.map +1 -1
  100. package/lib/fi-fi.js +1 -1
  101. package/lib/fi-fi.js.map +1 -1
  102. package/lib/index.js +1 -1
  103. package/lib/localization.js +1 -1
  104. package/lib/localization.js.map +1 -1
  105. package/lib/localization8.js +2 -0
  106. package/lib/localization8.js.map +1 -0
  107. package/lib/positioning-a572d126.js +2 -0
  108. package/lib/positioning-a572d126.js.map +1 -0
  109. package/lib/query-assigned-elements-15485e3d.js.map +1 -1
  110. package/lib/src/avatar/Avatar.d.ts +2 -1
  111. package/lib/src/badge/Badge.d.ts +12 -3
  112. package/lib/src/button/Button.d.ts +2 -3
  113. package/lib/src/button-group/ButtonGroup.d.ts +2 -4
  114. package/lib/src/calendar/Calendar.d.ts +1 -1
  115. package/lib/src/command-menu/CommandMenu.d.ts +1 -4
  116. package/lib/src/command-menu/KeyboardController.d.ts +1 -1
  117. package/lib/src/command-menu/localization.d.ts +1 -0
  118. package/lib/src/common/controllers/DirectionController.d.ts +1 -1
  119. package/lib/src/common/controllers/EventController.d.ts +6 -5
  120. package/lib/src/common/controllers/FormDataController.d.ts +1 -1
  121. package/lib/src/common/controllers/LightDismissController.d.ts +1 -1
  122. package/lib/src/common/controllers/LightDomController.d.ts +1 -1
  123. package/lib/src/common/controllers/LightSlotController.d.ts +1 -1
  124. package/lib/src/common/controllers/PortalController.d.ts +1 -1
  125. package/lib/src/common/controllers/ResizeController.d.ts +13 -0
  126. package/lib/src/common/controllers/ShortcutController.d.ts +1 -1
  127. package/lib/src/common/controllers/SwipeController.d.ts +2 -2
  128. package/lib/src/common/decorators/observe.d.ts +1 -1
  129. package/lib/src/common/fsm.d.ts +4 -4
  130. package/lib/src/common/mixins/AutocompleteMixin.d.ts +2 -2
  131. package/lib/src/common/mixins/DraftComponentMixin.d.ts +1 -1
  132. package/lib/src/common/mixins/FloatingComponentMixin.d.ts +1 -1
  133. package/lib/src/common/mixins/FocusableMixin.d.ts +1 -1
  134. package/lib/src/common/mixins/FormAssociatedMixin.d.ts +1 -1
  135. package/lib/src/common/mixins/InputMixin.d.ts +1 -1
  136. package/lib/src/common/mixins/NotificationMixin.d.ts +1 -1
  137. package/lib/src/common/mixins/ReadonlyMixin.d.ts +1 -1
  138. package/lib/src/common/mixins/SizeMixin.d.ts +1 -1
  139. package/lib/src/common/positioning.d.ts +3 -3
  140. package/lib/src/common/ref.d.ts +1 -1
  141. package/lib/src/date-picker/DatePicker.d.ts +0 -6
  142. package/lib/src/date-picker/date-adapter.d.ts +3 -3
  143. package/lib/src/drawer/Drawer.d.ts +2 -4
  144. package/lib/src/dropdown/Dropdown.d.ts +6 -0
  145. package/lib/src/dropdown/Dropdown.test.d.ts +1 -0
  146. package/lib/src/icon/Icon.d.ts +1 -0
  147. package/lib/src/icon/IconManager.d.ts +1 -1
  148. package/lib/src/index.d.ts +2 -0
  149. package/lib/src/input/Input.d.ts +2 -0
  150. package/lib/src/layout/Layout.d.ts +6 -14
  151. package/lib/src/layout/Layout.test.d.ts +1 -0
  152. package/lib/src/localization/LocalizeController.d.ts +3 -3
  153. package/lib/src/localization/en-us.d.ts +4 -0
  154. package/lib/src/localization/translation.d.ts +7 -3
  155. package/lib/src/message/Message.d.ts +42 -0
  156. package/lib/src/message/Message.test.d.ts +2 -0
  157. package/lib/src/message/localization.d.ts +4 -0
  158. package/lib/src/modal/ModalController.d.ts +1 -1
  159. package/lib/src/nav-group/NavGroup.d.ts +1 -1
  160. package/lib/src/nav-group/NavGroup.test.d.ts +1 -0
  161. package/lib/src/nav-item/NavItem.d.ts +2 -2
  162. package/lib/src/nav-toggle/NavToggle.d.ts +1 -1
  163. package/lib/src/navigation/Navigation.d.ts +5 -0
  164. package/lib/src/select/Select.d.ts +1 -0
  165. package/lib/src/stack/Stack.d.ts +0 -5
  166. package/lib/src/toast-group/ToastGroup.d.ts +1 -1
  167. package/lib/src/top-bar/TopBar.d.ts +20 -0
  168. package/lib/src/top-bar/TopBar.test.d.ts +9 -0
  169. package/lib/translation.js +1 -1
  170. package/lib/translation.js.map +1 -1
  171. package/package.json +43 -39
  172. package/lib/Calendar-70103fd4.js +0 -2
  173. package/lib/Popout-9f0393b2.js.map +0 -1
  174. package/lib/Sticky-69666e8c.js.map +0 -1
  175. package/lib/TextField-d617d0ad.js +0 -2
  176. package/lib/positioning-cc75c800.js +0 -2
  177. package/lib/positioning-cc75c800.js.map +0 -1
@@ -1,6 +1,6 @@
1
1
  import { LitElement } from "lit";
2
2
  import { Ref } from "lit/directives/ref.js";
3
- declare type Constructable<T = Record<string, unknown>> = new (...args: any[]) => T;
3
+ type Constructable<T = Record<string, unknown>> = new (...args: any[]) => T;
4
4
  export declare class FocusableMixinInterface {
5
5
  protected focusableRef: Ref<HTMLElement>;
6
6
  focus(options?: FocusOptions): void;
@@ -3,7 +3,7 @@ import { FormDataController } from "../controllers/FormDataController.js";
3
3
  import { SlotController } from "../controllers/SlotController.js";
4
4
  import { InputMixinInterface } from "./InputMixin.js";
5
5
  import "../../visually-hidden/VisuallyHidden.js";
6
- declare type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
6
+ type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
7
7
  export declare class FormAssociatedMixinInterface {
8
8
  label: string;
9
9
  required: boolean;
@@ -1,5 +1,5 @@
1
1
  import { LitElement } from "lit";
2
- declare type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
2
+ type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
3
3
  export declare class InputMixinInterface {
4
4
  name?: string;
5
5
  value: string;
@@ -1,6 +1,6 @@
1
1
  import { LitElement } from "lit";
2
2
  import type { Ref } from "lit/directives/ref.js";
3
- declare type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
3
+ type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
4
4
  export declare class NotificationMixinInterface {
5
5
  protected dismissed: boolean;
6
6
  protected notificationRef: Ref<HTMLElement>;
@@ -1,5 +1,5 @@
1
1
  import { LitElement } from "lit";
2
- declare type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
2
+ type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
3
3
  export declare class ReadonlyMixinInterface {
4
4
  readonly: boolean;
5
5
  }
@@ -1,5 +1,5 @@
1
1
  import { LitElement } from "lit";
2
- declare type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
2
+ type Constructor<T = Record<string, unknown>> = new (...args: any[]) => T;
3
3
  export declare class SizeMixinInterface {
4
4
  size: "s" | "m" | "l";
5
5
  }
@@ -1,7 +1,7 @@
1
1
  import { Side, Placement, Alignment } from "@floating-ui/dom";
2
- export declare type LogicalSide = "block-end" | "block-start" | "inline-start" | "inline-end";
3
- export declare type LogicalSideAlign = `${LogicalSide}-${Alignment}`;
4
- declare type Direction = "ltr" | "rtl";
2
+ export type LogicalSide = "block-end" | "block-start" | "inline-start" | "inline-end";
3
+ export type LogicalSideAlign = `${LogicalSide}-${Alignment}`;
4
+ type Direction = "ltr" | "rtl";
5
5
  /**
6
6
  * Converts a single logical position to a physical position
7
7
  */
@@ -1,5 +1,5 @@
1
1
  import { Ref } from "lit/directives/ref.js";
2
- declare type RefCallback = (el: Element | undefined) => void;
2
+ type RefCallback = (el: Element | undefined) => void;
3
3
  /**
4
4
  * Creates a ref callback which will assign the element to every given ref
5
5
  * @param refs
@@ -68,12 +68,6 @@ export default class DatePicker extends DatePicker_base {
68
68
  * This setting can be used alone or together with the min property.
69
69
  */
70
70
  max: string;
71
- /**
72
- * This is deprecated, the popout will now adjust automatically based on available space.
73
- * Forces the opening direction of the calendar modal to be always left or right.
74
- * @deprecated
75
- */
76
- direction: "left" | "right";
77
71
  /**
78
72
  * Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.
79
73
  * Default is Monday.
@@ -1,7 +1,7 @@
1
1
  import { createDate } from "../common/dates.js";
2
- declare type CreateDate = typeof createDate;
3
- export declare type DateParser = (input: string, createDate: CreateDate) => Date | undefined;
4
- export declare type DateFormatter = (date: Date) => string;
2
+ type CreateDate = typeof createDate;
3
+ export type DateParser = (input: string, createDate: CreateDate) => Date | undefined;
4
+ export type DateFormatter = (date: Date) => string;
5
5
  export interface DateAdapter {
6
6
  parse: DateParser;
7
7
  format: DateFormatter;
@@ -1,10 +1,9 @@
1
1
  import { LitElement } from "lit";
2
- declare const Drawer_base: typeof LitElement;
3
2
  /**
4
3
  * Drawer is used to display context-sensitive actions and information.
5
4
  * Drawer doesn’t block users from completing their task, like a modal would.
6
5
  *
7
- * @status draft
6
+ * @status new
8
7
  * @category structure
9
8
  * @slot header - Optional slot that holds a header for the drawer.
10
9
  * @slot - Default slot.
@@ -12,7 +11,7 @@ declare const Drawer_base: typeof LitElement;
12
11
  *
13
12
  * @cssprop [--n-drawer-padding=var(--n-space-l)] - Controls the padding around the main area (the default slot), using our [spacing tokens](/tokens/#space).
14
13
  */
15
- export default class Drawer extends Drawer_base {
14
+ export default class Drawer extends LitElement {
16
15
  static styles: import("lit").CSSResult[];
17
16
  private footerSlot;
18
17
  /**
@@ -26,4 +25,3 @@ declare global {
26
25
  "nord-drawer": Drawer;
27
26
  }
28
27
  }
29
- export {};
@@ -10,6 +10,8 @@ declare const Dropdown_base: (new (...args: any[]) => import("../common/mixins/F
10
10
  * @category action
11
11
  * @slot - The dropdown content.
12
12
  * @slot toggle - Used to place the toggle for dropdown.
13
+ * @slot header - Optional slot that holds a header for the dropdown.
14
+ * @slot header-end - Optional slot that positions content at the end of the header. Useful for actions or additional info.
13
15
  *
14
16
  * @cssprop [--n-dropdown-size=250px] - Controls the inline size, or width, of the dropdown. Will resize up to 1.5 times to account for larger content.
15
17
  */
@@ -26,6 +28,9 @@ export default class Dropdown extends Dropdown_base {
26
28
  slotAssignment?: SlotAssignmentMode | undefined;
27
29
  customElements?: CustomElementRegistry | undefined;
28
30
  };
31
+ private headerSlot;
32
+ private headerEndSlot;
33
+ private list;
29
34
  private popout;
30
35
  /**
31
36
  * Controls whether the toggle slot expands to fill the width of its container.
@@ -41,6 +46,7 @@ export default class Dropdown extends Dropdown_base {
41
46
  private handleBlur;
42
47
  private handleOpen;
43
48
  private handleClose;
49
+ protected handleOpenChange(): void;
44
50
  /**
45
51
  * Hide the dropdown programmatically.
46
52
  * This method delegates to the Dropdown's internal Popout component.
@@ -4,4 +4,5 @@ import "../dropdown-group/DropdownGroup.js";
4
4
  import "../visually-hidden/VisuallyHidden.js";
5
5
  import "../button/Button.js";
6
6
  import "../stack/Stack.js";
7
+ import "../badge/Badge.js";
7
8
  import "../icon/Icon.js";
@@ -39,6 +39,7 @@ export default class Icon extends LitElement {
39
39
  name: string;
40
40
  /**
41
41
  * The size of the icon.
42
+ * @default "m"
42
43
  */
43
44
  size?: "xxs" | "xs" | "s" | "m" | "l" | "xl" | "xxl";
44
45
  /**
@@ -1,4 +1,4 @@
1
- export declare type IconResolver = (iconName: string) => Promise<string>;
1
+ export type IconResolver = (iconName: string) => Promise<string>;
2
2
  export declare class IconManager {
3
3
  private cache;
4
4
  resolver: IconResolver;
@@ -18,6 +18,7 @@ export { default as Tooltip } from "./tooltip/Tooltip.js";
18
18
  export { default as Fieldset } from "./fieldset/Fieldset.js";
19
19
  export { default as Radio } from "./radio/Radio.js";
20
20
  export { default as Header } from "./header/Header.js";
21
+ export { default as Message } from "./message/Message.js";
21
22
  export { default as NavGroup } from "./nav-group/NavGroup.js";
22
23
  export { default as NavItem } from "./nav-item/NavItem.js";
23
24
  export { default as Navigation } from "./navigation/Navigation.js";
@@ -48,3 +49,4 @@ export { default as Range } from "./range/Range.js";
48
49
  export { default as ButtonGroup } from "./button-group/ButtonGroup.js";
49
50
  export { default as Notification } from "./notification/Notification.js";
50
51
  export { default as NotificationGroup } from "./notification-group/NotificationGroup.js";
52
+ export { default as TopBar } from "./top-bar/TopBar.js";
@@ -23,6 +23,8 @@ export default class Input extends Input_base {
23
23
  static styles: import("lit").CSSResult[];
24
24
  private startSlot;
25
25
  private endSlot;
26
+ private startObserver;
27
+ private endObserver;
26
28
  private direction;
27
29
  /**
28
30
  * The type of the input.
@@ -2,9 +2,9 @@ import { LitElement } from "lit";
2
2
  import { States } from "../common/fsm.js";
3
3
  import "../nav-toggle/NavToggle.js";
4
4
  declare const navMachine: {
5
- transition(currentState: "closed" | "opened" | "peek" | "unpeek" | "wait" | "blocked", event: "click" | "open" | "close" | "focusin" | "focusout" | "pointerenter" | "pointerleave" | "toggle" | "transitionend" | "timeout" | "dropdownOpen" | "dropdownClose"): "closed" | "opened" | "peek" | "unpeek" | "wait" | "blocked";
5
+ transition(currentState: "closed" | "opened" | "peek" | "unpeek" | "wait" | "blocked", event: "click" | "close" | "focusin" | "focusout" | "pointerenter" | "pointerleave" | "toggle" | "transitionend" | "open" | "timeout" | "dropdownOpen" | "dropdownClose"): "closed" | "opened" | "peek" | "unpeek" | "wait" | "blocked";
6
6
  };
7
- declare type NavState = States<typeof navMachine>;
7
+ type NavState = States<typeof navMachine>;
8
8
  /**
9
9
  * Layout component is used to create the main layout of an app. Layout
10
10
  * currently comes with one main configuration: two-column.
@@ -13,6 +13,7 @@ declare type NavState = States<typeof navMachine>;
13
13
  * @category structure
14
14
  * @slot - The default main section content.
15
15
  * @slot nav - Used to place content inside the navigation sidebar.
16
+ * @slot top-bar - Used to place the [Top Bar](../top-bar/) component.
16
17
  * @slot header - Used to place content inside the header section.
17
18
  * @slot drawer - Used to place additional content/details relating to a selected item.
18
19
  * @slot nav-toggle - Used to place a own nav-toggle component, for cases where you might need to add a tooltip.
@@ -24,30 +25,23 @@ declare type NavState = States<typeof navMachine>;
24
25
  export default class Layout extends LitElement {
25
26
  static styles: import("lit").CSSResult[];
26
27
  private peekTimeoutId?;
27
- private resizeObserver;
28
28
  private navSlot;
29
29
  private drawerSlot;
30
+ private topBarSlot;
31
+ private headerSlot;
30
32
  private direction;
31
33
  private events;
32
34
  private lightDismiss;
33
- private stickyElement;
34
35
  private navEl;
35
36
  private navWidth;
36
37
  private isDragging;
37
38
  private navState;
38
39
  private wideScreen;
39
- private headerSize;
40
40
  /**
41
41
  * Controls whether the navigation is hidden off-screen or not.
42
42
  * Defaults to `true` for wide viewports, and `false` otherwise.
43
43
  */
44
44
  navOpen: boolean;
45
- /**
46
- * ID reference of element used to toggle the navigation.
47
- * This is deprecated, the layout component will now render its own nav toggle to simplify usage.
48
- * @deprecated
49
- */
50
- navToggle?: string;
51
45
  /**
52
46
  * Controls the padding of the default main section slot. When set to “none”,
53
47
  * the nav and header slots will still have padding.
@@ -63,10 +57,9 @@ export default class Layout extends LitElement {
63
57
  */
64
58
  get isNarrow(): boolean;
65
59
  connectedCallback(): void;
66
- protected firstUpdated(): void;
67
- disconnectedCallback(): void;
68
60
  render(): import("lit-html").TemplateResult<1>;
69
61
  private renderNavToggle;
62
+ private renderNavCollapse;
70
63
  protected handleNavWidthChange(): void;
71
64
  protected handleNavStateChange(prev: NavState): void;
72
65
  protected handleOpenChange(): void;
@@ -82,7 +75,6 @@ export default class Layout extends LitElement {
82
75
  private handleMouseEnter;
83
76
  private handleMouseLeave;
84
77
  private handleTransitionEnd;
85
- private isNavToggle;
86
78
  private handleKeyboardResize;
87
79
  private setNavWidth;
88
80
  private startDragging;
@@ -1,3 +1,4 @@
1
+ import "../top-bar/TopBar.js";
1
2
  import "../avatar/Avatar.js";
2
3
  import "../stack/Stack.js";
3
4
  import "../table/Table.js";
@@ -1,8 +1,8 @@
1
1
  import type { ReactiveController, ReactiveControllerHost } from "lit";
2
2
  import { Translation, WellKnownKeys } from "./translation.js";
3
- declare type Func = (...args: any[]) => any;
4
- declare type Result<Type, Key extends keyof Type> = Type[Key] extends Func ? ReturnType<Type[Key]> : Type[Key];
5
- declare type FuncParams<Type, K extends keyof Type> = Type[K] extends Func ? Parameters<Type[K]> : never;
3
+ type Func = (...args: any[]) => any;
4
+ type Result<Type, Key extends keyof Type> = Type[Key] extends Func ? ReturnType<Type[Key]> : Type[Key];
5
+ type FuncParams<Type, K extends keyof Type> = Type[K] extends Func ? Parameters<Type[K]> : never;
6
6
  export declare class LocalizeController<TComponentName extends Exclude<keyof Translation, WellKnownKeys>> implements ReactiveController {
7
7
  private host;
8
8
  private options;
@@ -11,6 +11,7 @@ declare const en: {
11
11
  footerBackspaceKey: string;
12
12
  noResults: (searchTerm: string) => string;
13
13
  tip: string;
14
+ placeholder: string;
14
15
  };
15
16
  "nord-calendar": {
16
17
  prevMonthLabel: string;
@@ -36,5 +37,8 @@ declare const en: {
36
37
  "nord-notification": {
37
38
  dismissLabel: string;
38
39
  };
40
+ "nord-message": {
41
+ unreadLabel: string;
42
+ };
39
43
  };
40
44
  export default en;
@@ -1,7 +1,7 @@
1
1
  import en from "./en-us.js";
2
- declare type PickStartsWith<T, Prefix extends string> = T extends `${Prefix}${string}` ? T : never;
3
- export declare type Translation = typeof en;
4
- export declare type WellKnownKeys = PickStartsWith<keyof Translation, "$">;
2
+ type PickStartsWith<T, Prefix extends string> = T extends `${Prefix}${string}` ? T : never;
3
+ export type Translation = typeof en;
4
+ export type WellKnownKeys = PickStartsWith<keyof Translation, "$">;
5
5
  /**
6
6
  * Removes all registered translations
7
7
  */
@@ -38,6 +38,7 @@ export declare function resolveTranslation(langCode: string): {
38
38
  footerBackspaceKey: string;
39
39
  noResults: (searchTerm: string) => string;
40
40
  tip: string;
41
+ placeholder: string;
41
42
  };
42
43
  "nord-calendar": {
43
44
  prevMonthLabel: string;
@@ -63,5 +64,8 @@ export declare function resolveTranslation(langCode: string): {
63
64
  "nord-notification": {
64
65
  dismissLabel: string;
65
66
  };
67
+ "nord-message": {
68
+ unreadLabel: string;
69
+ };
66
70
  };
67
71
  export { en as fallback };
@@ -0,0 +1,42 @@
1
+ import { LitElement, TemplateResult } from "lit";
2
+ declare const Message_base: (new (...args: any[]) => import("../common/mixins/FocusableMixin.js").FocusableMixinInterface) & typeof LitElement;
3
+ /**
4
+ * Message represents a specific item within a collection,
5
+ * such as notifications, tasks or conversations. Message
6
+ * can be placed directly inside a dropdown component.
7
+ *
8
+ * @status draft
9
+ * @category action
10
+ * @slot - The message content.
11
+ * @slot footer - Used to place content after the message. Typically used for a timestamp.
12
+ *
13
+ * @cssprop [--n-message-border-color=var(--n-color-border)] - Controls the border color of the message, using our [color tokens](/tokens/#color).
14
+ *
15
+ * @localization unreadLabel - Label for the unread messages.
16
+ */
17
+ export default class Message extends Message_base {
18
+ static styles: import("lit").CSSResult[];
19
+ private localize;
20
+ /**
21
+ * The url the message should link to.
22
+ */
23
+ href?: string;
24
+ /**
25
+ * Highlight the message visually. This is meant for highlighting
26
+ * a new message that just appeared. Highlight style should be removed
27
+ * after the user has seen the message and there’s been a timeout of
28
+ * e.g. 30 seconds.
29
+ */
30
+ highlight?: boolean;
31
+ /**
32
+ * Mark the message as unread. By default messages are read.
33
+ */
34
+ unread?: boolean;
35
+ render(): TemplateResult<1>;
36
+ }
37
+ declare global {
38
+ interface HTMLElementTagNameMap {
39
+ "nord-message": Message;
40
+ }
41
+ }
42
+ export {};
@@ -0,0 +1,2 @@
1
+ import "../dropdown-group/DropdownGroup.js";
2
+ import "../icon/Icon.js";
@@ -0,0 +1,4 @@
1
+ declare const localization: {
2
+ unreadLabel: string;
3
+ };
4
+ export default localization;
@@ -1,6 +1,6 @@
1
1
  import { ReactiveController, ReactiveControllerHost } from "lit";
2
2
  import { LightDismissOptions } from "../common/controllers/LightDismissController.js";
3
- declare type ModalControllerOptions = {
3
+ type ModalControllerOptions = {
4
4
  isOpen: LightDismissOptions["isOpen"];
5
5
  onDismiss: LightDismissOptions["onDismiss"];
6
6
  close: (returnValue?: string) => void;
@@ -9,7 +9,7 @@ import "../icon/Icon.js";
9
9
  * @slot - The default slot used for the nav items.
10
10
  */
11
11
  export default class NavGroup extends LitElement {
12
- static styles: import("lit").CSSResult;
12
+ static styles: import("lit").CSSResult[];
13
13
  /**
14
14
  * Heading and accessible label for the nav group
15
15
  */
@@ -1 +1,2 @@
1
+ import "../navigation/Navigation.js";
1
2
  import "../nav-item/NavItem.js";
@@ -11,7 +11,7 @@ declare const NavItem_base: (new (...args: any[]) => import("../common/mixins/Fo
11
11
  * @fires toggle - Dispatched whenever a nav item's state changes between open and closed.
12
12
  */
13
13
  export default class NavItem extends NavItem_base {
14
- static styles: import("lit").CSSResult;
14
+ static styles: import("lit").CSSResult[];
15
15
  private subnavSlot;
16
16
  private direction;
17
17
  /**
@@ -41,12 +41,12 @@ export default class NavItem extends NavItem_base {
41
41
  * @internal
42
42
  */
43
43
  get hasSubNav(): boolean;
44
- connectedCallback(): void;
45
44
  render(): TemplateResult<1>;
46
45
  private renderLink;
47
46
  private renderToggle;
48
47
  private renderButton;
49
48
  private toggleOpen;
49
+ protected handleActiveChange(): void;
50
50
  }
51
51
  declare global {
52
52
  interface HTMLElementTagNameMap {
@@ -5,7 +5,7 @@ declare const NavToggle_base: (new (...args: any[]) => import("../common/mixins/
5
5
  /**
6
6
  * Nav toggle is meant for hiding and showing the primary navigation.
7
7
  * This component is used internally in the Layout component, but can also be
8
- * used separate to further customize the behaviour.
8
+ * used separate to further customize the behavior.
9
9
  *
10
10
  * @status new
11
11
  * @category action
@@ -9,11 +9,16 @@ import { LitElement } from "lit";
9
9
  * @slot - The main section of the sidebar, for holding nav components.
10
10
  * @slot header - The top section of the sidebar.
11
11
  * @slot footer - The bottom section of the sidebar.
12
+ *
13
+ * @cssprop [--n-navigation-background-color=var(--n-color-nav-surface)] - Controls the background color of the navigation element.
12
14
  */
13
15
  export default class Navigation extends LitElement {
14
16
  static styles: import("lit").CSSResult[];
15
17
  private headerSlot;
18
+ private events;
19
+ connectedCallback(): void;
16
20
  render(): import("lit-html").TemplateResult<1>;
21
+ private handleActivate;
17
22
  }
18
23
  declare global {
19
24
  interface HTMLElementTagNameMap {
@@ -11,6 +11,7 @@ declare const Select_base: (new (...args: any[]) => import("../common/mixins/Siz
11
11
  * @slot label - Use when a label requires more than plain text.
12
12
  * @slot hint - Use when a hint requires more than plain text.
13
13
  * @slot error - Optional slot that holds error text for the input.
14
+ * @slot icon - Used to place an icon at the start of select.
14
15
  *
15
16
  * @cssprop [--n-select-block-size=var(--n-space-xl)] - Controls the block size, or height, of the select using our [spacing tokens](/tokens/#space).
16
17
  */
@@ -23,11 +23,6 @@ export default class Stack extends LitElement {
23
23
  * How to align the child items inside the stack.
24
24
  */
25
25
  alignItems?: "center" | "start" | "end" | "stretch";
26
- /**
27
- * This property is deprecated and will be removed in a future version. We recommend using standard [CSS media queries](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries) over this property. Please see the [updated usage example](/components/stack/?example=using+responsive+media+query).
28
- * @deprecated
29
- */
30
- responsive: boolean;
31
26
  /**
32
27
  * Defines whether the Stack items are forced in a single line
33
28
  * or can be flowed into multiple lines.
@@ -1,6 +1,6 @@
1
1
  import { LitElement } from "lit";
2
2
  import Toast from "../toast/Toast.js";
3
- declare type ToastOptions = Partial<Pick<Toast, "variant" | "autoDismiss">>;
3
+ type ToastOptions = Partial<Pick<Toast, "variant" | "autoDismiss">>;
4
4
  /**
5
5
  * Toast group is used to position and style a group of toasts, whilst ensuring they are announced by screen readers.
6
6
  *
@@ -0,0 +1,20 @@
1
+ import { LitElement } from "lit";
2
+ declare const TopBar_base: typeof LitElement;
3
+ /**
4
+ * Top bar is a header component that is always visible at the top of the interface. Top bar allows functionality such as search and contextual menus to be placed at the top of the interface.
5
+ *
6
+ * @status draft
7
+ * @category structure
8
+ * @slot - Used for the main content of the top bar. We recommend placing your application’s global search functionality into this slot.
9
+ * @slot end - Optional slot for menus, buttons, toggles, etc.
10
+ */
11
+ export default class TopBar extends TopBar_base {
12
+ static styles: import("lit").CSSResult[];
13
+ render(): import("lit-html").TemplateResult<1>;
14
+ }
15
+ declare global {
16
+ interface HTMLElementTagNameMap {
17
+ "nord-top-bar": TopBar;
18
+ }
19
+ }
20
+ export {};
@@ -0,0 +1,9 @@
1
+ import "../layout/Layout.js";
2
+ import "../input/Input.js";
3
+ import "../icon/Icon.js";
4
+ import "../dropdown/Dropdown.js";
5
+ import "../dropdown-item/DropdownItem.js";
6
+ import "../message/Message.js";
7
+ import "../avatar/Avatar.js";
8
+ import "../button/Button.js";
9
+ import "../tooltip/Tooltip.js";
@@ -1,2 +1,2 @@
1
- import t from"./en-us.js";export{default as fallback}from"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./localization5.js";import"./localization6.js";import"./localization7.js";const o=new Set,n=new Map;function e(){for(const t of o)t()}function i(){n.clear()}function a(...t){t.forEach((t=>{const o=t.$lang.toLowerCase();n.set(o,t)})),e()}function r(t){return o.add(t),()=>o.delete(t)}function l(t){return n.has(t)}function s(o){const e=o.toLowerCase(),[i]=e.split("-");return n.get(e)||n.get(i)||t}new MutationObserver(e).observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});export{i as clearTranslations,l as isTranslationRegistered,a as registerTranslation,s as resolveTranslation,r as subscribe};
1
+ import t from"./en-us.js";export{default as fallback}from"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./localization5.js";import"./localization6.js";import"./localization7.js";import"./localization8.js";const o=new Set,n=new Map;function i(){for(const t of o)t()}function e(){n.clear()}function a(...t){t.forEach((t=>{const o=t.$lang.toLowerCase();n.set(o,t)})),i()}function r(t){return o.add(t),()=>o.delete(t)}function l(t){return n.has(t)}function s(o){const i=o.toLowerCase(),[e]=i.split("-");return n.get(i)||n.get(e)||t}new MutationObserver(i).observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});export{e as clearTranslations,l as isTranslationRegistered,a as registerTranslation,s as resolveTranslation,r as subscribe};
2
2
  //# sourceMappingURL=translation.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"translation.js","sources":["../src/localization/translation.ts"],"sourcesContent":["import en from \"./en-us.js\"\n\n// gets list of properties beginning prefix\ntype PickStartsWith<T, Prefix extends string> = T extends `${Prefix}${string}` ? T : never\n\nexport type Translation = typeof en\nexport type WellKnownKeys = PickStartsWith<keyof Translation, \"$\">\n\nconst subscribers = new Set<() => void>()\nconst translations = new Map<string, Translation>()\n\nfunction update() {\n for (const subscriber of subscribers) {\n subscriber()\n }\n}\n\n// observe changes to the document's lang\nconst observer = new MutationObserver(update)\nobserver.observe(document.documentElement, {\n attributes: true,\n attributeFilter: [\"lang\"],\n})\n\n/**\n * Removes all registered translations\n */\nexport function clearTranslations() {\n translations.clear()\n}\n\n/**\n * Registers one or more translations\n */\nexport function registerTranslation(...translation: Translation[]) {\n translation.forEach(t => {\n const lang = t.$lang.toLowerCase()\n translations.set(lang, t)\n })\n\n update()\n}\n\n/**\n * subscribe to language changes\n * @param onChange callback for when either `lang` attr changes, or a new language is registered.\n * @returns cleanup function\n */\nexport function subscribe(onChange: () => void): () => void {\n subscribers.add(onChange)\n return () => subscribers.delete(onChange)\n}\n\n/**\n * Check whether there is a translation registered for the given lang\n * @param lang the lang code e.g. \"en\" or \"en-GB\"\n */\nexport function isTranslationRegistered(lang: string) {\n return translations.has(lang)\n}\n\n/**\n * Picks the most appropriate translation for the given language, from most specific to least specific.\n * First tries lang + region, then lang only, then fallback.\n */\nexport function resolveTranslation(langCode: string) {\n const lang = langCode.toLowerCase()\n const [langOnly] = lang.split(\"-\")\n\n return translations.get(lang) || translations.get(langOnly) || en\n}\n\nexport { en as fallback }\n"],"names":["subscribers","Set","translations","Map","update","subscriber","clearTranslations","clear","registerTranslation","translation","forEach","t","lang","$lang","toLowerCase","set","subscribe","onChange","add","delete","isTranslationRegistered","has","resolveTranslation","langCode","langOnly","split","get","en","MutationObserver","observe","document","documentElement","attributes","attributeFilter"],"mappings":"kQAQA,MAAMA,EAAc,IAAIC,IAClBC,EAAe,IAAIC,IAEzB,SAASC,IACP,IAAK,MAAMC,KAAcL,EACvBK,GAEJ,UAYgBC,IACdJ,EAAaK,OACf,CAKgB,SAAAC,KAAuBC,GACrCA,EAAYC,SAAQC,IAClB,MAAMC,EAAOD,EAAEE,MAAMC,cACrBZ,EAAaa,IAAIH,EAAMD,EAAE,IAG3BP,GACF,CAOM,SAAUY,EAAUC,GAExB,OADAjB,EAAYkB,IAAID,GACT,IAAMjB,EAAYmB,OAAOF,EAClC,CAMM,SAAUG,EAAwBR,GACtC,OAAOV,EAAamB,IAAIT,EAC1B,CAMM,SAAUU,EAAmBC,GACjC,MAAMX,EAAOW,EAAST,eACfU,GAAYZ,EAAKa,MAAM,KAE9B,OAAOvB,EAAawB,IAAId,IAASV,EAAawB,IAAIF,IAAaG,CACjE,CApDiB,IAAIC,iBAAiBxB,GAC7ByB,QAAQC,SAASC,gBAAiB,CACzCC,YAAY,EACZC,gBAAiB,CAAC"}
1
+ {"version":3,"file":"translation.js","sources":["../src/localization/translation.ts"],"sourcesContent":["import en from \"./en-us.js\"\n\n// gets list of properties beginning prefix\ntype PickStartsWith<T, Prefix extends string> = T extends `${Prefix}${string}` ? T : never\n\nexport type Translation = typeof en\nexport type WellKnownKeys = PickStartsWith<keyof Translation, \"$\">\n\nconst subscribers = new Set<() => void>()\nconst translations = new Map<string, Translation>()\n\nfunction update() {\n for (const subscriber of subscribers) {\n subscriber()\n }\n}\n\n// observe changes to the document's lang\nconst observer = new MutationObserver(update)\nobserver.observe(document.documentElement, {\n attributes: true,\n attributeFilter: [\"lang\"],\n})\n\n/**\n * Removes all registered translations\n */\nexport function clearTranslations() {\n translations.clear()\n}\n\n/**\n * Registers one or more translations\n */\nexport function registerTranslation(...translation: Translation[]) {\n translation.forEach(t => {\n const lang = t.$lang.toLowerCase()\n translations.set(lang, t)\n })\n\n update()\n}\n\n/**\n * subscribe to language changes\n * @param onChange callback for when either `lang` attr changes, or a new language is registered.\n * @returns cleanup function\n */\nexport function subscribe(onChange: () => void): () => void {\n subscribers.add(onChange)\n return () => subscribers.delete(onChange)\n}\n\n/**\n * Check whether there is a translation registered for the given lang\n * @param lang the lang code e.g. \"en\" or \"en-GB\"\n */\nexport function isTranslationRegistered(lang: string) {\n return translations.has(lang)\n}\n\n/**\n * Picks the most appropriate translation for the given language, from most specific to least specific.\n * First tries lang + region, then lang only, then fallback.\n */\nexport function resolveTranslation(langCode: string) {\n const lang = langCode.toLowerCase()\n const [langOnly] = lang.split(\"-\")\n\n return translations.get(lang) || translations.get(langOnly) || en\n}\n\nexport { en as fallback }\n"],"names":["subscribers","Set","translations","Map","update","subscriber","clearTranslations","clear","registerTranslation","translation","forEach","t","lang","$lang","toLowerCase","set","subscribe","onChange","add","delete","isTranslationRegistered","has","resolveTranslation","langCode","langOnly","split","get","en","MutationObserver","observe","document","documentElement","attributes","attributeFilter"],"mappings":"6RAQA,MAAMA,EAAc,IAAIC,IAClBC,EAAe,IAAIC,IAEzB,SAASC,IACP,IAAK,MAAMC,KAAcL,EACvBK,GAEJ,UAYgBC,IACdJ,EAAaK,OACf,CAKgB,SAAAC,KAAuBC,GACrCA,EAAYC,SAAQC,IAClB,MAAMC,EAAOD,EAAEE,MAAMC,cACrBZ,EAAaa,IAAIH,EAAMD,EAAE,IAG3BP,GACF,CAOM,SAAUY,EAAUC,GAExB,OADAjB,EAAYkB,IAAID,GACT,IAAMjB,EAAYmB,OAAOF,EAClC,CAMM,SAAUG,EAAwBR,GACtC,OAAOV,EAAamB,IAAIT,EAC1B,CAMM,SAAUU,EAAmBC,GACjC,MAAMX,EAAOW,EAAST,eACfU,GAAYZ,EAAKa,MAAM,KAE9B,OAAOvB,EAAawB,IAAId,IAASV,EAAawB,IAAIF,IAAaG,CACjE,CApDiB,IAAIC,iBAAiBxB,GAC7ByB,QAAQC,SAASC,gBAAiB,CACzCC,YAAY,EACZC,gBAAiB,CAAC"}