@aquera/nile-elements 1.6.0 → 1.6.2

package/src/nile-icon/icons/svg/folder_delete.ts

@@ -0,0 +1,5 @@
+/**
+ * Do not edit directly
+ */
+
+export default "PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTEuNzUgMi40NTcxNFYxMC43ODU3QzEuNzUgMTAuOTg2NSAxLjgyOTAyIDExLjE3OTEgMS45Njk2NyAxMS4zMjExQzIuMTEwMzIgMTEuNDYzMSAyLjMwMTA5IDExLjU0MjkgMi41IDExLjU0MjlIMy41VjEyLjNIMi41QzIuMTAyMTggMTIuMyAxLjcyMDY0IDEyLjE0MDUgMS40MzkzNCAxMS44NTY1QzEuMTU4MDQgMTEuNTcyNSAxIDExLjE4NzMgMSAxMC43ODU3VjEuN0g1LjMyNTY5TDYuODI1NjkgMy45NzE0M0gxM1YxMC43ODU3QzEzIDExLjE4NzMgMTIuODQyIDExLjU3MjUgMTIuNTYwNyAxMS44NTY1QzEyLjI3OTQgMTIuMTQwNSAxMS44OTc4IDEyLjMgMTEuNSAxMi4zSDEwLjVWMTEuNTQyOUgxMS41QzExLjY5ODkgMTEuNTQyOSAxMS44ODk3IDExLjQ2MzEgMTIuMDMwMyAxMS4zMjExQzEyLjE3MSAxMS4xNzkxIDEyLjI1IDEwLjk4NjUgMTIuMjUgMTAuNzg1N1Y0LjcyODU3SDYuNDI0MzFMNC45MjQzMSAyLjQ1NzE0SDEuNzVaIiBmaWxsPSJibGFjayIvPjxwYXRoIGQ9Ik05Ljc4MzIgNi4zMzY5MUw3LjYxOTE0IDguNUw5Ljc4MzIgMTAuNjYzMUw5LjE2MzA5IDExLjI4MzJMNyA5LjExOTE0TDQuODM2OTEgMTEuMjgzMkw0LjIxNjggMTAuNjYzMUw2LjM3OTg4IDguNUw0LjIxNjggNi4zMzY5MUw0LjgzNjkxIDUuNzE2NzlMNyA3Ljg3OTg4TDkuMTYzMDkgNS43MTY3OUw5Ljc4MzIgNi4zMzY5MVoiIGZpbGw9ImJsYWNrIi8+PC9zdmc+";

package/src/nile-icon/icons/svg/index.ts

@@ -173,6 +173,7 @@ export { default as flowmapundo } from './flowmap-undo';
 export { default as flowmapworkflow } from './flowmap-workflow';
 export { default as flowmap } from './flowmap';
 export { default as folder } from './folder';
+export { default as folder_delete } from './folder_delete';
 export { default as foreach } from './foreach';
 export { default as format_align_justify } from './format_align_justify';
 export { default as format_align_left } from './format_align_left';

package/src/nile-icon/icons/svg/layers-three-02.ts

@@ -2,4 +2,4 @@
  * Do not edit directly
  */
 
