@aquera/nile-elements 0.0.1-beta.14 → 0.0.1-beta.16

package/package.json

@@ -3,7 +3,7 @@
   "description": "Webcomponent nile-elements following open-wc recommendations",
   "license": "MIT",
   "author": "nile-elements",
-  "version": "0.0.1-beta.14",
+  "version": "0.0.1-beta.16",
   "main": "dist/src/index.js",
   "type": "module",
   "module": "dist/src/index.js",
@@ -30,6 +30,7 @@
     "@open-wc/form-control": "^0.5.0",
     "@open-wc/form-helpers": "^0.2.1",
     "@rollup/plugin-node-resolve": "^15.0.1",
+    "@rollup/plugin-commonjs": "^25.0.3",
     "element-internals-polyfill": "^1.1.20",
     "lit": "^2.0.2",
     "@floating-ui/dom": "^1.2.1",

package/rollup.config.js

@@ -8,79 +8,108 @@ import { getBabelOutputPlugin } from '@rollup/plugin-babel';
 import glob from 'glob';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
+import commonjs from '@rollup/plugin-commonjs';
 
 const { LERNA_PACKAGE_NAME } = process.env;
 const PACKAGE_ROOT_PATH = process.cwd();
 
 import styles from 'rollup-plugin-styles';
 
