@aquera/nile-elements 1.3.4 → 1.3.5

package/dist/src/lib/virtualize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"virtualize.js","sourceRoot":"","sources":["../../../src/lib/virtualize.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2025\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, type TemplateResult, render } from 'lit';\n\nexport interface VirtualizeOptions {\n  items: any[];\n  renderItem: (item: any, index: number) => TemplateResult;\n  scroller?: boolean;\n  itemHeight?: number;\n  containerHeight?: number;\n  overscan?: number;\n}\n\n/**\n * Custom virtualize function that mimics the @lit-labs/virtualizer API\n * but uses our own implementation for better control and customization\n */\nexport function virtualize(options: VirtualizeOptions): TemplateResult {\n  const {\n    items = [],\n    renderItem,\n    scroller = true,\n    itemHeight = 40,\n    containerHeight = 300,\n    overscan = 5\n  } = options;\n\n  // If no items, return empty template\n  if (!items.length) {\n    return html``;\n  }\n\n  // For small datasets, render all items without virtualization\n  if (items.length < 10) {\n    return html`\n      ${items.map((item, index) => renderItem(item, index))}\n    `;\n  }\n\n  // Create a unique ID for this virtualizer instance\n  const virtualizerId = `virtualizer-${Math.random().toString(36).substr(2, 9)}`;\n  \n  return html`\n    <div \n      id=\"${virtualizerId}\"\n      class=\"custom-virtualizer\"\n      style=\"\n        height: ${containerHeight}px; \n        overflow-y: auto; \n        position: relative;\n        contain: layout style paint;\n      \"\n      @scroll=${(e: Event) => {\n        const container = e.target as HTMLElement;\n        const scrollTop = container.scrollTop;\n        \n        // Calculate visible range\n        const start = Math.max(0, Math.floor(scrollTop / itemHeight) - overscan);\n        const end = Math.min(\n          start + Math.ceil(containerHeight / itemHeight) + (overscan * 2),\n          items.length\n        );\n        \n        // Update the virtualized content\n        updateVirtualizedContent(container, items, renderItem, start, end, itemHeight);\n      }}\n    >\n      ${(() => {\n        // Initial render - show first visible items\n        const start = 0;\n        const end = Math.min(\n          Math.ceil(containerHeight / itemHeight) + (overscan * 2),\n          items.length\n        );\n        \n        return html`\n          ${updateVirtualizedContent(null, items, renderItem, start, end, itemHeight)}\n        `;\n      })()}\n    </div>\n  `;\n}\n\n/**\n * Update the virtualized content based on scroll position\n */\nfunction updateVirtualizedContent(\n  container: HTMLElement | null,\n  items: any[],\n  renderItem: (item: any, index: number) => TemplateResult,\n  start: number,\n  end: number,\n  itemHeight: number\n): TemplateResult {\n  const visibleItems = items.slice(start, end);\n  const spacerBefore = start * itemHeight;\n  const spacerAfter = (items.length - end) * itemHeight;\n  \n  return html`\n    ${spacerBefore > 0 ? html`<div style=\"height: ${spacerBefore}px; flex-shrink: 0;\"></div>` : ''}\n    ${visibleItems.map((item, index) => \n      html`<div style=\"height: ${itemHeight}px; flex-shrink: 0;\">${renderItem(item, start + index)}</div>`\n    )}\n    ${spacerAfter > 0 ? html`<div style=\"height: ${spacerAfter}px; flex-shrink: 0;\"></div>` : ''}\n  `;\n}\n\n/**\n * Enhanced virtualize function with better performance and scroll handling\n */\nexport function createVirtualizer(options: VirtualizeOptions) {\n  const {\n    items = [],\n    renderItem,\n    scroller = true,\n    itemHeight = 40,\n    containerHeight = 300,\n    overscan = 5\n  } = options;\n\n  let scrollTop = 0;\n  let isScrolling = false;\n  let scrollTimeout: ReturnType<typeof setTimeout> | undefined;\n\n  const handleScroll = (e: Event) => {\n    const container = e.target as HTMLElement;\n    scrollTop = container.scrollTop;\n    isScrolling = true;\n\n    // Debounce scroll end detection\n    if (scrollTimeout) {\n      clearTimeout(scrollTimeout);\n    }\n    \n    scrollTimeout = setTimeout(() => {\n      isScrolling = false;\n    }, 150);\n  };\n\n  return {\n    handleScroll,\n    getVisibleRange: () => {\n      const start = Math.max(0, Math.floor(scrollTop / itemHeight) - overscan);\n      const end = Math.min(\n        start + Math.ceil(containerHeight / itemHeight) + (overscan * 2),\n        items.length\n      );\n      return { start, end };\n    },\n    getTotalHeight: () => items.length * itemHeight,\n    scrollToItem: (index: number, container: HTMLElement) => {\n      const scrollPosition = index * itemHeight;\n      container.scrollTop = scrollPosition;\n      scrollTop = scrollPosition;\n    }\n  };\n}\n"]}

