@nuraly/lumenui 0.1.0 → 0.2.2

package/dist/src/components/dropdown/dropdown.style.js

@@ -3,8 +3,8 @@ export const styles = css `
   :host {
     display: inline-block;
     position: relative;
-    color: var(--nuraly-color-text);
-    font-family: var(--nuraly-dropdown-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif);
+    color: #161616;
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
   }
 
   .dropdown {
@@ -18,20 +18,20 @@ export const styles = css `
   }
 
   .dropdown__trigger:focus-within {
-    outline: var(--nuraly-focus-outline, 2px solid #0f62fe);
-    outline-offset: var(--nuraly-focus-outline-offset, 1px);
+    outline: 2px solid #0f62fe;
+    outline-offset: 1px;
   }
 
   .dropdown__panel {
     position: fixed;
-    z-index: var(--nuraly-dropdown-z-index, 9999);
-    background: var(--nuraly-color-dropdown-background, #ffffff);
-    border: var(--nuraly-dropdown-border-width, 1px) solid var(--nuraly-color-dropdown-border, #e0e0e0);
-    border-radius: var(--nuraly-dropdown-border-radius, 6px);
-    box-shadow: var(--nuraly-dropdown-shadow, 0 2px 6px rgba(0, 0, 0, 0.15));
-    min-width: var(--nuraly-dropdown-min-width, 10rem);
-    max-width: var(--nuraly-dropdown-max-width, 20rem);
-    max-height: var(--nuraly-dropdown-max-height, 200px);
+    z-index: 9999;
+    background: #ffffff;
+    border: 1px solid #e0e0e0;
+    border-radius: 6px;
+    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
+    min-width: 10rem;
+    max-width: 20rem;
+    max-height: 200px;
     overflow: auto;
     /* Use display none to fully hide when closed */
     display: none;
@@ -39,9 +39,9 @@ export const styles = css `
     opacity: 0;
     visibility: hidden;
     transform: translateY(-8px);
-    transition: opacity var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease),
-                visibility var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease),
-                transform var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease);
+    transition: opacity 0.15s ease,
+                visibility 0.15s ease,
+                transform 0.15s ease;
     /* Ensure proper containment */
     box-sizing: border-box;
     /* Create new stacking context to prevent layering issues */
@@ -91,15 +91,15 @@ export const styles = css `
 
   /* Size variants */
   .dropdown__panel--small {
-    font-size: var(--nuraly-dropdown-small-font-size, 0.75rem);
+    font-size: 0.75rem;
   }
 
   .dropdown__panel--medium {
-    font-size: var(--nuraly-dropdown-font-size, 0.875rem);
+    font-size: 0.875rem;
   }
 
   .dropdown__panel--large {
-    font-size: var(--nuraly-dropdown-large-font-size, 1rem);
+    font-size: 1rem;
   }
 
   /* Animation variants */
@@ -123,8 +123,8 @@ export const styles = css `
 
   /* Fade animation - opacity only */
   .dropdown__panel--fade {
-    transition: opacity var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease),
-                visibility var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease);
+    transition: opacity 0.15s ease,
+                visibility 0.15s ease;
   }
 
   .dropdown__panel--fade:not(.dropdown__panel--open) {
@@ -141,9 +141,9 @@ export const styles = css `
 
   /* Slide animation - slide down/up with opacity */
   .dropdown__panel--slide {
-    transition: opacity var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease),
-                visibility var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease),
-                transform var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease);
+    transition: opacity 0.15s ease,
+                visibility 0.15s ease,
+                transform 0.15s ease;
   }
 
   .dropdown__panel--slide:not(.dropdown__panel--open) {
@@ -167,9 +167,9 @@ export const styles = css `
 
   /* Scale animation - scale and opacity */
   .dropdown__panel--scale {
-    transition: opacity var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease),
-                visibility var(--nuraly-dropdown-animation-duration, 0.15s) var(--nuraly-dropdown-animation-timing, ease),
-                transform var(--nuraly-dropdown-animation-duration, 0.15s) cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition: opacity 0.15s ease,
+                visibility 0.15s ease,
+                transform 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
   }
 
   .dropdown__panel--scale:not(.dropdown__panel--open) {
@@ -202,9 +202,9 @@ export const styles = css `
     position: absolute;
     width: 0;
     height: 0;
-    border: var(--nuraly-dropdown-arrow-size) solid transparent;
-    border-bottom-color: var(--nuraly-dropdown-background);
-    top: calc(-1 * var(--nuraly-dropdown-arrow-size) * 2);
+    border: 5px solid transparent;
+    border-bottom-color: #ffffff;
+    top: calc(-1 * 5px * 2);
     left: 50%;
     transform: translateX(-50%);
   }
@@ -214,10 +214,10 @@ export const styles = css `
     position: absolute;
     width: 0;
     height: 0;
-    border: calc(var(--nuraly-dropdown-arrow-size) + 1px) solid transparent;
-    border-bottom-color: var(--nuraly-dropdown-border-color);
-    top: calc(-1 * var(--nuraly-dropdown-arrow-size) - 1px);
-    left: calc(-1 * var(--nuraly-dropdown-arrow-size) - 1px);
+    border: calc(5px + 1px) solid transparent;
+    border-bottom-color: #e0e0e0;
+    top: calc(-1 * 5px - 1px);
+    left: calc(-1 * 5px - 1px);
   }
 
   /* Content areas */
@@ -237,55 +237,55 @@ export const styles = css `
   .dropdown__item {
     display: flex;
     align-items: center;
-    gap: var(--nuraly-dropdown-item-gap);
-    padding: var(--nuraly-dropdown-item-padding);
-    background: var(--nuraly-color-dropdown-item-background);
+    gap: 0.5rem;
+    padding: 0.5rem 1rem;
+    background: transparent;
     border: none;
-    color: var(--nuraly-color-dropdown-item-text);
+    color: #161616;
     cursor: pointer;
     text-align: left;
     width: 100%;
-    min-height: var(--nuraly-dropdown-item-min-height);
-    transition: var(--nuraly-dropdown-item-transition);
+    min-height: 2.5rem;
+    transition: background-color 0.15s ease;
     font-size: inherit;
     font-family: inherit;
-    line-height: var(--nuraly-dropdown-item-line-height);
+    line-height: 1.5;
     position: relative;
   }
 
   .dropdown__item:hover:not(.dropdown__item--disabled) {
-    background: var(--nuraly-color-dropdown-item-background-hover);
-    color: var(--nuraly-color-dropdown-item-text-hover);
+    background: #f4f4f4;
+    color: #161616;
   }
 
   .dropdown__item:focus {
     outline: none;
-    background: var(--nuraly-color-dropdown-item-background-focus);
-    color: var(--nuraly-color-dropdown-item-text-focus);
+    background: #f4f4f4;
+    color: #161616;
   }
 
   .dropdown__item:focus-visible {
-    outline: 2px solid var(--nuraly-focus-color, #0f62fe);
+    outline: 2px solid #0f62fe;
     outline-offset: -2px;
-    background: var(--nuraly-color-dropdown-item-background-focus);
-    color: var(--nuraly-color-dropdown-item-text-focus);
+    background: #f4f4f4;
+    color: #161616;
   }
 
   .dropdown__item:active:not(.dropdown__item--disabled) {
-    background: var(--nuraly-color-dropdown-item-background-active);
-    color: var(--nuraly-color-dropdown-item-text-active);
+    background: #f4f4f4;
+    color: #161616;
   }
 
   .dropdown__item--disabled {
-    opacity: var(--nuraly-dropdown-item-disabled-opacity, 0.5);
+    opacity: 0.5;
     cursor: not-allowed;
     pointer-events: none;
   }
 
   .dropdown__item-icon {
     flex-shrink: 0;
-    width: var(--nuraly-dropdown-item-icon-size);
-    height: var(--nuraly-dropdown-item-icon-size);
+    width: 1rem;
+    height: 1rem;
   }
 
   .dropdown__item-label {
@@ -297,8 +297,8 @@ export const styles = css `
 
   .dropdown__divider {
     height: 1px;
-    background: var(--nuraly-dropdown-divider-color);
-    margin: var(--nuraly-dropdown-divider-margin);
+    background: #e0e0e0;
+    margin: 0.25rem 0;
   }
 
   /* Cascading dropdown styles */
@@ -341,14 +341,14 @@ export const styles = css `
   .dropdown__submenu {
     position: absolute;
     top: 0;
-    z-index: calc(var(--nuraly-dropdown-z-index, 9999) + 1);
-    background: var(--nuraly-color-dropdown-background, #ffffff);
-    border: var(--nuraly-dropdown-border-width, 1px) solid var(--nuraly-color-dropdown-border, #e0e0e0);
-    border-radius: var(--nuraly-dropdown-border-radius, 6px);
-    box-shadow: var(--nuraly-dropdown-shadow, 0 2px 6px rgba(0, 0, 0, 0.15));
-    min-width: var(--nuraly-dropdown-min-width, 10rem);
-    max-width: var(--nuraly-dropdown-max-width, 20rem);
-    max-height: var(--nuraly-dropdown-max-height, auto);
+    z-index: calc(9999 + 1);
+    background: #ffffff;
+    border: 1px solid #e0e0e0;
+    border-radius: 6px;
+    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
+    min-width: 10rem;
+    max-width: 20rem;
+    max-height: auto;
     overflow: auto;
     box-sizing: border-box;
     animation: fadeInSubmenu 0.15s ease;
@@ -359,7 +359,7 @@ export const styles = css `
   }
 
   .dropdown__custom-content {
-    padding: var(--nuraly-dropdown-item-padding, 8px 12px);
+    padding: 8px 12px;
     max-width: 100%;
     box-sizing: border-box;
   }
@@ -370,13 +370,13 @@ export const styles = css `
     margin: 0 0 8px 0;
     font-size: 0.875rem;
     font-weight: 600;
-    color: var(--nuraly-color-text-primary);
+    color: #161616;
   }
 
   .dropdown__custom-content p {
     margin: 0 0 8px 0;
     font-size: 0.75rem;
-    color: var(--nuraly-color-text-secondary);
+    color: #525252;
     line-height: 1.4;
   }
 
@@ -431,13 +431,13 @@ export const styles = css `
 
   /* Focus styles for accessibility */
   :host(:focus-within) .dropdown__trigger {
-    outline: var(--nuraly-dropdown-focus-outline);
-    outline-offset: var(--nuraly-dropdown-focus-offset);
+    outline: 2px solid #7c3aed;
+    outline-offset: 2px;
   }
 
   /* Disabled state */
   :host([disabled]) {
-    opacity: var(--nuraly-dropdown-disabled-opacity, 0.5);
+    opacity: 0.5;
     pointer-events: none;
   }
 

package/dist/src/components/dropdown/interfaces/controller-interfaces.d.ts

@@ -0,0 +1,79 @@
+import { ReactiveControllerHost } from 'lit';
+import { DropdownItem, DropdownPlacement, DropdownTrigger, DropdownAnimation, DropdownSize } from '../dropdown.types.js';
+/**
+ * Base dropdown controller interface
+ */
+export interface DropdownBaseController {
+    host: DropdownHost;
+}
+/**
+ * Dropdown host interface - represents the dropdown component
+ */
+export interface DropdownHost extends ReactiveControllerHost {
+    open: boolean;
+    disabled: boolean;
+    placement: DropdownPlacement;
+    trigger: DropdownTrigger;
+    size: DropdownSize;
+    animation: DropdownAnimation;
+    arrow: boolean;
+    autoClose: boolean;
+    closeOnOutsideClick: boolean;
+    closeOnEscape: boolean;
+    offset: number;
+    delay: number;
+    maxHeight: string;
+    minWidth: string;
+    items?: DropdownItem[];
+    shadowRoot: ShadowRoot | null;
+    requestUpdate(): void;
+}
+/**
+ * Error handler interface
+ */
+export interface ErrorHandler {
+    handleError(error: Error, context: string): void;
+}
+/**
+ * Dropdown positioning information
+ */
+export interface DropdownPosition {
+    top: number;
+    left: number;
+    width: number;
+    placement: 'bottom' | 'top' | 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end';
+}
+/**
+ * Available space calculation for dropdown positioning
+ */
+export interface DropdownSpace {
+    above: number;
+    below: number;
+    left: number;
+    right: number;
+}
+/**
+ * Dropdown controller specific interface
+ */
+export interface DropdownController extends DropdownBaseController {
+    isOpen: boolean;
+    position: DropdownPosition;
+    open(): void;
+    close(): void;
+    toggle(): void;
+    calculatePosition?(): void;
+}
+/**
+ * Event data interfaces
+ */
+export interface DropdownOpenEventDetail {
+    dropdown: DropdownHost;
+}
+export interface DropdownCloseEventDetail {
+    dropdown: DropdownHost;
+}
+export interface DropdownItemClickEventDetail {
+    item: DropdownItem;
+    dropdown: DropdownHost;
+}
+//# sourceMappingURL=controller-interfaces.d.ts.map

package/dist/src/components/dropdown/interfaces/controller-interfaces.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=controller-interfaces.js.map

package/dist/src/components/dropdown/interfaces/index.d.ts

@@ -0,0 +1,2 @@
+export * from './controller-interfaces.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/components/dropdown/interfaces/index.js

@@ -0,0 +1,2 @@
+export * from './controller-interfaces.js';
+//# sourceMappingURL=index.js.map

package/dist/src/components/dropdown/templates/nr-dropdown-item.d.ts

@@ -0,0 +1,12 @@
+import { LitElement } from 'lit';
+export declare class HyDropdownItem extends LitElement {
+    static styles: import("lit").CSSResult[];
+    icon: string;
+    disabled: boolean;
+    label: string;
+    value: string;
+    additionalData: any;
+    onClick(clickItemEvent: Event): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+//# sourceMappingURL=nr-dropdown-item.d.ts.map

package/dist/src/components/dropdown/templates/nr-dropdown-item.js

@@ -0,0 +1,55 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html, nothing } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { styles } from './nr-dropdown-item.style.js';
+let HyDropdownItem = class HyDropdownItem extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.disabled = false;
+    }
+    onClick(clickItemEvent) {
+        console.log(this.additionalData, 'clickItemEvent');
+        clickItemEvent.stopPropagation();
+        if (!this.disabled) {
+            this.dispatchEvent(new CustomEvent('click-item', {
+                detail: { value: this.value, additionalData: this.additionalData },
+                composed: true,
+                bubbles: true,
+            }));
+        }
+    }
+    render() {
+        return html `
+      <div @click=${this.onClick}>
+        ${this.icon ? html `<nr-icon name=${this.icon}></nr-icon>` : nothing}
+        <nr-label class="option-label">${this.label}</nr-label>
+      </div>
+    `;
+    }
+};
+HyDropdownItem.styles = styles;
+__decorate([
+    property({ reflect: true, type: String })
+], HyDropdownItem.prototype, "icon", void 0);
+__decorate([
+    property({ reflect: true, type: Boolean })
+], HyDropdownItem.prototype, "disabled", void 0);
+__decorate([
+    property()
+], HyDropdownItem.prototype, "label", void 0);
+__decorate([
+    property()
+], HyDropdownItem.prototype, "value", void 0);
+__decorate([
+    property()
+], HyDropdownItem.prototype, "additionalData", void 0);
+HyDropdownItem = __decorate([
+    customElement('nr-dropdown-item')
+], HyDropdownItem);
+export { HyDropdownItem };
+//# sourceMappingURL=nr-dropdown-item.js.map

package/dist/src/components/dropdown/templates/nr-dropdown-item.style.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult[];
+//# sourceMappingURL=nr-dropdown-item.style.d.ts.map

package/dist/src/components/dropdown/templates/nr-dropdown-item.style.js

@@ -0,0 +1,34 @@
+import { css } from 'lit';
+const dropdownItemStyle = css `
+    div {
+        padding: 0;
+        cursor: pointer;
+        background-color: #ffffff;
+        display: flex;
+        align-items: center;
+        color: #161616;
+        font-size: 0.875rem; /* Default value added */
+
+    }
+    nr-icon {
+        display: flex;
+    }
+    :host(:not([disabled])) div:hover {
+        background-color: #f4f4f4;
+        margin-left: -1px;
+    }
+    :host([disabled]) div {
+        background-color: #f4f4f4;
+        cursor: not-allowed;
+        color: #c6c6c6;
+    }
+
+    :host(:not([icon])) .option-label {
+        padding-left: 1rem;
+    }
+    :host([icon]) .option-label {
+        padding-left: 0.5rem;
+    }
+`;
+export const styles = [dropdownItemStyle];
+//# sourceMappingURL=nr-dropdown-item.style.js.map

package/dist/src/components/dropdown/templates/nr-dropdown-menu.d.ts

@@ -0,0 +1,18 @@
+import { LitElement } from 'lit';
+import { DropDownDirection } from '../dropdown.types';
+export declare class HyDropdownMenu extends LitElement {
+    static styles: import("lit").CSSResult[];
+    menuOption: HTMLElement;
+    disabled: boolean;
+    icon: string;
+    label: string;
+    direction: DropDownDirection;
+    showChildren: boolean;
+    firstUpdated(): void;
+    onMouseEnterMenu: () => void;
+    onMouseLeaveMenu: () => void;
+    onClickMenu(menuClickEvent: Event): void;
+    disconnectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+//# sourceMappingURL=nr-dropdown-menu.d.ts.map

package/dist/src/components/dropdown/templates/nr-dropdown-menu.js

@@ -0,0 +1,70 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html, nothing } from 'lit';
+import { customElement, property, query, state } from 'lit/decorators.js';
+import { styles } from './nr-dropdown-menu.style.js';
+let HyDropdownMenu = class HyDropdownMenu extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.disabled = false;
+        this.showChildren = false;
+        this.onMouseEnterMenu = () => {
+            if (!this.disabled)
+                this.showChildren = true;
+        };
+        this.onMouseLeaveMenu = () => {
+            if (!this.disabled)
+                this.showChildren = false;
+        };
+    }
+    firstUpdated() {
+        this.menuOption.addEventListener('mouseenter', this.onMouseEnterMenu);
+        this.menuOption.addEventListener('mouseleave', this.onMouseLeaveMenu);
+    }
+    onClickMenu(menuClickEvent) {
+        menuClickEvent.stopPropagation();
+    }
+    disconnectedCallback() {
+        this.menuOption.removeEventListener('mouseenter', this.onMouseEnterMenu);
+        this.menuOption.removeEventListener('mouseleave', this.onMouseLeaveMenu);
+    }
+    render() {
+        return html `<div @mousedown=${this.onClickMenu}>
+      ${this.icon ? html `<nr-icon name=${this.icon}></nr-icon>` : nothing}
+      <nr-label class="menu-label"> ${this.label}</nr-label>
+      <nr-icon
+        name="${this.direction === "right" /* DropDownDirection.Right */ ? 'caret-right' : 'caret-left'}"
+        id="caret-icon"
+      ></nr-icon>
+      <slot style="display:${this.showChildren ? 'block' : 'none'}"></slot>
+    </div>`;
+    }
+};
+HyDropdownMenu.styles = styles;
+__decorate([
+    query('div')
+], HyDropdownMenu.prototype, "menuOption", void 0);
+__decorate([
+    property({ reflect: true, type: Boolean })
+], HyDropdownMenu.prototype, "disabled", void 0);
+__decorate([
+    property({ reflect: true, type: String })
+], HyDropdownMenu.prototype, "icon", void 0);
+__decorate([
+    property()
+], HyDropdownMenu.prototype, "label", void 0);
+__decorate([
+    property({ reflect: true })
+], HyDropdownMenu.prototype, "direction", void 0);
+__decorate([
+    state()
+], HyDropdownMenu.prototype, "showChildren", void 0);
+HyDropdownMenu = __decorate([
+    customElement('nr-dropdown-menu')
+], HyDropdownMenu);
+export { HyDropdownMenu };
+//# sourceMappingURL=nr-dropdown-menu.js.map

package/dist/src/components/dropdown/templates/nr-dropdown-menu.style.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult[];
+//# sourceMappingURL=nr-dropdown-menu.style.d.ts.map

package/dist/src/components/dropdown/templates/nr-dropdown-menu.style.js

@@ -0,0 +1,49 @@
+import { css } from 'lit';
+const dropdownMenuStyle = css `
+  div {
+    padding: 0;
+    position: relative;
+    cursor: pointer;
+    background-color: #ffffff;
+    display: flex;
+    align-items: center;
+  }
+  nr-icon {
+    display: flex;
+  }
+  #caret-icon {
+    flex-grow: 1;
+    justify-content: flex-end;
+  }
+
+  :host(:not([disabled])) div:hover {
+    background-color: #f4f4f4;
+  }
+  :host([disabled]) div {
+    cursor: not-allowed;
+    background-color: #f4f4f4;
+    color: #c6c6c6;
+  }
+
+  ::slotted(*) {
+    z-index: 1000;
+    top: 0;
+    cursor: pointer;
+  }
+  :host([direction='left']) ::slotted(*) {
+    right: calc(200px - 0px);
+  }
+
+  :host([direction='right']) ::slotted(*) {
+    left: calc(200px - 0px);
+  }
+
+  :host(:not([icon])) .menu-label {
+    padding-left: 1rem;
+  }
+  :host([icon]) .menu-label {
+    padding-left: 0.5rem;
+  }
+`;
+export const styles = [dropdownMenuStyle];
+//# sourceMappingURL=nr-dropdown-menu.style.js.map