@aquera/nile-elements 0.0.1-beta.1

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

@@ -0,0 +1,419 @@
+/**
+ * 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.
+ */
+import { css } from 'lit-element';
+/**
+ * Input CSS
+ */
+export const styles = css `
+  :host {
+    display: block;
+  }
+
+  .form-control .form-control__label {
+    display: none;
+  }
+
+  .form-control .form-control__help-text {
+    display: none;
+  }
+
+  /* Label */
+  .form-control--has-label .form-control__label {
+    display: inline-block;
+    color: inherit;
+    margin-bottom: 0.125rem;
+  }
+
+  .form-control--has-label.form-control--small .form-control__label {
+    font-size: 0.875rem;
+  }
+
+  .form-control--has-label.form-control--medium .form-control__label {
+    font-size: 1rem;
+  }
+
+  .form-control--has-label.form-control--large .form-control__label {
+    font-size: 1.25rem;
+  }
+
+  :host([required]) .form-control--has-label .form-control__label::after {
+    content: '*';
+    margin-inline-start: -2px;
+    color: undefined;
+  }
+
+  /* Help text */
+  .form-control--has-help-text .form-control__help-text {
+    display: block;
+    color: hsl(240 3.8% 46.1%);
+    margin-top: 0.125rem;
+  }
+
+  .form-control--has-help-text.form-control--small .form-control__help-text {
+    font-size: 0.75rem;
+  }
+
+  .form-control--has-help-text.form-control--medium .form-control__help-text {
+    font-size: 0.875rem;
+  }
+
+  .form-control--has-help-text.form-control--large .form-control__help-text {
+    font-size: 1rem;
+  }
+
+  .form-control--has-help-text.form-control--radio-group
+    .form-control__help-text {
+    margin-top: 0.25rem;
+  }
+
+  .input {
+    flex: 1 1 auto;
+    display: inline-flex;
+    align-items: stretch;
+    justify-content: start;
+    position: relative;
+    width: 100%;
+    font-family: inherit;
+    font-weight: 400;
+    letter-spacing: normal;
+    vertical-align: middle;
+    overflow: hidden;
+    cursor: text;
+    transition: 150ms color, 150ms border, 150ms box-shadow,
+      150ms background-color;
+  }
+
+  /* Standard inputs */
+  .input--standard {
+    background-color: hsl(0, 0%, 100%);
+    border: solid 1px #c7ced4;
+  }
+
+  .input--standard:hover:not(.input--disabled) {
+    background-color: hsl(0, 0%, 100%);
+    border-color: #000000;
+  }
+
+  .input--standard.input--focused:not(.input--disabled) {
+    background-color: hsl(0, 0%, 100%);
+    border-color: #005ea6;
+    box-shadow: 0 0 0 3px hsl(198.6 88.7% 48.4% / 40%);
+  }
+
+  .input--standard.input--focused:not(.input--disabled) .input__control {
+    color: hsl(240 5.3% 26.1%);
+  }
+
+  .input--standard.input--disabled {
+    background-color: hsl(240 4.8% 95.9%);
+    border-color: hsl(240 4.9% 83.9%);
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .input--standard.input--disabled .input__control {
+    color: hsl(240 5.9% 10%);
+  }
+
+  .input--standard.input--disabled .input__control::placeholder {
+    color: hsl(240 5.2% 33.9%);
+  }
+
+  .input--standard.input--warning {
+    border-color: #E5BF43;
+  }
+
+  .input--standard.input--error {
+    border-color: #E5434D;
+  }
+
+  .input--standard.input--success {
+    border-color: #43E5C0;
+  }
+
+  /* Filled inputs */
+  .input--filled {
+    border: none;
+    background-color: hsl(240 4.8% 95.9%);
+    color: hsl(240 5.3% 26.1%);
+  }
+
+  .input--filled:hover:not(.input--disabled) {
+    background-color: hsl(240 4.8% 95.9%);
+  }
+
+  .input--filled.input--focused:not(.input--disabled) {
+    background-color: hsl(240 4.8% 95.9%);
+    outline: solid 3px hsl(200.4 98% 39.4%);
+    outline-offset: 1px;
+  }
+
+  .input--filled.input--disabled {
+    background-color: hsl(240 4.8% 95.9%);
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .input__control {
+    flex: 1 1 auto;
+    font-family: inherit;
+    font-size: inherit;
+    font-weight: inherit;
+    min-width: 0;
+    height: 100%;
+    color: hsl(240 5.3% 26.1%);
+    border: none;
+    background: none;
+    box-shadow: none;
+    padding: 0;
+    margin: 0;
+    cursor: inherit;
+    -webkit-appearance: none;
+  }
+
+  .input__control::-webkit-search-decoration,
+  .input__control::-webkit-search-cancel-button,
+  .input__control::-webkit-search-results-button,
+  .input__control::-webkit-search-results-decoration {
+    -webkit-appearance: none;
+  }
+
+  .input__control:-webkit-autofill {
+    box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;
+    -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);
+    caret-color: hsl(240 5.3% 26.1%);
+  }
+
+  .input__control:-webkit-autofill:hover {
+    box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;
+    -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);
+    caret-color: hsl(240 5.3% 26.1%);
+  }
+
+  .input__control:-webkit-autofill:focus {
+    box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;
+    -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);
+    caret-color: hsl(240 5.3% 26.1%);
+  }
+
+  .input__control:-webkit-autofill:active {
+    box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;
+    -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);
+    caret-color: hsl(240 5.3% 26.1%);
+  }
+
+  .input--filled .input__control:-webkit-autofill {
+    box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;
+  }
+
+  .input--filled .input__control:-webkit-autofill:hover {
+    box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;
+  }
+
+  .input--filled .input__control:-webkit-autofill:focus {
+    box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;
+  }
+
+  .input--filled .input__control:-webkit-autofill:active {
+    box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;
+  }
+
+  .input__control::placeholder {
+    color: hsl(240 3.8% 46.1%);
+    user-select: none;
+  }
+
+  .input:hover:not(.input--disabled) .input__control {
+    color: hsl(240 5.3% 26.1%);
+  }
+
+  .input__control:focus {
+    outline: none;
+  }
+
+  .input__prefix,
+  .input__suffix {
+    display: inline-flex;
+    flex: 0 0 auto;
+    align-items: center;
+    cursor: default;
+  }
+
+  .input__prefix::slotted(nile-icon) {
+    color: hsl(240 3.8% 46.1%);
+  }
+
+  .input__suffix::slotted(nile-icon) {
+    color: hsl(240 3.8% 46.1%);
+  }
+
+  /*
+   * Size modifiers
+   */
+
+  .input--small {
+    border-radius: 0.25rem;
+    font-size: 0.875rem;
+    height: 1.875rem;
+  }
+
+  .input--small .input__control {
+    height: calc(1.875rem - 1px * 2);
+    padding: 0 0.75rem;
+  }
+
+  .input--small .input__clear {
+    width: calc(1em + 0.75rem * 2);
+  }
+
+  .input--small .input__password-toggle {
+    width: calc(1em + 0.75rem * 2);
+  }
+
+  .input--small .input__prefix::slotted(*) {
+    margin-inline-start: 0.75rem;
+  }
+
+  .input--small .input__suffix::slotted(*) {
+    margin-inline-end: 0.75rem;
+  }
+
+  .input--medium {
+    border-radius: 0.25rem;
+    font-size: 1rem;
+    height: 38px;
+  }
+
+  .input--medium .input__control {
+    height: calc(42px - 1px * 2);
+    padding: 0 1rem;
+  }
+
+  .input--medium .input__clear {
+    width: calc(1em + 1rem * 2);
+  }
+
+  .input--medium .input__password-toggle {
+    width: calc(1em + 1rem * 2);
+  }
+
+  .input--medium .input__prefix::slotted(*) {
+    margin-inline-start: 1rem;
+  }
+
+  .input--medium .input__suffix::slotted(*) {
+    margin-inline-end: 1rem;
+  }
+
+  .input--large {
+    border-radius: 0.25rem;
+    font-size: 1.25rem;
+    height: 3.125rem;
+  }
+
+  .input--large .input__control {
+    height: calc(3.125rem - 1px * 2);
+    padding: 0 1.25rem;
+  }
+
+  .input--large .input__clear {
+    width: calc(1em + 1.25rem * 2);
+  }
+
+  .input--large .input__password-toggle {
+    width: calc(1em + 1.25rem * 2);
+  }
+
+  .input--large .input__prefix::slotted(*) {
+    margin-inline-start: 1.25rem;
+  }
+
+  .input--large .input__suffix::slotted(*) {
+    margin-inline-end: 1.25rem;
+  }
+
+  /*
+   * Pill modifier
+   */
+
+  .input--pill.input--small {
+    border-radius: 1.875rem;
+  }
+
+  .input--pill.input--medium {
+    border-radius: 2.5rem;
+  }
+
+  .input--pill.input--large {
+    border-radius: 3.125rem;
+  }
+
+  /*
+   * Clearable + Password Toggle
+   */
+
+  .input__clear {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    font-size: inherit;
+    color: hsl(240 3.8% 46.1%);
+    border: none;
+    background: none;
+    padding: 0;
+    transition: 150ms color;
+    cursor: pointer;
+  }
+
+  .input__password-toggle {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    font-size: inherit;
+    color: hsl(240 3.8% 46.1%);
+    border: none;
+    background: none;
+    padding: 0;
+    transition: 150ms color;
+    cursor: pointer;
+  }
+
+  .input__clear:hover {
+    color: hsl(240 5.2% 33.9%);
+  }
+
+  .input__password-toggle:hover {
+    color: hsl(240 5.2% 33.9%);
+  }
+
+  .input__clear:focus,
+  .input__password-toggle:focus {
+    outline: none;
+  }
+
+  .input--empty .input__clear {
+    visibility: hidden;
+  }
+
+  /* Don't show the browser's password toggle in Edge */
+  ::-ms-reveal {
+    display: none;
+  }
+
+  /* Hide the built-in number spinner */
+  .input--no-spin-buttons input[type='number']::-webkit-outer-spin-button,
+  .input--no-spin-buttons input[type='number']::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    display: none;
+  }
+
+  .input--no-spin-buttons input[type='number'] {
+    -moz-appearance: textfield;
+  }
+`;
+export default [styles];
+//# sourceMappingURL=nile-input.css.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"nile-input.css.js","sourceRoot":"","sources":["../../../src/nile-input/nile-input.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsZxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\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 { css } from 'lit-element';\n\n/**\n * Input CSS\n */\nexport const styles = css`\n  :host {\n    display: block;\n  }\n\n  .form-control .form-control__label {\n    display: none;\n  }\n\n  .form-control .form-control__help-text {\n    display: none;\n  }\n\n  /* Label */\n  .form-control--has-label .form-control__label {\n    display: inline-block;\n    color: inherit;\n    margin-bottom: 0.125rem;\n  }\n\n  .form-control--has-label.form-control--small .form-control__label {\n    font-size: 0.875rem;\n  }\n\n  .form-control--has-label.form-control--medium .form-control__label {\n    font-size: 1rem;\n  }\n\n  .form-control--has-label.form-control--large .form-control__label {\n    font-size: 1.25rem;\n  }\n\n  :host([required]) .form-control--has-label .form-control__label::after {\n    content: '*';\n    margin-inline-start: -2px;\n    color: undefined;\n  }\n\n  /* Help text */\n  .form-control--has-help-text .form-control__help-text {\n    display: block;\n    color: hsl(240 3.8% 46.1%);\n    margin-top: 0.125rem;\n  }\n\n  .form-control--has-help-text.form-control--small .form-control__help-text {\n    font-size: 0.75rem;\n  }\n\n  .form-control--has-help-text.form-control--medium .form-control__help-text {\n    font-size: 0.875rem;\n  }\n\n  .form-control--has-help-text.form-control--large .form-control__help-text {\n    font-size: 1rem;\n  }\n\n  .form-control--has-help-text.form-control--radio-group\n    .form-control__help-text {\n    margin-top: 0.25rem;\n  }\n\n  .input {\n    flex: 1 1 auto;\n    display: inline-flex;\n    align-items: stretch;\n    justify-content: start;\n    position: relative;\n    width: 100%;\n    font-family: inherit;\n    font-weight: 400;\n    letter-spacing: normal;\n    vertical-align: middle;\n    overflow: hidden;\n    cursor: text;\n    transition: 150ms color, 150ms border, 150ms box-shadow,\n      150ms background-color;\n  }\n\n  /* Standard inputs */\n  .input--standard {\n    background-color: hsl(0, 0%, 100%);\n    border: solid 1px #c7ced4;\n  }\n\n  .input--standard:hover:not(.input--disabled) {\n    background-color: hsl(0, 0%, 100%);\n    border-color: #000000;\n  }\n\n  .input--standard.input--focused:not(.input--disabled) {\n    background-color: hsl(0, 0%, 100%);\n    border-color: #005ea6;\n    box-shadow: 0 0 0 3px hsl(198.6 88.7% 48.4% / 40%);\n  }\n\n  .input--standard.input--focused:not(.input--disabled) .input__control {\n    color: hsl(240 5.3% 26.1%);\n  }\n\n  .input--standard.input--disabled {\n    background-color: hsl(240 4.8% 95.9%);\n    border-color: hsl(240 4.9% 83.9%);\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .input--standard.input--disabled .input__control {\n    color: hsl(240 5.9% 10%);\n  }\n\n  .input--standard.input--disabled .input__control::placeholder {\n    color: hsl(240 5.2% 33.9%);\n  }\n\n  .input--standard.input--warning {\n    border-color: #E5BF43;\n  }\n\n  .input--standard.input--error {\n    border-color: #E5434D;\n  }\n\n  .input--standard.input--success {\n    border-color: #43E5C0;\n  }\n\n  /* Filled inputs */\n  .input--filled {\n    border: none;\n    background-color: hsl(240 4.8% 95.9%);\n    color: hsl(240 5.3% 26.1%);\n  }\n\n  .input--filled:hover:not(.input--disabled) {\n    background-color: hsl(240 4.8% 95.9%);\n  }\n\n  .input--filled.input--focused:not(.input--disabled) {\n    background-color: hsl(240 4.8% 95.9%);\n    outline: solid 3px hsl(200.4 98% 39.4%);\n    outline-offset: 1px;\n  }\n\n  .input--filled.input--disabled {\n    background-color: hsl(240 4.8% 95.9%);\n    opacity: 0.5;\n    cursor: not-allowed;\n  }\n\n  .input__control {\n    flex: 1 1 auto;\n    font-family: inherit;\n    font-size: inherit;\n    font-weight: inherit;\n    min-width: 0;\n    height: 100%;\n    color: hsl(240 5.3% 26.1%);\n    border: none;\n    background: none;\n    box-shadow: none;\n    padding: 0;\n    margin: 0;\n    cursor: inherit;\n    -webkit-appearance: none;\n  }\n\n  .input__control::-webkit-search-decoration,\n  .input__control::-webkit-search-cancel-button,\n  .input__control::-webkit-search-results-button,\n  .input__control::-webkit-search-results-decoration {\n    -webkit-appearance: none;\n  }\n\n  .input__control:-webkit-autofill {\n    box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n    -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n    caret-color: hsl(240 5.3% 26.1%);\n  }\n\n  .input__control:-webkit-autofill:hover {\n    box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n    -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n    caret-color: hsl(240 5.3% 26.1%);\n  }\n\n  .input__control:-webkit-autofill:focus {\n    box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n    -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n    caret-color: hsl(240 5.3% 26.1%);\n  }\n\n  .input__control:-webkit-autofill:active {\n    box-shadow: 0 0 0 3.125rem hsl(0, 0%, 100%) inset !important;\n    -webkit-text-fill-color: hsl(198.6 88.7% 48.4%);\n    caret-color: hsl(240 5.3% 26.1%);\n  }\n\n  .input--filled .input__control:-webkit-autofill {\n    box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n  }\n\n  .input--filled .input__control:-webkit-autofill:hover {\n    box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n  }\n\n  .input--filled .input__control:-webkit-autofill:focus {\n    box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n  }\n\n  .input--filled .input__control:-webkit-autofill:active {\n    box-shadow: 0 0 0 3.125rem hsl(240 4.8% 95.9%) inset !important;\n  }\n\n  .input__control::placeholder {\n    color: hsl(240 3.8% 46.1%);\n    user-select: none;\n  }\n\n  .input:hover:not(.input--disabled) .input__control {\n    color: hsl(240 5.3% 26.1%);\n  }\n\n  .input__control:focus {\n    outline: none;\n  }\n\n  .input__prefix,\n  .input__suffix {\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    cursor: default;\n  }\n\n  .input__prefix::slotted(nile-icon) {\n    color: hsl(240 3.8% 46.1%);\n  }\n\n  .input__suffix::slotted(nile-icon) {\n    color: hsl(240 3.8% 46.1%);\n  }\n\n  /*\n   * Size modifiers\n   */\n\n  .input--small {\n    border-radius: 0.25rem;\n    font-size: 0.875rem;\n    height: 1.875rem;\n  }\n\n  .input--small .input__control {\n    height: calc(1.875rem - 1px * 2);\n    padding: 0 0.75rem;\n  }\n\n  .input--small .input__clear {\n    width: calc(1em + 0.75rem * 2);\n  }\n\n  .input--small .input__password-toggle {\n    width: calc(1em + 0.75rem * 2);\n  }\n\n  .input--small .input__prefix::slotted(*) {\n    margin-inline-start: 0.75rem;\n  }\n\n  .input--small .input__suffix::slotted(*) {\n    margin-inline-end: 0.75rem;\n  }\n\n  .input--medium {\n    border-radius: 0.25rem;\n    font-size: 1rem;\n    height: 38px;\n  }\n\n  .input--medium .input__control {\n    height: calc(42px - 1px * 2);\n    padding: 0 1rem;\n  }\n\n  .input--medium .input__clear {\n    width: calc(1em + 1rem * 2);\n  }\n\n  .input--medium .input__password-toggle {\n    width: calc(1em + 1rem * 2);\n  }\n\n  .input--medium .input__prefix::slotted(*) {\n    margin-inline-start: 1rem;\n  }\n\n  .input--medium .input__suffix::slotted(*) {\n    margin-inline-end: 1rem;\n  }\n\n  .input--large {\n    border-radius: 0.25rem;\n    font-size: 1.25rem;\n    height: 3.125rem;\n  }\n\n  .input--large .input__control {\n    height: calc(3.125rem - 1px * 2);\n    padding: 0 1.25rem;\n  }\n\n  .input--large .input__clear {\n    width: calc(1em + 1.25rem * 2);\n  }\n\n  .input--large .input__password-toggle {\n    width: calc(1em + 1.25rem * 2);\n  }\n\n  .input--large .input__prefix::slotted(*) {\n    margin-inline-start: 1.25rem;\n  }\n\n  .input--large .input__suffix::slotted(*) {\n    margin-inline-end: 1.25rem;\n  }\n\n  /*\n   * Pill modifier\n   */\n\n  .input--pill.input--small {\n    border-radius: 1.875rem;\n  }\n\n  .input--pill.input--medium {\n    border-radius: 2.5rem;\n  }\n\n  .input--pill.input--large {\n    border-radius: 3.125rem;\n  }\n\n  /*\n   * Clearable + Password Toggle\n   */\n\n  .input__clear {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    font-size: inherit;\n    color: hsl(240 3.8% 46.1%);\n    border: none;\n    background: none;\n    padding: 0;\n    transition: 150ms color;\n    cursor: pointer;\n  }\n\n  .input__password-toggle {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    font-size: inherit;\n    color: hsl(240 3.8% 46.1%);\n    border: none;\n    background: none;\n    padding: 0;\n    transition: 150ms color;\n    cursor: pointer;\n  }\n\n  .input__clear:hover {\n    color: hsl(240 5.2% 33.9%);\n  }\n\n  .input__password-toggle:hover {\n    color: hsl(240 5.2% 33.9%);\n  }\n\n  .input__clear:focus,\n  .input__password-toggle:focus {\n    outline: none;\n  }\n\n  .input--empty .input__clear {\n    visibility: hidden;\n  }\n\n  /* Don't show the browser's password toggle in Edge */\n  ::-ms-reveal {\n    display: none;\n  }\n\n  /* Hide the built-in number spinner */\n  .input--no-spin-buttons input[type='number']::-webkit-outer-spin-button,\n  .input--no-spin-buttons input[type='number']::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    display: none;\n  }\n\n  .input--no-spin-buttons input[type='number'] {\n    -moz-appearance: textfield;\n  }\n`;\n\nexport default [styles];\n"]}

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