package/dist/src/lib/virtualize.test.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export {};

package/dist/src/lib/virtualize.test.js

@@ -0,0 +1,57 @@
+/**
+ * Copyright Aquera Inc 2025
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { expect } from '@open-wc/testing';
+import { html } from 'lit';
+import { virtualize } from './virtualize.js';
+describe('Custom Virtualize', () => {
+    it('should render empty template for empty items array', () => {
+        const result = virtualize({
+            items: [],
+            renderItem: () => html `<div>test</div>`
+        });
+        expect(result).to.exist;
+    });
+    it('should render all items for small datasets without virtualization', () => {
+        const items = Array.from({ length: 5 }, (_, i) => ({ id: i, name: `Item ${i}` }));
+        const result = virtualize({
+            items,
+            renderItem: (item) => html `<div>${item.name}</div>`
+        });
+        expect(result).to.exist;
+    });
+    it('should use virtualization for large datasets', () => {
+        const items = Array.from({ length: 100 }, (_, i) => ({ id: i, name: `Item ${i}` }));
+        const result = virtualize({
+            items,
+            renderItem: (item) => html `<div>${item.name}</div>`,
+            itemHeight: 40,
+            containerHeight: 300
+        });
+        expect(result).to.exist;
+    });
+    it('should accept scroller option', () => {
+        const items = Array.from({ length: 50 }, (_, i) => ({ id: i, name: `Item ${i}` }));
+        const result = virtualize({
+            items,
+            renderItem: (item) => html `<div>${item.name}</div>`,
+            scroller: true
+        });
+        expect(result).to.exist;
+    });
+    it('should accept custom itemHeight and containerHeight', () => {
+        const items = Array.from({ length: 50 }, (_, i) => ({ id: i, name: `Item ${i}` }));
+        const result = virtualize({
+            items,
+            renderItem: (item) => html `<div>${item.name}</div>`,
+            itemHeight: 60,
+            containerHeight: 400,
+            overscan: 10
+        });
+        expect(result).to.exist;
+    });
+});
+//# sourceMappingURL=virtualize.test.js.map

package/dist/src/lib/virtualize.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"virtualize.test.js","sourceRoot":"","sources":["../../../src/lib/virtualize.test.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2025\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { expect } from '@open-wc/testing';\nimport { html } from 'lit';\nimport { virtualize } from './virtualize.js';\n\ndescribe('Custom Virtualize', () => {\n  it('should render empty template for empty items array', () => {\n    const result = virtualize({\n      items: [],\n      renderItem: () => html`<div>test</div>`\n    });\n    \n    expect(result).to.exist;\n  });\n\n  it('should render all items for small datasets without virtualization', () => {\n    const items = Array.from({ length: 5 }, (_, i) => ({ id: i, name: `Item ${i}` }));\n    \n    const result = virtualize({\n      items,\n      renderItem: (item) => html`<div>${item.name}</div>`\n    });\n    \n    expect(result).to.exist;\n  });\n\n  it('should use virtualization for large datasets', () => {\n    const items = Array.from({ length: 100 }, (_, i) => ({ id: i, name: `Item ${i}` }));\n    \n    const result = virtualize({\n      items,\n      renderItem: (item) => html`<div>${item.name}</div>`,\n      itemHeight: 40,\n      containerHeight: 300\n    });\n    \n    expect(result).to.exist;\n  });\n\n  it('should accept scroller option', () => {\n    const items = Array.from({ length: 50 }, (_, i) => ({ id: i, name: `Item ${i}` }));\n    \n    const result = virtualize({\n      items,\n      renderItem: (item) => html`<div>${item.name}</div>`,\n      scroller: true\n    });\n    \n    expect(result).to.exist;\n  });\n\n  it('should accept custom itemHeight and containerHeight', () => {\n    const items = Array.from({ length: 50 }, (_, i) => ({ id: i, name: `Item ${i}` }));\n    \n    const result = virtualize({\n      items,\n      renderItem: (item) => html`<div>${item.name}</div>`,\n      itemHeight: 60,\n      containerHeight: 400,\n      overscan: 10\n    });\n    \n    expect(result).to.exist;\n  });\n});\n"]}

package/dist/src/nile-badge/__snapshots__/nile-badge.test.snap.js

@@ -0,0 +1,17 @@
+/* @web/test-runner snapshot v1 */
+export const snapshots = {};
+
+snapshots["NileBadge should display the default slot content"] = 
+`<span
+  class="badge badge--badge-color badge--normal"
+  part="base"
+>
+  <slot
+    class="badge__content"
+    part="content"
+  >
+  </slot>
+</span>
+`;
+/* end snapshot NileBadge should display the default slot content */
+