-export default "PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNiAxNiIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJub25lIj48cGF0aCAgICBkPSJNMS4zMzU5NCA4LjAwMDM3ICAgICAgIEw3Ljc2NDA5IDExLjIxNDQgICAgICAgQzcuODUxNTUgMTEuMjU4MiA3Ljg5NTI3IDExLjI4IDcuOTQxMTQgMTEuMjg4NiAgICAgICAgIDcuOTgxNzYgMTEuMjk2MyA4LjAyMzQ1IDExLjI5NjMgOC4wNjQwNyAxMS4yODg2ICAgICAgICAgOC4xMDk5NCAxMS4yOCA4LjE1MzY2IDExLjI1ODIgOC4yNDExMiAxMS4yMTQ0ICAgICAgIEwxNC42NjkzIDguMDAwMzcgICAgICAgTTEuMzM1OTQgMTEuMzMzNyAgICAgICBMNy43NjQwOSAxNC41NDc4ICAgICAgIEM3Ljg1MTU1IDE0LjU5MTUgNy44OTUyNyAxNC42MTM0IDcuOTQxMTQgMTQuNjIyICAgICAgICAgNy45ODE3NiAxNC42Mjk2IDguMDIzNDUgMTQuNjI5NiA4LjA2NDA3IDE0LjYyMiAgICAgICAgIDguMTA5OTQgMTQuNjEzNCA4LjE1MzY2IDE0LjU5MTUgOC4yNDExMiAxNC41NDc4ICAgICAgIEwxNC42NjkzIDExLjMzMzcgICAgICAgTTEuMzM1OTQgNC42NjcwNCAgICAgICBMNy43NjQwOSAxLjQ1Mjk2ICAgICAgIEM3Ljg1MTU1IDEuNDA5MjMgNy44OTUyNyAxLjM4NzM3IDcuOTQxMTQgMS4zNzg3NiAgICAgICAgIDcuOTgxNzYgMS4zNzExNCA4LjAyMzQ1IDEuMzcxMTQgOC4wNjQwNyAxLjM3ODc2ICAgICAgICAgOC4xMDk5NCAxLjM4NzM3IDguMTUzNjYgMS40MDkyMyA4LjI0MTEyIDEuNDUyOTYgICAgICAgTDE0LjY2OTMgNC42NjcwNCAgICAgICBMOC4yNDExMiA3Ljg4MTExICAgICAgIEM4LjE1MzY2IDcuOTI0ODQgOC4xMDk5NCA3Ljk0NjcgOC4wNjQwNyA3Ljk1NTMxICAgICAgICAgOC4wMjM0NSA3Ljk2MjkzIDcuOTgxNzYgNy45NjI5MyA3Ljk0MTE0IDcuOTU1MzEgICAgICAgICA3Ljg5NTI3IDcuOTQ2NyA3Ljg1MTU1IDcuOTI0ODQgNy43NjQwOSA3Ljg4MTExICAgICAgIEwxLjMzNTk0IDQuNjY3MDQgICAgICAgWiIgICAgc3Ryb2tlPSIjMzQ0MDU0IiAgICBzdHJva2Utd2lkdGg9IjEuNiIgICAgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiAgICBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+";
+export default "PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDE0IDE0IiBmaWxsPSJub25lIj48cGF0aCBkPSJNNy4yMDEyOSAxLjEwNTM0TDEzIDQuMTUzNzFMNyA3LjcwMTA2TDEuNzM5MjMgNC41ODk4NUwxIDQuMTUzNzFMNi43OTg3MSAxLjEwNTM0TDcgMUw3LjIwMTI5IDEuMTA1MzRaTTIuOTE4ODQgNC4yMDE3Nkw3IDYuNjE1MzNMMTEuMDgxMiA0LjIwMTc2TDcgMi4wNTcwOUwyLjkxODg0IDQuMjAxNzZaIiBmaWxsPSJibGFjayIvPjxwYXRoIGQ9Ik0xMi42NTM3IDcuMDA3NDhMNyAxMC4zNTA2TDEuMzQ3MiA3LjAwNzQ4TDEuNzg4NDYgNi4xODMyNUw3IDkuMjYzOTZMMTIuMjEyNCA2LjE4MzI1TDEyLjY1MzcgNy4wMDc0OFoiIGZpbGw9ImJsYWNrIi8+PHBhdGggZD0iTTEyLjY1MzcgOS42NTY4Nkw3IDEzTDEuMzQ3MiA5LjY1Njg2TDEuNzg4NDYgOC44MzI2M0w3IDExLjkxMzNMMTIuMjEyNCA4LjgzMjYzTDEyLjY1MzcgOS42NTY4NloiIGZpbGw9ImJsYWNrIi8+PC9zdmc+";