-export default {
-  input: Object.fromEntries(
-    glob.sync('src/**/*.ts').map(file => [
-      // This remove `src/` as well as the file extension from each file, so e.g.
-      // src/nested/foo.js becomes nested/foo
-      path.relative(
-        'src',
-        file.slice(0, file.length - path.extname(file).length)
-      ),
-      // This expands the relative paths to absolute paths, so e.g.
-      // src/nested/foo becomes /project/src/nested/foo.js
-      fileURLToPath(new URL(file, import.meta.url)),
-    ])
-  ),
-  external: ['tslib', 'lit', /^lit\/.*/],
-  output: [
-    {
-      // Modern JS bundles (no JS compilation, ES module output)
-      format: 'es',
-      chunkFileNames: '[name]-[hash].esm.js',
-      entryFileNames: '[name].esm.js',
-      dir: 'dist',
-      sourcemap: false,
-    },
-    {
-      // Legacy JS bundles (ES5 compilation and SystemJS module output)
-      format: 'esm',
-      chunkFileNames: '[name]-[hash].cjs.js',
-      entryFileNames: '[name].cjs.js',
-      dir: 'dist',
-      sourcemap: true,
-      plugins: [
-        getBabelOutputPlugin({
-          compact: true,
-          presets: [
-            [
-              '@babel/preset-env',
-              {
-                modules: 'systemjs',
-              },
+export default [
+  {
+    input: Object.fromEntries(
+      glob.sync('src/**/*.ts').map(file => [
+        // This remove `src/` as well as the file extension from each file, so e.g.
+        // src/nested/foo.js becomes nested/foo
+        path.relative(
+          'src',
+          file.slice(0, file.length - path.extname(file).length)
+        ),
+        // This expands the relative paths to absolute paths, so e.g.
+        // src/nested/foo becomes /project/src/nested/foo.js
+        fileURLToPath(new URL(file, import.meta.url)),
+      ])
+    ),
+    external: ['tslib', 'lit', /^lit\/.*/],
+    output: [
+      {
+        // Modern JS bundles (no JS compilation, ES module output)
+        format: 'es',
+        chunkFileNames: '[name]-[hash].esm.js',
+        entryFileNames: '[name].esm.js',
+        dir: 'dist',
+        sourcemap: false,
+      },
+      {
+        // Legacy JS bundles (ES5 compilation and SystemJS module output)
+        format: 'esm',
+        chunkFileNames: '[name]-[hash].cjs.js',
+        entryFileNames: '[name].cjs.js',
+        dir: 'dist',
+        sourcemap: true,
+        plugins: [
+          getBabelOutputPlugin({
+            compact: true,
+            presets: [
+              [
+                '@babel/preset-env',
+                {
+                  modules: 'systemjs',
+                },
+              ],
             ],
-          ],
-        }),
-      ],
+          }),
+        ],
+      },
+    ],
+    onwarn(warning) {
+      if (warning.code !== 'THIS_IS_UNDEFINED') {
+        console.error(`(!) ${warning.message}`);
+      }
     },
-  ],
-  onwarn(warning) {
-    if (warning.code !== 'THIS_IS_UNDEFINED') {
-      console.error(`(!) ${warning.message}`);
-    }
+    plugins: [
+      typescript(),
+      replace({ 'Reflect.decorate': 'undefined' }),
+      resolve(),
+      terser({
+        ecma: 2017,
+        module: true,
+        warnings: true,
+        mangle: {
+          properties: {
+            regex: /^__/,
+          },
+        },
+      }),
+      styles(),
+      summary(),
+    ],
+    preserveEntrySignatures: false,
   },
-  plugins: [
-    typescript(),
-    replace({ 'Reflect.decorate': 'undefined' }),
-    resolve(),
-    terser({
-      ecma: 2017,
-      module: true,
-      warnings: true,
-      mangle: {
-        properties: {
-          regex: /^__/,
+  {
+    input: 'src/index.ts',
+    output: {
+      file: 'dist/index.iife.js',
+      format: 'iife',
+      name: 'NileElement'
+    },
+    plugins: [
+      typescript(),
+      replace({ 'Reflect.decorate': 'undefined' }),
+      resolve(),
+      terser({
+        ecma: 2017,
+        module: true,
+        warnings: true,
+        mangle: {
+          properties: {
+            regex: /^__/,
+          },
         },
-      },
-    }),
-    styles(),
-    summary(),
-  ],
-  preserveEntrySignatures: false,
-};
+      }),
+      styles(),
+      summary(),
+      commonjs()
+    ],
+    },
+];

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

@@ -25,9 +25,9 @@ export const styles = css`
     border-style: solid;
     border-width: 1px;
     font-style: normal;
-    font-weight: 400;
+    font-weight: var(--nile-font-weight-regular);
     font-family: var(--nile-font-family-serif);
-    font-size: 14px;
+    font-size: var(--nile-type-scale-3);
     text-align: center;
     letter-spacing: 0.2px;
     text-decoration: none;
@@ -39,10 +39,10 @@ export const styles = css`
       var(--nile-transition-duration-default) border,
       var(--nile-transition-duration-default) box-shadow;
     cursor: inherit;
-    padding: 12px;
-    gap: 12px;
+    padding: var(--nile-spacing-2-x);
+    gap: var(--nile-spacing-2-x);
     border-radius: var(--nile-radius-base-standard);
-    line-height: 14px;
+    line-height: var(--nile-type-scale-3);
     box-sizing: border-box;
     height: 38px;
   }
@@ -128,17 +128,17 @@ export const styles = css`
   }
 
   .button--standard.button--primary.button--disabled {
-    background-color: #777d82;
-    border-color: #777d82;
-    color: #fff;
+    background-color: var(--nile-colors-neutral-700);
+    border-color: var(--nile-colors-neutral-700);
+    color: var(--nile-colors-white-base);
     cursor: not-allowed;
   }
 
   .button--standard.button--primary.button--disabled:hover,
   .button--standard.button--primary.button--disabled:active {
-    background-color: #777d82;
-    border-color: #777d82;
-    color: #fff;
+    background-color: var(--nile-colors-neutral-700);
+    border-color: var(--nile-colors-neutral-700);
+    color: var(--nile-colors-white-base);
     box-shadow: none;
   }
 
@@ -164,7 +164,7 @@ export const styles = css`
   }
   .button--standard.button--tertiary.button--disabled {
     border-color: #e5e9eb;
-    background-color: #fff;
+    background-color: var(--nile-colors-white-base);
     color: var(--nile-colors-neutral-700);
     cursor: not-allowed;
     box-shadow: none;
@@ -173,7 +173,7 @@ export const styles = css`
   .button--standard.button--tertiary.button--disabled:hover,
   .button--standard.button--tertiary.button--disabled:active {
     border-color: #e5e9eb;
-    background-color: #fff;
+    background-color: var(--nile-colors-white-base);
     color: var(--nile-colors-neutral-700);
     box-shadow: none;
   }
@@ -196,6 +196,120 @@ export const styles = css`
     color: var(--nile-colors-white-base);
   }
 
+    /*
+   * Outline buttons
+   */
+
+  .button--outline {
+    background: none;
+    border: solid 2px;
+  }
+
+  /* Default */
+  .button--outline.button--secondary {
+    border-color: var(--nile-colors-neutral-300);
+    color: var(--nile-colors-neutral-700);
+  }
+
+  .button--outline.button--secondary:hover:not(.button--disabled),
+  .button--outline.button--secondary.button--checked:not(.button--disabled) {
+    border-color: var(--nile-colors-primary-600);
+    color: var(--nile-colors-white-base);
+  }
+
+  .button--outline.button--secondary:active:not(.button--disabled) {
+    border-color: var(--nile-colors-primary-700);
+    color: var(--nile-colors-white-base);
+  }
+
+  /* Primary */
+  .button--outline.button--primary {
+    border-color: var(--nile-colors-primary-600);
+    color: var(--nile-colors-primary-600);
+  }
+
+  .button--outline.button--primary:hover:not(.button--disabled),
+  .button--outline.button--primary.button--checked:not(.button--disabled) {
+    color: var(--nile-colors-white-base);
+  }
+
+  .button--outline.button--primary:active:not(.button--disabled) {
+    border-color: var(--nile-colors-primary-700);
+    color: var(--nile-colors-white-base);
+  }
+
+  /* Success */
+  .button--outline.button--success {
+    border-color: var(--nile-colors-green-600);
+    color: var(--nile-colors-green-600);
+  }
+
+  .button--outline.button--success:hover:not(.button--disabled),
+  .button--outline.button--success.button--checked:not(.button--disabled) {
+    color: var(--nile-colors-white-base);
+  }
+
+  .button--outline.button--success:active:not(.button--disabled) {
+    border-color: var(--nile-colors-green-700);
+    color: var(--nile-colors-white-base);
+  }
+
+  /* Neutral */
+  .button--outline.button--neutral {
+    border-color: var(--nile-colors-neutral-600);
+    color: var(--nile-colors-neutral-600);
+  }
+
+  .button--outline.button--neutral:hover:not(.button--disabled),
+  .button--outline.button--neutral.button--checked:not(.button--disabled) {
+    color: var(--nile-colors-white-base);
+  }
+
+  .button--outline.button--neutral:active:not(.button--disabled) {
+    border-color: var(--nile-colors-neutral-700);
+    color: var(--nile-colors-white-base);
+  }
+
+  /* Warning */
+  .button--outline.button--warning {
+    border-color: var(--nile-colors-orange-600);
+    color: var(--nile-colors-orange-600);
+  }
+
+  .button--outline.button--warning:hover:not(.button--disabled),
+  .button--outline.button--warning.button--checked:not(.button--disabled) {
+    color: var(--nile-colors-white-base);
+  }
+
+  .button--outline.button--warning:active:not(.button--disabled) {
+    border-color: var(--nile-colors-orange-700);
+    color: var(--nile-colors-white-base);
+  }
+
+  /* Danger */
+  .button--outline.button--danger {
+    border-color: var(--nile-colors-red-600);
+    color: var(--nile-colors-red-600);
+  }
+
+  .button--outline.button--danger:hover:not(.button--disabled),
+  .button--outline.button--danger.button--checked:not(.button--disabled) {
+    background-color: var(--nile-colors-red-600);
+    color: var(--nile-colors-white-base);
+  }
+
+ .button--outline.button--danger:active:not(.button--disabled) {
+    border-color: var(--nile-colors-red-700);
+    background-color: var(--nile-colors-red-700);
+    color: var(--nile-colors-white-base);
+  }
+
+  @media (forced-colors: active) {
+    .button.button--outline.button--checked:not(.button--disabled) {
+      outline: solid 2px transparent;
+    }
+  }
+
   /*
  * Pill modifier
  */
@@ -281,4 +395,5 @@ export const styles = css`
     translate: 50% -50%;
     pointer-events: none;
   }
+
 `;

package/src/nile-button/nile-button.ts

@@ -324,7 +324,7 @@ export class NileButton extends NileElement implements NileFormControl {
         <slot part="label" class="button__label"></slot>
         <slot name="suffix" part="suffix" class="button__suffix"></slot>
         ${
-          this.caret ? html` <nile-icon part="caret" class="button__caret" name="caret"></nile-icon> ` : ''
+          this.caret ? html` <nile-icon part="caret" class="button__caret" color="white" name="arrowdown"></nile-icon> ` : ''
         }
         ${this.loading ? html`<nile-spinner></nile-spinner>` : ''}
       </${tag}>

package/src/nile-input/nile-input.css.ts

@@ -82,6 +82,7 @@ export const styles = css`
     cursor: text;
     transition: 150ms color, 150ms border, 150ms box-shadow,
       150ms background-color;
+    box-sizing: border-box;
   }
 
   /* Standard inputs */
@@ -120,7 +121,7 @@ export const styles = css`
   }
 
   .input--standard.input--warning {
-    border-color: #e5bf43;
+    border-color: var(--nile-colors-yellow-500);
   }
 
   .input--standard.input--error {
@@ -285,8 +286,8 @@ export const styles = css`
   }
 
   .input--medium .input__control {
-    height: calc(42px - 1px * 2);
-    padding: 0 1rem;
+    height: 14px;
+    padding: 12px;
   }
 
   .input--medium .input__clear {

package/src/nile-radio-group/nile-radio-group.ts

@@ -72,6 +72,7 @@ export class NileRadioGroup extends NileElement {
   connectedCallback() {
     super.connectedCallback();
     this.defaultValue = this.value;
+    this.handleInitialDisabledState();
   }
 
   private getAllRadios() {
@@ -96,13 +97,19 @@ export class NileRadioGroup extends NileElement {
     }
   }
 
-  @watch('disabled')
+  @watch('disabled', { waitUntilFirstUpdate: true })
   handleDisabledChange() {
     this.getAllRadios().forEach(radio => {
       radio.disabled = this.disabled;
     });
   }
 
+  private handleInitialDisabledState() {
+    this.getAllRadios().forEach(radio => {
+      radio.disabled = radio.hasAttribute('disabled') ? radio.disabled : this.disabled;
+    });
+  }
+
   private handleKeyDown(event: KeyboardEvent) {
     if (!['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', ' '].includes(event.key)) {
       return;

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/index.d.ts

@@ -1,25 +0,0 @@
-export { NileButton } from './nile-button';
-export { NileHeading } from './nile-heading';
-export { NileIcon } from './nile-icon';
-export { NileInput } from './nile-input';
-export { NileSidebar } from './nile-sidebar';
-export { NileMenu } from './nile-menu';
-export { NileBadge } from './nile-badge';
-export { NileDrawer } from './nile-drawer';
-export { NileCheckbox } from './nile-checkbox';
-export { NileRadio } from './nile-radio';
-export { NileRadioGroup } from './nile-radio-group';
-export { NilePopup } from './nile-popup';
-export { NileTooltip } from './nile-tooltip';
-export { NileSlideToggle } from './nile-slide-toggle';
-export { NileLoader } from './nile-loader';
-export { NileProgressBar } from './nile-progress-bar';
-export { NileSpinner } from './nile-spinner';
-export { NileSelect } from './nile-select';
-export { NileOption } from './nile-option';
-export { NileTag } from './nile-tag';
-export { NileIconButton } from './nile-icon-button';
-export { NileMenuItem } from './nile-menu-item';
-export { NileDropdown } from './nile-dropdown';
-export { NileAutoComplete } from './nile-auto-complete';
-export { NileChip } from './nile-chip';

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/index.js

@@ -1,26 +0,0 @@
-export { NileButton } from './nile-button';
-export { NileHeading } from './nile-heading';
-export { NileIcon } from './nile-icon';
-export { NileInput } from './nile-input';
-export { NileSidebar } from './nile-sidebar';
-export { NileMenu } from './nile-menu';
-export { NileBadge } from './nile-badge';
-export { NileDrawer } from './nile-drawer';
-export { NileCheckbox } from './nile-checkbox';
-export { NileRadio } from './nile-radio';
-export { NileRadioGroup } from './nile-radio-group';
-export { NilePopup } from './nile-popup';
-export { NileTooltip } from './nile-tooltip';
-export { NileSlideToggle } from './nile-slide-toggle';
-export { NileLoader } from './nile-loader';
-export { NileProgressBar } from './nile-progress-bar';
-export { NileSpinner } from './nile-spinner';
-export { NileSelect } from './nile-select';
-export { NileOption } from './nile-option';
-export { NileTag } from './nile-tag';
-export { NileIconButton } from './nile-icon-button';
-export { NileMenuItem } from './nile-menu-item';
-export { NileDropdown } from './nile-dropdown';
-export { NileAutoComplete } from './nile-auto-complete';
-export { NileChip } from './nile-chip';
-//# sourceMappingURL=index.js.map

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC","sourcesContent":["export { NileButton } from './nile-button';\nexport { NileHeading } from './nile-heading';\nexport { NileIcon } from './nile-icon';\nexport { NileInput } from './nile-input';\nexport { NileSidebar } from './nile-sidebar';\nexport { NileMenu } from './nile-menu';\nexport { NileBadge } from './nile-badge';\nexport { NileDrawer } from './nile-drawer';\nexport { NileCheckbox } from './nile-checkbox';\nexport { NileRadio } from './nile-radio';\nexport { NileRadioGroup } from './nile-radio-group';\nexport { NilePopup } from './nile-popup';\nexport { NileTooltip } from './nile-tooltip';\nexport { NileSlideToggle } from './nile-slide-toggle';\nexport { NileLoader } from './nile-loader';\nexport { NileProgressBar } from './nile-progress-bar';\nexport { NileSpinner } from './nile-spinner';\nexport { NileSelect } from './nile-select';\nexport { NileOption } from './nile-option';\nexport { NileTag } from './nile-tag';\nexport { NileIconButton } from './nile-icon-button';\nexport { NileMenuItem } from './nile-menu-item';\nexport { NileDropdown } from './nile-dropdown';\nexport { NileAutoComplete } from './nile-auto-complete';\nexport { NileChip } from './nile-chip';\n"]}

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/internal/animate.d.ts

@@ -1,22 +0,0 @@
-/**
- * Animates an element using keyframes. Returns a promise that resolves after the animation completes or gets canceled.
- */
-export declare function animateTo(el: HTMLElement, keyframes: Keyframe[], options?: KeyframeAnimationOptions): Promise<unknown>;
-/** Parses a CSS duration and returns the number of milliseconds. */
-export declare function parseDuration(delay: number | string): number;
-/** Tells if the user has enabled the "reduced motion" setting in their browser or OS. */
-export declare function prefersReducedMotion(): boolean;
-/**
- * Stops all active animations on the target element. Returns a promise that resolves after all animations are canceled.
- */
-export declare function stopAnimations(el: HTMLElement): Promise<unknown[]>;
-/**
- * We can't animate `height: auto`, but we can calculate the height and shim keyframes by replacing it with the
- * element's scrollHeight before the animation.
- */
-export declare function shimKeyframesHeightAuto(keyframes: Keyframe[], calculatedHeight: number): {
-    height: string | number | null | undefined;
-    composite?: CompositeOperationOrAuto | undefined;
-    easing?: string | undefined;
-    offset?: number | null | undefined;
-}[];

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/internal/animate.js

@@ -1,56 +0,0 @@
-/**
- * Animates an element using keyframes. Returns a promise that resolves after the animation completes or gets canceled.
- */
-export function animateTo(el, keyframes, options) {
-    return new Promise(resolve => {
-        if (options?.duration === Infinity) {
-            throw new Error('Promise-based animations must be finite.');
-        }
-        const animation = el.animate(keyframes, {
-            ...options,
-            duration: prefersReducedMotion() ? 0 : options.duration
-        });
-        animation.addEventListener('cancel', resolve, { once: true });
-        animation.addEventListener('finish', resolve, { once: true });
-    });
-}
-/** Parses a CSS duration and returns the number of milliseconds. */
-export function parseDuration(delay) {
-    delay = delay.toString().toLowerCase();
-    if (delay.indexOf('ms') > -1) {
-        return parseFloat(delay);
-    }
-    if (delay.indexOf('s') > -1) {
-        return parseFloat(delay) * 1000;
-    }
-    return parseFloat(delay);
-}
-/** Tells if the user has enabled the "reduced motion" setting in their browser or OS. */
-export function prefersReducedMotion() {
-    const query = window.matchMedia('(prefers-reduced-motion: reduce)');
-    return query.matches;
-}
-/**
- * Stops all active animations on the target element. Returns a promise that resolves after all animations are canceled.
- */
-export function stopAnimations(el) {
-    return Promise.all(el.getAnimations().map(animation => {
-        return new Promise(resolve => {
-            const handleAnimationEvent = requestAnimationFrame(resolve);
-            animation.addEventListener('cancel', () => handleAnimationEvent, { once: true });
-            animation.addEventListener('finish', () => handleAnimationEvent, { once: true });
-            animation.cancel();
-        });
-    }));
-}
-/**
- * We can't animate `height: auto`, but we can calculate the height and shim keyframes by replacing it with the
- * element's scrollHeight before the animation.
- */
-export function shimKeyframesHeightAuto(keyframes, calculatedHeight) {
-    return keyframes.map(keyframe => ({
-        ...keyframe,
-        height: keyframe.height === 'auto' ? `${calculatedHeight}px` : keyframe.height
-    }));
-}
-//# sourceMappingURL=animate.js.map

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/internal/animate.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"animate.js","sourceRoot":"","sources":["../../../src/internal/animate.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,UAAU,SAAS,CAAC,EAAe,EAAE,SAAqB,EAAE,OAAkC;IAClG,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE;QAC3B,IAAI,OAAO,EAAE,QAAQ,KAAK,QAAQ,EAAE;YAClC,MAAM,IAAI,KAAK,CAAC,0CAA0C,CAAC,CAAC;SAC7D;QAED,MAAM,SAAS,GAAG,EAAE,CAAC,OAAO,CAAC,SAAS,EAAE;YACtC,GAAG,OAAO;YACV,QAAQ,EAAE,oBAAoB,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAQ,CAAC,QAAQ;SACzD,CAAC,CAAC;QAEH,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;QAC9D,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;IAChE,CAAC,CAAC,CAAC;AACL,CAAC;AAED,oEAAoE;AACpE,MAAM,UAAU,aAAa,CAAC,KAAsB;IAClD,KAAK,GAAG,KAAK,CAAC,QAAQ,EAAE,CAAC,WAAW,EAAE,CAAC;IAEvC,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE;QAC5B,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;KAC1B;IAED,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE;QAC3B,OAAO,UAAU,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC;KACjC;IAED,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;AAC3B,CAAC;AAED,yFAAyF;AACzF,MAAM,UAAU,oBAAoB;IAClC,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC,kCAAkC,CAAC,CAAC;IACpE,OAAO,KAAK,CAAC,OAAO,CAAC;AACvB,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,cAAc,CAAC,EAAe;IAC5C,OAAO,OAAO,CAAC,GAAG,CAChB,EAAE,CAAC,aAAa,EAAE,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE;QACjC,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE;YAC3B,MAAM,oBAAoB,GAAG,qBAAqB,CAAC,OAAO,CAAC,CAAC;YAE5D,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,oBAAoB,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;YACjF,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,oBAAoB,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;YACjF,SAAS,CAAC,MAAM,EAAE,CAAC;QACrB,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CACH,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,uBAAuB,CAAC,SAAqB,EAAE,gBAAwB;IACrF,OAAO,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QAChC,GAAG,QAAQ;QACX,MAAM,EAAE,QAAQ,CAAC,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,GAAG,gBAAgB,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM;KAC/E,CAAC,CAAC,CAAC;AACN,CAAC","sourcesContent":["/**\n * Animates an element using keyframes. Returns a promise that resolves after the animation completes or gets canceled.\n */\nexport function animateTo(el: HTMLElement, keyframes: Keyframe[], options?: KeyframeAnimationOptions) {\n  return new Promise(resolve => {\n    if (options?.duration === Infinity) {\n      throw new Error('Promise-based animations must be finite.');\n    }\n\n    const animation = el.animate(keyframes, {\n      ...options,\n      duration: prefersReducedMotion() ? 0 : options!.duration\n    });\n\n    animation.addEventListener('cancel', resolve, { once: true });\n    animation.addEventListener('finish', resolve, { once: true });\n  });\n}\n\n/** Parses a CSS duration and returns the number of milliseconds. */\nexport function parseDuration(delay: number | string) {\n  delay = delay.toString().toLowerCase();\n\n  if (delay.indexOf('ms') > -1) {\n    return parseFloat(delay);\n  }\n\n  if (delay.indexOf('s') > -1) {\n    return parseFloat(delay) * 1000;\n  }\n\n  return parseFloat(delay);\n}\n\n/** Tells if the user has enabled the \"reduced motion\" setting in their browser or OS. */\nexport function prefersReducedMotion() {\n  const query = window.matchMedia('(prefers-reduced-motion: reduce)');\n  return query.matches;\n}\n\n/**\n * Stops all active animations on the target element. Returns a promise that resolves after all animations are canceled.\n */\nexport function stopAnimations(el: HTMLElement) {\n  return Promise.all(\n    el.getAnimations().map(animation => {\n      return new Promise(resolve => {\n        const handleAnimationEvent = requestAnimationFrame(resolve);\n\n        animation.addEventListener('cancel', () => handleAnimationEvent, { once: true });\n        animation.addEventListener('finish', () => handleAnimationEvent, { once: true });\n        animation.cancel();\n      });\n    })\n  );\n}\n\n/**\n * We can't animate `height: auto`, but we can calculate the height and shim keyframes by replacing it with the\n * element's scrollHeight before the animation.\n */\nexport function shimKeyframesHeightAuto(keyframes: Keyframe[], calculatedHeight: number) {\n  return keyframes.map(keyframe => ({\n    ...keyframe,\n    height: keyframe.height === 'auto' ? `${calculatedHeight}px` : keyframe.height\n  }));\n}\n"]}

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/internal/default-value.d.ts

@@ -1,2 +0,0 @@
-import type { ReactiveElement } from 'lit';
-export declare const defaultValue: (propertyName?: string) => (proto: ReactiveElement, key: string) => void;

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/internal/default-value.js

@@ -1,34 +0,0 @@
-// @defaultValue decorator
-//
-// Runs when the corresponding attribute of the observed property changes, e.g. after calling Element.setAttribute or after updating
-// the observed property.
-//
-// The decorator checks whether the value of the attribute is different from the value of the property and in that case
-// it saves the new value.
-//
-//
-// Usage:
-//
-//  @property({ type: Boolean, reflect: true }) checked = false;
-//
-//  @defaultValue('checked') defaultChecked = false;
-//
-import { defaultConverter } from 'lit';
-export const defaultValue = (propertyName = 'value') => (proto, key) => {
-    const ctor = proto.constructor;
-    const attributeChangedCallback = ctor.prototype.attributeChangedCallback;
-    ctor.prototype.attributeChangedCallback = function (name, old, value) {
-        const options = ctor.getPropertyOptions(propertyName);
-        const attributeName = typeof options.attribute === 'string' ? options.attribute : propertyName;
-        if (name === attributeName) {
-            const converter = options.converter || defaultConverter;
-            const fromAttribute = typeof converter === 'function' ? converter : converter?.fromAttribute ?? defaultConverter.fromAttribute;
-            const newValue = fromAttribute(value, options.type);
-            if (this[propertyName] !== newValue) {
-                this[key] = newValue;
-            }
-        }
-        attributeChangedCallback.call(this, name, old, value);
-    };
-};
-//# sourceMappingURL=default-value.js.map

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/internal/default-value.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"default-value.js","sourceRoot":"","sources":["../../../src/internal/default-value.ts"],"names":[],"mappings":"AAAA,0BAA0B;AAC1B,EAAE;AACF,oIAAoI;AACpI,yBAAyB;AACzB,EAAE;AACF,uHAAuH;AACvH,0BAA0B;AAC1B,EAAE;AACF,EAAE;AACF,SAAS;AACT,EAAE;AACF,gEAAgE;AAChE,EAAE;AACF,oDAAoD;AACpD,EAAE;AAEF,OAAO,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAC;AAGvC,MAAM,CAAC,MAAM,YAAY,GACvB,CAAC,YAAY,GAAG,OAAO,EAAE,EAAE,CAC3B,CAAC,KAAsB,EAAE,GAAW,EAAE,EAAE;IACtC,MAAM,IAAI,GAAG,KAAK,CAAC,WAAqC,CAAC;IAEzD,MAAM,wBAAwB,GAAG,IAAI,CAAC,SAAS,CAAC,wBAAwB,CAAC;IACzE,IAAI,CAAC,SAAS,CAAC,wBAAwB,GAAG,UAExC,IAAI,EACJ,GAAG,EACH,KAAK;QAEL,MAAM,OAAO,GAAG,IAAI,CAAC,kBAAkB,CAAC,YAAY,CAAC,CAAC;QACtD,MAAM,aAAa,GAAG,OAAO,OAAO,CAAC,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC;QAE/F,IAAI,IAAI,KAAK,aAAa,EAAE;YAC1B,MAAM,SAAS,GAAG,OAAO,CAAC,SAAS,IAAI,gBAAgB,CAAC;YACxD,MAAM,aAAa,GACjB,OAAO,SAAS,KAAK,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EAAE,aAAa,IAAI,gBAAgB,CAAC,aAAa,CAAC;YAE3G,MAAM,QAAQ,GAAY,aAAc,CAAC,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC;YAE9D,IAAI,IAAI,CAAC,YAAY,CAAC,KAAK,QAAQ,EAAE;gBACnC,IAAI,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC;aACtB;SACF;QAED,wBAAwB,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,CAAC,CAAC;IACxD,CAAC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// @defaultValue decorator\n//\n// Runs when the corresponding attribute of the observed property changes, e.g. after calling Element.setAttribute or after updating\n// the observed property.\n//\n// The decorator checks whether the value of the attribute is different from the value of the property and in that case\n// it saves the new value.\n//\n//\n// Usage:\n//\n//  @property({ type: Boolean, reflect: true }) checked = false;\n//\n//  @defaultValue('checked') defaultChecked = false;\n//\n\nimport { defaultConverter } from 'lit';\nimport type { ReactiveElement } from 'lit';\n\nexport const defaultValue =\n  (propertyName = 'value') =>\n  (proto: ReactiveElement, key: string) => {\n    const ctor = proto.constructor as typeof ReactiveElement;\n\n    const attributeChangedCallback = ctor.prototype.attributeChangedCallback;\n    ctor.prototype.attributeChangedCallback = function (\n      this: ReactiveElement & { [name: string]: unknown },\n      name,\n      old,\n      value\n    ) {\n      const options = ctor.getPropertyOptions(propertyName);\n      const attributeName = typeof options.attribute === 'string' ? options.attribute : propertyName;\n\n      if (name === attributeName) {\n        const converter = options.converter || defaultConverter;\n        const fromAttribute =\n          typeof converter === 'function' ? converter : converter?.fromAttribute ?? defaultConverter.fromAttribute;\n\n        const newValue: unknown = fromAttribute!(value, options.type);\n\n        if (this[propertyName] !== newValue) {\n          this[key] = newValue;\n        }\n      }\n\n      attributeChangedCallback.call(this, name, old, value);\n    };\n  };\n"]}

package/.rollup.cache/Users/ravisankar/repos/design-system/packages/nile-elements/dist/src/internal/event.d.ts

@@ -1,2 +0,0 @@
-/** Waits for a specific event to be emitted from an element. Ignores events that bubble up from child elements. */
-export declare function waitForEvent(el: HTMLElement, eventName: string): Promise<void>;