@@ -0,0 +1,159 @@
+/**
+ * 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.
+ */
+import { TemplateResult } from 'lit-element';
+import '../nile-icon';
+import type { CSSResultGroup } from 'lit';
+import NileElement, { NileFormControl } from '../internal/nile-element';
+/**
+ * Nile icon component.
+ *
+ * @tag nile-input
+ *
+ */
+export declare class NileInput extends NileElement implements NileFormControl {
+    static styles: CSSResultGroup;
+    private readonly formControlController;
+    private readonly hasSlotController;
+    input: HTMLInputElement;
+    private hasFocus;
+    title: string;
+    /**
+     * The type of input. Works the same as a native `<input>` element, but only a subset of types are supported. Defaults
+     * to `text`.
+     */
+    type: 'date' | 'datetime-local' | 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'time' | 'url';
+    /** The name of the input, submitted as a name/value pair with form data. */
+    name: string;
+    /** The current value of the input, submitted as a name/value pair with form data. */
+    value: string;
+    /** The default value of the form control. Primarily used for resetting the form control. */
+    defaultValue: string;
+    /** The input's size. */
+    size: 'small' | 'medium' | 'large';
+    /** Draws a filled input. */
+    filled: boolean;
+    /** Sets the input to a warning state, changing its visual appearance. */
+    warning: boolean;
+    /** Sets the input to an error state, changing its visual appearance. */
+    error: boolean;
+    /** Sets the input to a success state, changing its visual appearance. */
+    success: boolean;
+    /** Draws a pill-style input with rounded edges. */
+    pill: boolean;
+    /** The input's label. If you need to display HTML, use the `label` slot instead. */
+    label: string;
+    /** The input's help text. If you need to display HTML, use the `help-text` slot instead. */
+    helpText: string;
+    /** Adds a clear button when the input is not empty. */
+    clearable: boolean;
+    /** Disables the input. */
+    disabled: boolean;
+    /** Placeholder text to show as a hint when the input is empty. */
+    placeholder: string;
+    /** Makes the input readonly. */
+    readonly: boolean;
+    /** Adds a button to toggle the password's visibility. Only applies to password types. */
+    passwordToggle: boolean;
+    /** Determines whether or not the password is currently visible. Only applies to password input types. */
+    passwordVisible: boolean;
+    /** Hides the browser's built-in increment/decrement spin buttons for number inputs. */
+    noSpinButtons: boolean;
+    /**
+     * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
+     * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
+     * the same document or shadow root for this to work.
+     */
+    form: string;
+    /** Makes the input a required field. */
+    required: boolean;
+    /** A regular expression pattern to validate input against. */
+    pattern: string;
+    /** The minimum length of input that will be considered valid. */
+    minlength: number;
+    /** The maximum length of input that will be considered valid. */
+    maxlength: number;
+    /** The input's minimum value. Only applies to date and number input types. */
+    min: number | string;
+    /** The input's maximum value. Only applies to date and number input types. */
+    max: number | string;
+    /**
+     * Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is
+     * implied, allowing any numeric value. Only applies to date and number input types.
+     */
+    step: number | 'any';
+    /** Controls whether and how text input is automatically capitalized as it is entered by the user. */
+    autocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
+    /** Indicates whether the browser's autocorrect feature is on or off. */
+    autocorrect: 'off' | 'on';
+    /**
+     * Specifies what permission the browser has to provide assistance in filling out form field values. Refer to
+     * [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.
+     */
+    autocomplete: string;
+    /** Indicates that the input should receive focus on page load. */
+    autofocus: boolean;
+    /** Used to customize the label or icon of the Enter key on virtual keyboards. */
+    enterkeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
+    /** Enables spell checking on the input. */
+    spellcheck: boolean;
+    /**
+     * Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual
+     * keyboard on supportive devices.
+     */
+    inputmode: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
+    /** Gets or sets the current value as a `Date` object. Returns `null` if the value can't be converted. */
+    get valueAsDate(): Date | null;
+    set valueAsDate(newValue: Date | null);
+    /** Gets or sets the current value as a number. Returns `NaN` if the value can't be converted. */
+    get valueAsNumber(): number;
+    set valueAsNumber(newValue: number);
+    /** Gets the validity state object */
+    get validity(): ValidityState;
+    /** Gets the validation message */
+    get validationMessage(): string;
+    firstUpdated(): void;
+    private handleBlur;
+    private handleChange;
+    private handleClearClick;
+    private handleFocus;
+    private handleInput;
+    private handleInvalid;
+    private handleKeyDown;
+    private handlePasswordToggle;
+    handleDisabledChange(): void;
+    handleStepChange(): void;
+    handleValueChange(): Promise<void>;
+    /** Sets focus on the input. */
+    focus(options?: FocusOptions): void;
+    /** Removes focus from the input. */
+    blur(): void;
+    /** Selects all the text in the input. */
+    select(): void;
+    /** Sets the start and end positions of the text selection (0-based). */
+    setSelectionRange(selectionStart: number, selectionEnd: number, selectionDirection?: 'forward' | 'backward' | 'none'): void;
+    /** Replaces a range of text with a new string. */
+    setRangeText(replacement: string, start?: number, end?: number, selectMode?: 'select' | 'start' | 'end' | 'preserve'): void;
+    /** Increments the value of a numeric input type by the value of the step attribute. */
+    stepUp(): void;
+    /** Decrements the value of a numeric input type by the value of the step attribute. */
+    stepDown(): void;
+    /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
+    checkValidity(): boolean;
+    /** Gets the associated form, if one exists. */
+    getForm(): HTMLFormElement | null;
+    /** Checks for validity and shows the browser's validation message if the control is invalid. */
+    reportValidity(): boolean;
+    /** Sets a custom validation message. Pass an empty string to restore validity. */
+    setCustomValidity(message: string): void;
+    render(): TemplateResult<1>;
+}
+export default NileInput;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-input': NileInput;
+    }
+}