package/src/nile-otp-input/index.ts

@@ -0,0 +1 @@
+export { NileOtpInput } from './nile-otp-input';

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

@@ -0,0 +1,271 @@
+/**
+ * Copyright Aquera Inc 2026
+ *
+ * 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 { css } from 'lit';
+
+/**
+ * OTP input CSS
+ */
+export const styles = css`
+  :host {
+    display: block;
+    --ng-private-outline-transparent: var(--ng-border-width-1) solid transparent;
+    -webkit-font-smoothing: var(--nile-webkit-font-smoothing, var(--ng-webkit-font-smoothing, antialiased));
+    -moz-osx-font-smoothing: var(--nile-moz-osx-font-smoothing, var(--ng-moz-osx-font-smoothing, grayscale));
+    text-rendering: var(--nile-text-rendering, var(--ng-text-rendering, optimizeLegibility));
+  }
+
+  .form-control {
+    display: flex;
+    flex-direction: column;
+    gap: var(--nile-spacing-sm, var(--ng-spacing-1-5));
+    align-items: flex-start;
+  }
+
+  .form-control .form-control__label {
+    display: none;
+  }
+
+  .form-control--has-label .form-control__label {
+    display: inline-block;
+    color: var(--nile-colors-dark-900, var(--ng-colors-text-secondary-700));
+    font-family: var(--nile-font-family-serif, var(--ng-font-family-body ));
+    font-size: var(--nile-type-scale-3, var(--ng-font-size-text-sm ));
+    font-style: normal;
+    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-500 ));
+    line-height: var(--nile-type-scale-6, var(--ng-line-height-text-sm ));
+    letter-spacing: 0.2px;
+  }
+
+  :host([required]) .form-control--has-label .form-control__label::after {
+    content: '*';
+    margin-inline-start: -2px;
+    color: var(--nile-colors-red-700, var(--ng-colors-text-error-primary-600));
+  }
+
+  .otp {
+    position: relative;
+    display: flex;
+    align-items: center;
+    gap: var(--nile-spacing-md, var(--ng-spacing-2));
+    width: fit-content;
+    max-width: 100%;
+  }
+
+  /* ---- Base cell ---- */
+
+  .otp__cell {
+    box-sizing: border-box;
+    width: var(--nile-spacing-5xl, var(--ng-spacing-10));
+    height: var(--nile-spacing-5xl, var(--ng-spacing-10));
+    min-height: var(--nile-spacing-5xl, var(--ng-spacing-10));
+    padding: var(--nile-spacing-xxs, var(--ng-spacing-0-5)) var(--nile-spacing-md, var(--ng-spacing-2));
+    border: 1px solid var(--nile-colors-border-field, var(--ng-colors-border-primary));
+    border-radius: var(--nile-radius-radius-2xl, var(--ng-radius-lg));
+    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
+    box-shadow: var(--nile-box-shadow-1, var(--ng-shadow-xs));
+    outline: var(--nile-outline-none, var(--ng-private-outline-transparent));
+    color: var(--nile-colors-dark-500, var(--ng-colors-text-placeholder-subtle));
+    text-align: center;
+    font-family: var(--nile-font-family, var(--ng-font-family-display));
+    font-size: var(--nile-type-scale-4, var(--ng-font-size-text-md));
+    font-style: normal;
+    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-500));
+    line-height: var(--nile-type-scale-4, var(--ng-line-height-text-md));
+    letter-spacing: 0.2px;
+    overflow: clip;
+    caret-color: transparent;
+    cursor: pointer;
+    transition: 150ms color, 150ms border, 150ms box-shadow, 150ms background-color, 150ms outline;
+  }
+
+  .otp__cell[type='password'] {
+    font-family: caption;
+    letter-spacing: 0;
+  }
+  /* ---- Hover (mirrors .input--standard:hover) ---- */
+
+  .otp:not(.otp--disabled):not(.otp--readonly) .otp__cell:hover {
+    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-neutral));
+  }
+
+  .otp--warning:not(.otp--disabled) .otp__cell:hover {
+    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-warning));
+  }
+
+  .otp--error:not(.otp--disabled) .otp__cell:hover {
+    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-error));
+  }
+
+  .otp--success:not(.otp--disabled) .otp__cell:hover {
+    border-color: var(--nile-colors-dark-900, var(--ng-colors-border-success));
+  }
+
+  /* ---- Focus / active cell (mirrors .input--standard.input--focused) ---- */
+
+  .otp__cell:focus {
+    outline: none;
+    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary));
+    border-color: var(--nile-colors-primary-500, var(--ng-colors-border-brand ));
+    box-shadow: var(--nile-input-shadow-standard-focused-not-disabled, var(--ng-box-shadow-1));
+  }
+
+  .otp__cell--active {
+    position: relative;
+    cursor: text;
+    caret-color: auto;
+    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-primary ));
+    border-color: var(--nile-colors-primary-500, var(--ng-colors-border-brand ));
+    box-shadow: var(--nile-input-shadow-standard-focused-not-disabled, var(--ng-box-shadow-1));
+  }
+
+  .otp__cell--active::before {
+    content: "";
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+    border-radius: inherit;
+    box-shadow: inset 0 0 0 1px var(--nile-colors-primary-500, var(--ng-colors-border-brand));
+  }
+
+  .otp--warning .otp__cell:focus,
+  .otp--warning .otp__cell--active {
+    border-color: var(--nile-colors-primary-500, var(--ng-colors-border-warning));
+    box-shadow: var(--nile-input-shadow-standard-focused-not-disabled, var(--ng-box-shadow-1));
+    outline: var(--nile-border-width-1, var(--ng-border-width-1)) solid var(--nile-outline-none, var(--ng-colors-border-warning));
+  }
+
+  .otp--warning .otp__cell--active::before {
+    box-shadow: inset 0 0 0 1px var(--nile-colors-yellow-500, var(--ng-colors-border-warning));
+  }
+
+  .otp--success .otp__cell:focus,
+  .otp--success .otp__cell--active {
+    border-color: var(--nile-colors-primary-500, var(--ng-colors-border-success));
+    box-shadow: var(--nile-input-shadow-standard-focused-not-disabled, var(--ng-box-shadow-1));
+    outline: var(--nile-border-width-1, var(--ng-border-width-1)) solid var(--nile-outline-none, var(--ng-colors-border-success));
+  }
+
+  .otp--success .otp__cell--active::before {
+    box-shadow: inset 0 0 0 1px var(--nile-colors-green-500, var(--ng-colors-border-success));
+  }
+
+  .otp--error .otp__cell:focus,
+  .otp--error .otp__cell--active {
+    border-color: var(--nile-colors-primary-500, var(--ng-colors-border-error));
+    box-shadow: var(--nile-input-shadow-standard-focused-not-disabled, var(--ng-box-shadow-1));
+    outline: var(--nile-border-width-1, var(--ng-border-width-1)) solid var(--nile-outline-none, var(--ng-colors-border-error));
+  }
+
+  .otp--error .otp__cell--active::before {
+    box-shadow: inset 0 0 0 1px var(--nile-colors-red-500, var(--ng-colors-border-error));
+  }
+
+  .otp__cell::selection {
+    background-color: var(--nile-colors-primary-600, var(--ng-colors-bg-brand-primary ));
+    color: var(--nile-colors-white-base, var(--ng-colors-fg-white));
+  }
+
+  .otp__cell::placeholder {
+    color: var(--nile-colors-dark-500, var(--ng-colors-text-placeholder-subtle));
+    opacity: 0.9;
+    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-500));
+  }
+
+  /* ---- Separator ---- */
+
+  .otp__separator {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    color: var(--nile-colors-dark-500, var(--ng-colors-text-placeholder-subtle));
+    font-family: var(--nile-font-family, var(--ng-font-family-display ));
+    font-size: var(--nile-type-scale-7, var(--ng-font-size-text-xl));
+    font-weight: var(--nile-font-weight-medium, var(--ng-font-weight-500));
+    line-height: var(--nile-type-scale-7, var(--ng-line-height-text-xl));
+    user-select: none;
+  }
+
+  /* ---- State: warning ---- */
+
+  .otp--warning .otp__cell {
+    border-color: var(--nile-colors-yellow-500, var(--ng-colors-border-warning-subtle ));
+  }
+
+  /* ---- State: error ---- */
+
+  .otp--error .otp__cell {
+    border-color: var(--nile-colors-red-500, var(--ng-colors-border-error-subtle ));
+  }
+
+  /* ---- State: success ---- */
+
+  .otp--success .otp__cell {
+    border-color: var(--nile-colors-green-500, var(--ng-colors-border-success-subtle));
+  }
+
+  /* ---- State: readonly ---- */
+
+  .otp--readonly .otp__cell {
+    cursor: default;
+  }
+
+  /* ---- State: disabled (mirrors .input--standard.input--disabled) ---- */
+
+  .otp--disabled .otp__cell {
+    cursor: not-allowed;
+    color: var(--nile-colors-neutral-500, var(--ng-colors-text-disabled ));
+    border-color: var(--nile-colors-neutral-500, var(--ng-colors-border-disabled ));
+    background-color: var(--nile-colors-white-base, var(--ng-colors-bg-disabled-subtle ));
+  }
+
+  .otp--disabled .otp__cell::placeholder {
+    color: var(--nile-input-standard-disabled-placeholder-font-color, var(--ng-colors-text-disabled ));
+  }
+
+  /* ---- Hidden value input ---- */
+
+  .otp__value-input {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    padding: 0;
+    margin: 0;
+    opacity: 0;
+    z-index: -1;
+    pointer-events: none;
+  }
+
+  /* ---- Help text ---- */
+
+  .form-control__help-text {
+    color: var(--nile-colors-dark-900, var(--ng-colors-text-tertiary-600));
+    font-family: var(--nile-font-family-serif, var(--ng-font-family-body ));
+    font-size: var(--nile-type-scale-2, var(--ng-font-size-text-sm ));
+    font-style: normal;
+    font-weight: var(--nile-font-weight-regular, var(--ng-font-weight-400 ));
+    line-height: var(--nile-type-scale-2, var(--ng-line-height-text-sm ));
+    letter-spacing: 0.2px;
+  }
+
+  /* ---- Error message ---- */
+
+  .form-control__error-message {
+    display: block;
+    color: var(--nile-colors-red-700, var(--ng-colors-text-error-primary-600));
+    margin-top: var(--nile-spacing-lg, var(--ng-spacing-1-5 ));
+    font-size: var(--nile-type-scale-2, var(--ng-font-size-text-sm ));
+    font-style: normal;
+    line-height: var(--nile-form-error-text-line-height, var(--ng-line-height-text-sm));
+    letter-spacing: 0.2px;
+  }
+`;
+
+export default [styles];

package/src/nile-otp-input/nile-otp-input.enum.ts

@@ -0,0 +1,30 @@
+export enum OtpInputMode {
+  NONE = 'none',
+  TEXT = 'text',
+  DECIMAL = 'decimal',
+  NUMERIC = 'numeric',
+  TEL = 'tel',
+  SEARCH = 'search',
+  EMAIL = 'email',
+  URL = 'url',
+}
+
+export enum OtpInputType {
+  TEXT = 'text',
+  PASSWORD = 'password',
+}
+
+export enum OtpEnterKeyHint {
+  DONE = 'done',
+  NEXT = 'next',
+}
+
+export enum OtpAutoComplete {
+  ONE_TIME_CODE = 'one-time-code',
+  OFF = 'off',
+}
+
+export enum OtpCellPattern {
+  NUMERIC = '[0-9]*',
+  ALPHANUMERIC = '[A-Za-z0-9]*',
+}