@aquera/nile-elements 0.0.1-beta.1

package/dist/src/internal/scroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll.js","sourceRoot":"","sources":["../../../src/internal/scroll.ts"],"names":[],"mappings":"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","sourcesContent":["import { getOffset } from './offset';\n\nconst locks = new Set();\n\n/** Returns the width of the document's scrollbar */\nfunction getScrollbarWidth() {\n  const documentWidth = document.documentElement.clientWidth;\n  return Math.abs(window.innerWidth - documentWidth);\n}\n\n/**\n * Prevents body scrolling. Keeps track of which elements requested a lock so multiple levels of locking are possible\n * without premature unlocking.\n */\nexport function lockBodyScrolling(lockingEl: HTMLElement) {\n  locks.add(lockingEl);\n\n  // When the first lock is created, set the scroll lock size to match the scrollbar's width to prevent content from\n  // shifting. We only do this on the first lock because the scrollbar width will measure zero after overflow is hidden.\n  if (!document.body.classList.contains('nile-scroll-lock')) {\n    const scrollbarWidth = getScrollbarWidth(); // must be measured before the `nile-scroll-lock` class is applied\n    document.body.classList.add('nile-scroll-lock');\n    document.body.style.setProperty('--nile-scroll-lock-size', `${scrollbarWidth}px`);\n  }\n}\n\n/**\n * Unlocks body scrolling. Scrolling will only be unlocked once all elements that requested a lock call this method.\n */\nexport function unlockBodyScrolling(lockingEl: HTMLElement) {\n  locks.delete(lockingEl);\n\n  if (locks.size === 0) {\n    document.body.classList.remove('nile-scroll-lock');\n    document.body.style.removeProperty('--nile-scroll-lock-size');\n  }\n}\n\n/** Scrolls an element into view of its container. If the element is already in view, nothing will happen. */\nexport function scrollIntoView(\n  element: HTMLElement,\n  container: HTMLElement,\n  direction: 'horizontal' | 'vertical' | 'both' = 'vertical',\n  behavior: 'smooth' | 'auto' = 'smooth'\n) {\n  const offset = getOffset(element, container);\n  const offsetTop = offset.top + container.scrollTop;\n  const offsetLeft = offset.left + container.scrollLeft;\n  const minX = container.scrollLeft;\n  const maxX = container.scrollLeft + container.offsetWidth;\n  const minY = container.scrollTop;\n  const maxY = container.scrollTop + container.offsetHeight;\n\n  if (direction === 'horizontal' || direction === 'both') {\n    if (offsetLeft < minX) {\n      container.scrollTo({ left: offsetLeft, behavior });\n    } else if (offsetLeft + element.clientWidth > maxX) {\n      container.scrollTo({ left: offsetLeft - container.offsetWidth + element.clientWidth, behavior });\n    }\n  }\n\n  if (direction === 'vertical' || direction === 'both') {\n    if (offsetTop < minY) {\n      container.scrollTo({ top: offsetTop, behavior });\n    } else if (offsetTop + element.clientHeight > maxY) {\n      container.scrollTo({ top: offsetTop - container.offsetHeight + element.clientHeight, behavior });\n    }\n  }\n}\n"]}

package/dist/src/internal/slot.d.ts

@@ -0,0 +1,23 @@
+import type { ReactiveController, ReactiveControllerHost } from 'lit';
+/** A reactive controller that determines when slots exist. */
+export declare class HasSlotController implements ReactiveController {
+    host: ReactiveControllerHost & Element;
+    slotNames: string[];
+    constructor(host: ReactiveControllerHost & Element, ...slotNames: string[]);
+    private hasDefaultSlot;
+    private hasNamedSlot;
+    test(slotName: string): boolean;
+    hostConnected(): void;
+    hostDisconnected(): void;
+    handleSlotChange(event: Event): void;
+}
+/**
+ * Given a slot, this function iterates over all of its assigned element and text nodes and returns the concatenated
+ * HTML as a string. This is useful because we can't use slot.innerHTML as an alternative.
+ */
+export declare function getInnerHTML(slot: HTMLSlotElement): string;
+/**
+ * Given a slot, this function iterates over all of its assigned text nodes and returns the concatenated text as a
+ * string. This is useful because we can't use slot.textContent as an alternative.
+ */
+export declare function getTextContent(slot: HTMLSlotElement | undefined | null): string;

package/dist/src/internal/slot.js

@@ -0,0 +1,82 @@
+/** A reactive controller that determines when slots exist. */
+export class HasSlotController {
+    constructor(host, ...slotNames) {
+        this.slotNames = [];
+        (this.host = host).addController(this);
+        this.slotNames = slotNames;
+        this.handleSlotChange = this.handleSlotChange.bind(this);
+    }
+    hasDefaultSlot() {
+        return [...this.host.childNodes].some(node => {
+            if (node.nodeType === node.TEXT_NODE && node.textContent.trim() !== '') {
+                return true;
+            }
+            if (node.nodeType === node.ELEMENT_NODE) {
+                const el = node;
+                const tagName = el.tagName.toLowerCase();
+                // Ignore visually hidden elements since they aren't rendered
+                if (tagName === 'nile-visually-hidden') {
+                    return false;
+                }
+                // If it doesn't have a slot attribute, it's part of the default slot
+                if (!el.hasAttribute('slot')) {
+                    return true;
+                }
+            }
+            return false;
+        });
+    }
+    hasNamedSlot(name) {
+        return this.host.querySelector(`:scope > [slot="${name}"]`) !== null;
+    }
+    test(slotName) {
+        return slotName === '[default]' ? this.hasDefaultSlot() : this.hasNamedSlot(slotName);
+    }
+    hostConnected() {
+        this.host.shadowRoot.addEventListener('slotchange', this.handleSlotChange);
+    }
+    hostDisconnected() {
+        this.host.shadowRoot.removeEventListener('slotchange', this.handleSlotChange);
+    }
+    handleSlotChange(event) {
+        const slot = event.target;
+        if ((this.slotNames.includes('[default]') && !slot.name) || (slot.name && this.slotNames.includes(slot.name))) {
+            this.host.requestUpdate();
+        }
+    }
+}
+/**
+ * Given a slot, this function iterates over all of its assigned element and text nodes and returns the concatenated
+ * HTML as a string. This is useful because we can't use slot.innerHTML as an alternative.
+ */
+export function getInnerHTML(slot) {
+    const nodes = slot.assignedNodes({ flatten: true });
+    let html = '';
+    [...nodes].forEach(node => {
+        if (node.nodeType === Node.ELEMENT_NODE) {
+            html += node.outerHTML;
+        }
+        if (node.nodeType === Node.TEXT_NODE) {
+            html += node.textContent;
+        }
+    });
+    return html;
+}
+/**
+ * Given a slot, this function iterates over all of its assigned text nodes and returns the concatenated text as a
+ * string. This is useful because we can't use slot.textContent as an alternative.
+ */
+export function getTextContent(slot) {
+    if (!slot) {
+        return '';
+    }
+    const nodes = slot.assignedNodes({ flatten: true });
+    let text = '';
+    [...nodes].forEach(node => {
+        if (node.nodeType === Node.TEXT_NODE) {
+            text += node.textContent;
+        }
+    });
+    return text;
+}
+//# sourceMappingURL=slot.js.map

package/dist/src/internal/slot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.js","sourceRoot":"","sources":["../../../src/internal/slot.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\n/** A reactive controller that determines when slots exist. */\nexport class HasSlotController implements ReactiveController {\n  host: ReactiveControllerHost & Element;\n  slotNames: string[] = [];\n\n  constructor(host: ReactiveControllerHost & Element, ...slotNames: string[]) {\n    (this.host = host).addController(this);\n    this.slotNames = slotNames;\n    this.handleSlotChange = this.handleSlotChange.bind(this);\n  }\n\n  private hasDefaultSlot() {\n    return [...this.host.childNodes].some(node => {\n      if (node.nodeType === node.TEXT_NODE && node.textContent!.trim() !== '') {\n        return true;\n      }\n\n      if (node.nodeType === node.ELEMENT_NODE) {\n        const el = node as HTMLElement;\n        const tagName = el.tagName.toLowerCase();\n\n        // Ignore visually hidden elements since they aren't rendered\n        if (tagName === 'nile-visually-hidden') {\n          return false;\n        }\n\n        // If it doesn't have a slot attribute, it's part of the default slot\n        if (!el.hasAttribute('slot')) {\n          return true;\n        }\n      }\n\n      return false;\n    });\n  }\n\n  private hasNamedSlot(name: string) {\n    return this.host.querySelector(`:scope > [slot=\"${name}\"]`) !== null;\n  }\n\n  test(slotName: string) {\n    return slotName === '[default]' ? this.hasDefaultSlot() : this.hasNamedSlot(slotName);\n  }\n\n  hostConnected() {\n    this.host.shadowRoot!.addEventListener('slotchange', this.handleSlotChange);\n  }\n\n  hostDisconnected() {\n    this.host.shadowRoot!.removeEventListener('slotchange', this.handleSlotChange);\n  }\n\n  handleSlotChange(event: Event) {\n    const slot = event.target as HTMLSlotElement;\n\n    if ((this.slotNames.includes('[default]') && !slot.name) || (slot.name && this.slotNames.includes(slot.name))) {\n      this.host.requestUpdate();\n    }\n  }\n}\n\n/**\n * Given a slot, this function iterates over all of its assigned element and text nodes and returns the concatenated\n * HTML as a string. This is useful because we can't use slot.innerHTML as an alternative.\n */\nexport function getInnerHTML(slot: HTMLSlotElement): string {\n  const nodes = slot.assignedNodes({ flatten: true });\n  let html = '';\n\n  [...nodes].forEach(node => {\n    if (node.nodeType === Node.ELEMENT_NODE) {\n      html += (node as HTMLElement).outerHTML;\n    }\n\n    if (node.nodeType === Node.TEXT_NODE) {\n      html += node.textContent;\n    }\n  });\n\n  return html;\n}\n\n/**\n * Given a slot, this function iterates over all of its assigned text nodes and returns the concatenated text as a\n * string. This is useful because we can't use slot.textContent as an alternative.\n */\nexport function getTextContent(slot: HTMLSlotElement | undefined | null): string {\n  if (!slot) {\n    return '';\n  }\n  const nodes = slot.assignedNodes({ flatten: true });\n  let text = '';\n\n  [...nodes].forEach(node => {\n    if (node.nodeType === Node.TEXT_NODE) {\n      text += node.textContent;\n    }\n  });\n\n  return text;\n}\n"]}

package/dist/src/internal/watch.d.ts

@@ -0,0 +1,26 @@
+import type { LitElement } from 'lit';
+declare type UpdateHandler = (prev?: unknown, next?: unknown) => void;
+declare type NonUndefined<A> = A extends undefined ? never : A;
+declare type UpdateHandlerFunctionKeys<T extends object> = {
+    [K in keyof T]-?: NonUndefined<T[K]> extends UpdateHandler ? K : never;
+}[keyof T];
+interface WatchOptions {
+    /**
+     * If true, will only start watching after the initial update/render
+     */
+    waitUntilFirstUpdate?: boolean;
+}
+/**
+ * Runs when observed properties change, e.g. @property or @state, but before the component updates. To wait for an
+ * update to complete after a change occurs, use `await this.updateComplete` in the handler. To start watching after the
+ * initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.
+ *
+ * Usage:
+ *
+ * @watch('propName')
+ * handlePropChange(oldValue, newValue) {
+ *   ...
+ * }
+ */
+export declare function watch(propertyName: string | string[], options?: WatchOptions): <ElemClass extends LitElement>(proto: ElemClass, decoratedFnName: UpdateHandlerFunctionKeys<ElemClass>) => void;
+export {};

package/dist/src/internal/watch.js

@@ -0,0 +1,40 @@
+/**
+ * Runs when observed properties change, e.g. @property or @state, but before the component updates. To wait for an
+ * update to complete after a change occurs, use `await this.updateComplete` in the handler. To start watching after the
+ * initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.
+ *
+ * Usage:
+ *
+ * @watch('propName')
+ * handlePropChange(oldValue, newValue) {
+ *   ...
+ * }
+ */
+export function watch(propertyName, options) {
+    const resolvedOptions = {
+        waitUntilFirstUpdate: false,
+        ...options
+    };
+    return (proto, decoratedFnName) => {
+        // @ts-expect-error - update is a protected property
+        const { update } = proto;
+        const watchedProperties = Array.isArray(propertyName) ? propertyName : [propertyName];
+        // @ts-expect-error - update is a protected property
+        proto.update = function (changedProps) {
+            watchedProperties.forEach(property => {
+                const key = property;
+                if (changedProps.has(key)) {
+                    const oldValue = changedProps.get(key);
+                    const newValue = this[key];
+                    if (oldValue !== newValue) {
+                        if (!resolvedOptions.waitUntilFirstUpdate || this.hasUpdated) {
+                            this[decoratedFnName](oldValue, newValue);
+                        }
+                    }
+                }
+            });
+            update.call(this, changedProps);
+        };
+    };
+}
+//# sourceMappingURL=watch.js.map

package/dist/src/internal/watch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"watch.js","sourceRoot":"","sources":["../../../src/internal/watch.ts"],"names":[],"mappings":"AAiBA;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,KAAK,CAAC,YAA+B,EAAE,OAAsB;IAC3E,MAAM,eAAe,GAA2B;QAC9C,oBAAoB,EAAE,KAAK;QAC3B,GAAG,OAAO;KACX,CAAC;IACF,OAAO,CAA+B,KAAgB,EAAE,eAAqD,EAAE,EAAE;QAC/G,oDAAoD;QACpD,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;QACzB,MAAM,iBAAiB,GAAG,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC;QAEtF,oDAAoD;QACpD,KAAK,CAAC,MAAM,GAAG,UAA2B,YAA8D;YACtG,iBAAiB,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;gBACnC,MAAM,GAAG,GAAG,QAA2B,CAAC;gBACxC,IAAI,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;oBACzB,MAAM,QAAQ,GAAG,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;oBACvC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC;oBAE3B,IAAI,QAAQ,KAAK,QAAQ,EAAE;wBACzB,IAAI,CAAC,eAAe,CAAC,oBAAoB,IAAI,IAAI,CAAC,UAAU,EAAE;4BAC3D,IAAI,CAAC,eAAe,CAA8B,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;yBACzE;qBACF;iBACF;YACH,CAAC,CAAC,CAAC;YAEH,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;QAClC,CAAC,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC","sourcesContent":["import type { LitElement } from 'lit';\n\ntype UpdateHandler = (prev?: unknown, next?: unknown) => void;\n\ntype NonUndefined<A> = A extends undefined ? never : A;\n\ntype UpdateHandlerFunctionKeys<T extends object> = {\n  [K in keyof T]-?: NonUndefined<T[K]> extends UpdateHandler ? K : never;\n}[keyof T];\n\ninterface WatchOptions {\n  /**\n   * If true, will only start watching after the initial update/render\n   */\n  waitUntilFirstUpdate?: boolean;\n}\n\n/**\n * Runs when observed properties change, e.g. @property or @state, but before the component updates. To wait for an\n * update to complete after a change occurs, use `await this.updateComplete` in the handler. To start watching after the\n * initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n *\n * Usage:\n *\n * @watch('propName')\n * handlePropChange(oldValue, newValue) {\n *   ...\n * }\n */\nexport function watch(propertyName: string | string[], options?: WatchOptions) {\n  const resolvedOptions: Required<WatchOptions> = {\n    waitUntilFirstUpdate: false,\n    ...options\n  };\n  return <ElemClass extends LitElement>(proto: ElemClass, decoratedFnName: UpdateHandlerFunctionKeys<ElemClass>) => {\n    // @ts-expect-error - update is a protected property\n    const { update } = proto;\n    const watchedProperties = Array.isArray(propertyName) ? propertyName : [propertyName];\n\n    // @ts-expect-error - update is a protected property\n    proto.update = function (this: ElemClass, changedProps: Map<keyof ElemClass, ElemClass[keyof ElemClass]>) {\n      watchedProperties.forEach(property => {\n        const key = property as keyof ElemClass;\n        if (changedProps.has(key)) {\n          const oldValue = changedProps.get(key);\n          const newValue = this[key];\n\n          if (oldValue !== newValue) {\n            if (!resolvedOptions.waitUntilFirstUpdate || this.hasUpdated) {\n              (this[decoratedFnName] as unknown as UpdateHandler)(oldValue, newValue);\n            }\n          }\n        }\n      });\n\n      update.call(this, changedProps);\n    };\n  };\n}\n"]}

package/dist/src/nile-badge/index.d.ts

@@ -0,0 +1,37 @@
+import { LitElement } from 'lit';
+/**
+ * An nile-badge element.
+ *
+ * @fires count-changed - Indicates when the count changes
+ * @slot - This element has a slot
+ * @csspart button - The button
+ */
+export declare class NileBadge extends LitElement {
+    static styles: import("lit").CSSResult;
+    /**
+     * Button Lab
+     */
+    name: number;
+    /**
+     * Button Lab
+     */
+    icon: string;
+    /**
+     * Button Lab
+     */
+    active: boolean;
+    get buttonClassMap(): {
+        'nds-badge--active': boolean;
+    };
+    /**
+     * Button Lab
+     */
+    href: string;
+    _hasSlotContent(slotName: string): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-badge': NileBadge;
+    }
+}

package/dist/src/nile-badge/index.js

@@ -0,0 +1,121 @@
+import { __decorate } from "tslib";
+import { LitElement, html, css } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+/**
+ * An nile-badge element.
+ *
+ * @fires count-changed - Indicates when the count changes
+ * @slot - This element has a slot
+ * @csspart button - The button
+ */
+let NileBadge = class NileBadge extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * Button Lab
+         */
+        this.name = 0;
+        /**
+         * Button Lab
+         */
+        this.icon = '';
+        /**
+         * Button Lab
+         */
+        this.active = false;
+        /**
+         * Button Lab
+         */
+        this.href = '/';
+    }
+    get buttonClassMap() {
+        return {
+            'nds-badge--active': this.active,
+        };
+    }
+    _hasSlotContent(slotName) {
+        const slot = this.querySelector(`slot[name=${slotName}]`);
+        console.log(slot, 'slot');
+    }
+    render() {
+        const { name, icon, href } = this;
+        const hrefPath = `/${href}`;
+        return html `
+      <a class="nds-badge ${classMap(this.buttonClassMap)}">
+        <span class="nds-badge__link">${this.name}</span>
+      </a>
+    `;
+    }
+};
+NileBadge.styles = css `
+    :host {
+      display: block;
+    }
+    .nds-badge {
+      width: 24px;
+      height: 24px;
+      border-radius: 9rem;
+      font-size: 14px;
+      justify-content: space-around;
+      font-weight: bold;
+      display: flex;
+      background-color: rgb(221, 221, 221);
+      flex-wrap: nowrap;
+      align-items: center;
+      color: var(--nile-colors-dark-900);
+    }
+
+    .nds-badge:hover {
+      background: rgba(0, 94, 166, 0.1);
+    }
+    
+    .nds-badge__link {
+      font-family: var(--nile-font-family-sans-serif);
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      line-height: 1;
+      letter-spacing: 0.2px;
+      text-decoration: none;
+      font-size: 12px;
+    }
+
+    .nds-badge__link:hover {
+      color: var(--nile-colors-dark-900);
+    }
+    
+    .nds-badge--active {
+      background-color: var(--nile-colors-primary-700);
+      color: var(--nile-colors-neutral-100);
+    }
+
+    .nds-badge--active:hover {
+      background-color: var(---nile-colors-primary-700);
+    }
+
+    .nds-badge__icon {
+      margin-bottom: 0;
+      height: 14px;
+    }
+  `;
+__decorate([
+    property()
+], NileBadge.prototype, "name", void 0);
+__decorate([
+    property()
+], NileBadge.prototype, "icon", void 0);
+__decorate([
+    property()
+], NileBadge.prototype, "active", void 0);
+__decorate([
+    property()
+], NileBadge.prototype, "href", void 0);
+NileBadge = __decorate([
+    customElement('nile-badge')
+], NileBadge);
+export { NileBadge };
+// <span class="nds-badge__icon">
+// <nile-icon name="${this.icon}" size="14" color="#000"></nile-icon>
+// </span>
+//# sourceMappingURL=index.js.map

package/dist/src/nile-badge/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-badge/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD;;;;;;GAMG;AAEH,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,UAAU;IAAzC;;QAqDE;;WAEG;QAEH,SAAI,GAAG,CAAC,CAAC;QAET;;WAEG;QAEH,SAAI,GAAW,EAAE,CAAC;QAElB;;WAEG;QAEH,WAAM,GAAY,KAAK,CAAC;QAQxB;;WAEG;QAEH,SAAI,GAAG,GAAG,CAAC;IAgBb,CAAC;IA1BC,IAAI,cAAc;QAChB,OAAO;YACL,mBAAmB,EAAE,IAAI,CAAC,MAAM;SACjC,CAAC;IACJ,CAAC;IAQD,eAAe,CAAC,QAAgB;QAC9B,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,aAAa,QAAQ,GAAG,CAAC,CAAC;QAC1D,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;IAC5B,CAAC;IAEQ,MAAM;QACb,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;QAClC,MAAM,QAAQ,GAAG,IAAI,IAAI,EAAE,CAAC;QAC5B,OAAO,IAAI,CAAA;4BACa,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC;wCACjB,IAAI,CAAC,IAAI;;KAE5C,CAAC;IACJ,CAAC;CACF,CAAA;AAhGiB,gBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkD1B,CAAA;AAMF;IADC,QAAQ,EAAE;uCACF;AAMT;IADC,QAAQ,EAAE;uCACO;AAMlB;IADC,QAAQ,EAAE;yCACa;AAYxB;IADC,QAAQ,EAAE;uCACA;AAjFA,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CAiGrB;SAjGY,SAAS;AAyGtB,iCAAiC;AACjC,qEAAqE;AACrE,UAAU","sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n/**\n * An nile-badge element.\n *\n * @fires count-changed - Indicates when the count changes\n * @slot - This element has a slot\n * @csspart button - The button\n */\n@customElement('nile-badge')\nexport class NileBadge extends LitElement {\n  static override styles = css`\n    :host {\n      display: block;\n    }\n    .nds-badge {\n      width: 24px;\n      height: 24px;\n      border-radius: 9rem;\n      font-size: 14px;\n      justify-content: space-around;\n      font-weight: bold;\n      display: flex;\n      background-color: rgb(221, 221, 221);\n      flex-wrap: nowrap;\n      align-items: center;\n      color: var(--nile-colors-dark-900);\n    }\n\n    .nds-badge:hover {\n      background: rgba(0, 94, 166, 0.1);\n    }\n    \n    .nds-badge__link {\n      font-family: var(--nile-font-family-sans-serif);\n      font-style: normal;\n      font-weight: 400;\n      font-size: 14px;\n      line-height: 1;\n      letter-spacing: 0.2px;\n      text-decoration: none;\n      font-size: 12px;\n    }\n\n    .nds-badge__link:hover {\n      color: var(--nile-colors-dark-900);\n    }\n    \n    .nds-badge--active {\n      background-color: var(--nile-colors-primary-700);\n      color: var(--nile-colors-neutral-100);\n    }\n\n    .nds-badge--active:hover {\n      background-color: var(---nile-colors-primary-700);\n    }\n\n    .nds-badge__icon {\n      margin-bottom: 0;\n      height: 14px;\n    }\n  `;\n\n  /**\n   * Button Lab\n   */\n  @property()\n  name = 0;\n\n  /**\n   * Button Lab\n   */\n  @property()\n  icon: string = '';\n\n  /**\n   * Button Lab\n   */\n  @property()\n  active: boolean = false;\n\n  get buttonClassMap() {\n    return {\n      'nds-badge--active': this.active,\n    };\n  }\n\n  /**\n   * Button Lab\n   */\n  @property()\n  href = '/';\n\n  _hasSlotContent(slotName: string) {\n    const slot = this.querySelector(`slot[name=${slotName}]`);\n    console.log(slot, 'slot');\n  }\n\n  override render() {\n    const { name, icon, href } = this;\n    const hrefPath = `/${href}`;\n    return html`\n      <a class=\"nds-badge ${classMap(this.buttonClassMap)}\">\n        <span class=\"nds-badge__link\">${this.name}</span>\n      </a>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nile-badge': NileBadge;\n  }\n}\n\n// <span class=\"nds-badge__icon\">\n// <nile-icon name=\"${this.icon}\" size=\"14\" color=\"#000\"></nile-icon>\n// </span>\n"]}

package/dist/src/nile-button/index.d.ts

@@ -0,0 +1 @@
+export { NileButton } from './nile-button';

package/dist/src/nile-button/index.js

@@ -0,0 +1,2 @@
+export { NileButton } from './nile-button';
+//# sourceMappingURL=index.js.map

package/dist/src/nile-button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAO,eAAe,CAAC","sourcesContent":["export { NileButton }  from './nile-button';\n"]}

package/dist/src/nile-button/nile-button.css.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/**
+ * Button CSS
+ */
+export declare const styles: import("lit-element").CSSResult;