package/dist/src/nile-calendar/__snapshots__/nile-calendar.test.snap.js

@@ -0,0 +1,310 @@
+/* @web/test-runner snapshot v1 */
+export const snapshots = {};
+
+snapshots["NileCalendar renders correctly with default properties"] = 
+`<div class="base">
+  <div class="calendar-config hidden">
+    <div class="calendar-switcher">
+      <nile-tab-group
+        centered=""
+        value="absolute"
+      >
+        <nile-tab
+          active=""
+          aria-disabled="false"
+          aria-selected="true"
+          centered=""
+          id="nile-tab-1"
+          panel="absolute"
+          role="tab"
+          slot="nav"
+        >
+          Absolute
+        </nile-tab>
+        <nile-tab
+          aria-disabled="false"
+          aria-selected="false"
+          centered=""
+          id="nile-tab-2"
+          panel="relative"
+          role="tab"
+          slot="nav"
+        >
+          Relative
+        </nile-tab>
+      </nile-tab-group>
+    </div>
+  </div>
+  <div class="calendar-wrapper">
+    <div class="calendar-container">
+      <div class="calendar">
+        <div class="calendar-header">
+          <nile-icon
+            class="calendar-header__month-navigation"
+            color="black"
+            description=""
+            method="fill"
+            name="arrowleft"
+            set="local"
+            size="16"
+            style="--nile-svg-fill: black; --nile-svg-height: 16px; --nile-svg-width: 16px;"
+          >
+          </nile-icon>
+          <span>
+            August
+            2025
+          </span>
+          <nile-icon
+            class="calendar-header__month-navigation"
+            color="black"
+            description=""
+            method="fill"
+            name="arrowright"
+            set="local"
+            size="16"
+            style="--nile-svg-fill: black; --nile-svg-height: 16px; --nile-svg-width: 16px;"
+          >
+          </nile-icon>
+        </div>
+        <div class="days_container">
+          <div class="day_name">
+            Su
+          </div>
+          <div class="day_name">
+            Mo
+          </div>
+          <div class="day_name">
+            Tu
+          </div>
+          <div class="day_name">
+            We
+          </div>
+          <div class="day_name">
+            Th
+          </div>
+          <div class="day_name">
+            Fr
+          </div>
+          <div class="day_name">
+            Sa
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              27
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              28
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              29
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              30
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              31
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              1
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              2
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              3
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              4
+              <div class="current__date__dot">
+              </div>
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              5
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              6
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              7
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              8
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              9
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              10
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              11
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              12
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              13
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              14
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              15
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              16
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              17
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              18
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              19
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              20
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              21
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              22
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              23
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              24
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              25
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              26
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              27
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              28
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              29
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              30
+            </span>
+          </div>
+          <div class="day_date">
+            <span style="position:relative;">
+              31
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              1
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              2
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              3
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              4
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              5
+            </span>
+          </div>
+          <div class="day_date filler">
+            <span style="position:relative;">
+              6
+            </span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+/* end snapshot NileCalendar renders correctly with default properties */
+

package/dist/src/nile-card/__snapshots__/nile-card.test.snap.js

@@ -0,0 +1,34 @@
+/* @web/test-runner snapshot v1 */
+export const snapshots = {};
+
+snapshots["Nile Card should render the card properly"] = 
+`<div
+  class="card card--has-footer"
+  part="base"
+>
+  <div
+    class="body__wrapper"
+    part="body__wrapper"
+  >
+    <slot
+      class="card__header"
+      name="header"
+      part="header"
+    >
+    </slot>
+    <slot
+      class="card__body"
+      part="body"
+    >
+    </slot>
+  </div>
+  <slot
+    class="card__footer"
+    name="footer"
+    part="footer"
+  >
+  </slot>
+</div>
+`;
+/* end snapshot Nile Card should render the card properly */
+

package/dist/src/nile-checkbox/__snapshots__/nile-checkbox.test.snap.js

@@ -0,0 +1,31 @@
+/* @web/test-runner snapshot v1 */
+export const snapshots = {};
+
+snapshots["NileCheckbox renders correctly with default properties"] = 
+`<label
+  class="checkbox checkbox--medium"
+  part="base"
+>
+  <input
+    aria-checked="false"
+    class="checkbox__input"
+    name=""
+    title=""
+    type="checkbox"
+  >
+  <span
+    class="checkbox__control"
+    part="control"
+  >
+  </span>
+  <div
+    class="checkbox__label"
+    part="label"
+  >
+    <slot>
+    </slot>
+  </div>
+</label>
+`;
+/* end snapshot NileCheckbox renders correctly with default properties */
+

package/dist/src/nile-code-editor/Old_theme copy.d.ts

@@ -0,0 +1,191 @@
+export declare const Theme: {
+    '&': {
+        fontSize: string;
+        fontFamily: string;
+        fontWeight: string;
+    };
+    '.cm-content': {};
+    ".cm-scroller": {
+        scrollbarWidth: string;
+    };
+};
+export declare const CustomTheme: {
+    '&': {
+        fontSize: string;
+        fontStyle: string;
+        fontFamily: string;
+        fontWeight: string;
+        lineHeight: string;
+        letterSpacing: string;
+    };
+    '.cm-content': {
+        fontSize: string;
+        fontStyle: string;
+        fontFamily: string;
+        fontWeight: string;
+        lineHeight: string;
+        letterSpacing: string;
+    };
+    ".cm-scroller": {
+        fontFamily: string;
+    };
+    ".cm-gutters": {
+        fontFamily: string;
+    };
+};
+export declare const fontFamily: {
+    '.cm-tooltip.cm-tooltip-autocomplete > ul': {
+        fontFamily: string;
+        fontWeight: string;
+    };
+    '.cm-content': {
+        fontFamily: string;
+    };
+};
+export declare const customisedThemeCss: {
+    '.cm-content': {
+        fontFamily: string;
+    };
+    '.cm-scroller': {
+        fontFamily: string;
+    };
+    '.cm-tooltip-autocomplete': {
+        padding: string;
+        backgroundColor: string;
+        display: string;
+        fontSize: string;
+        background: string;
+        border: string;
+        borderRadius: string;
+        paddingBlock: string;
+        paddingInline: string;
+        overscrollBehavior: string;
+        color: string;
+        zIndex: string;
+        position: string;
+        minHeight: string;
+        boxShadow: string;
+    };
+    '.cm-tooltip.cm-completionInfo.cm-completionInfo-right': {
+        fontFamily: string;
+        backgroundColor: string;
+        color: string;
+        padding: string;
+        borderTopRightRadius: string;
+        borderBottomRightRadius: string;
+        border: string;
+        fontSize: string;
+    };
+    '.cm-tooltip.cm-tooltip-autocomplete > ul': {
+        fontFamily: string;
+        fontWeight: string;
+        maxWidth: string;
+        width: string;
+    };
+    '.cm-tooltip.cm-tooltip-autocomplete > ul > li': {
+        padding: string;
+        overflow: string;
+        textOverflow: string;
+        whiteSpace: string;
+        maxWidth: string;
+    };
+    '.cm-tooltip.cm-tooltip-autocomplete > ul > li:hover': {
+        backgroundColor: string;
+        color: string;
+    };
+    '.cm-tooltip.cm-tooltip-autocomplete > ul > li[aria-selected="true"]': {
+        backgroundColor: string;
+        color: string;
+    };
+    '.cm-tooltip.cm-tooltip-autocomplete > ul > li[aria-selected="true"]:hover': {
+        color: string;
+    };
+    '.cm-completionIcon': {
+        display: string;
+        position: string;
+    };
+    '.cm-completionIcon::after': {
+        display: string;
+        content: string;
+        position: string;
+        left: string;
+        top: string;
+        lineHeight: string;
+        verticalAlign: string;
+    };
+    '.cm-completionMatchedText': {
+        textDecoration: string;
+    };
+    '.cm-completionIcon.cm-completionIcon-property::after': {
+        content: string;
+        position: string;
+        left: string;
+        top: string;
+        lineHeight: string;
+        verticalAlign: string;
+    };
+    '.cm-completionIcon.cm-completionIcon-keyword::after': {
+        content: string;
+        position: string;
+        left: string;
+        top: string;
+        lineHeight: string;
+        verticalAlign: string;
+    };
+    '.cm-completionIcon.cm-completionIcon-variable::after': {
+        content: string;
+        position: string;
+        left: string;
+        top: string;
+        lineHeight: string;
+        verticalAlign: string;
+    };
+    '.cm-completionIcon.cm-completionIcon-text::after': {
+        content: string;
+        position: string;
+        left: string;
+        top: string;
+        lineHeight: string;
+        verticalAlign: string;
+    };
+    '.cm-completionIcon.cm-completionIcon-function::after': {
+        content: string;
+        position: string;
+        left: string;
+        top: string;
+        lineHeight: string;
+        verticalAlign: string;
+    };
+    '.cm-completionIcon.cm-completionIcon-class::after': {
+        content: string;
+        position: string;
+        left: string;
+        top: string;
+        lineHeight: string;
+        verticalAlign: string;
+    };
+    '.cm-completionLabel': {
+        marginLeft: string;
+    };
+    '.cm-tooltip.cm-tooltip-autocomplete, .cm-editor .cm-tooltip-autocomplete, .cm-editor .cm-tooltip.cm-tooltip-autocomplete': {
+        position: string;
+        zIndex: string;
+        visibility: string;
+        opacity: string;
+        display: string;
+        top: string;
+        left: string;
+        right: string;
+        bottom: string;
+    };
+    '.cm-tooltip.cm-tooltip-autocomplete': {
+        maxWidth: string;
+        width: string;
+        minWidth: string;
+        boxShadow: string;
+    };
+    '.cm-tooltip-autocomplete[style*="top: -"]': {
+        top: string;
+        position: string;
+    };
+};