@nysds/nys-button 1.12.0 → 1.13.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/nys-button.js +9 -6
  2. package/dist/nys-button.js.map +1 -1
  3. package/package.json +2 -2
package/dist/nys-button.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { LitElement as y, unsafeCSS as d, html as s } from "lit";
2
2
  import { property as r } from "lit/decorators.js";
3
3
  import { ifDefined as a } from "lit/directives/if-defined.js";
4
- const v = ':host{display:block;width:fit-content;height:fit-content;--_nys-button-width: fit-content;--_nys-button-height: var(--nys-size-600, 48px);--_nys-button-border-radius--start: var(--nys-radius-xl, 12px);--_nys-button-border-radius--end: var(--nys-radius-xl, 12px);--_nys-button-padding--y: calc( var(--nys-space-150, 12px) - var(--nys-border-width-md, 2px) );--_nys-button-padding--x: calc( var(--nys-space-250, 20px) - var(--nys-border-width-md, 2px) );--_nys-button-gap: var(--nys-space-100, 8px);--_nys-button-border-width: var(--nys-border-width-md, 2px);--_nys-button-outline-width: var(--nys-border-width-md, 2px);--_nys-button-outline-offset: var(--nys-space-2px, 2px);--_nys-button-outline-color: var(--nys-color-focus, #004dd1);--_nys-button-background-color: var( --nys-button-background-color, var(--nys-color-theme, #154973) );--_nys-button-color: var( --nys-button-color, var(--nys-color-text-reverse, #ffffff) );--_nys-button-border-color: var( --nys-button-border-color, var(--nys-color-theme, #154973) );--_nys-button-background-color--hover: var( --nys-button-background-color--hover, var(--nys-color-theme-strong, #0e324f) );--_nys-button-color--hover: var( --nys-button-color--hover, var(--nys-color-text-reverse, #ffffff) );--_nys-button-border-color--hover: var( --nys-button-border-color--hover, var(--nys-color-theme-strong, #0e324f) );--_nys-button-background-color--active: var( --nys-button-background-color--active, var(--nys-color-theme-stronger, #081b2b) );--_nys-button-color--active: var( --nys-button-color--active, var(--nys-color-text-reverse, #ffffff) );--_nys-button-border-color--active: var( --nys-button-border-color--active, var(--nys-color-theme-stronger, #081b2b) );--_nys-button-background-color--disabled: var( --nys-color-neutral-10, #f6f6f6 );--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color--disabled: var(--nys-color-neutral-10, #f6f6f6);--_nys-button-font-size: var(--nys-font-size-ui-md, 16px);--_nys-button-font-weight: var(--nys-font-weight-semibold, 600);--_nys-button-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-button-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) )}:host([size=sm]){--_nys-button-height: var(--nys-size-500, 40px);--_nys-button-padding--y: calc( var(--nys-space-100, 8px) - var(--nys-border-width-md, 2px) );--_nys-button-padding--x: calc( var(--nys-space-200, 16px) - var(--nys-border-width-md, 2px) )}:host([size=md]){--_nys-button-height: var(--nys-size-600, 48px);--_nys-button-padding--y: calc( var(--nys-space-150, 12px) - var(--nys-border-width-md, 2px) );--_nys-button-padding--x: calc( var(--nys-space-250, 20px) - var(--nys-border-width-md, 2px) )}:host([size=lg]){--_nys-button-height: var(--nys-size-700, 56px);--_nys-button-padding--y: calc( var(--nys-space-200, 16px) - var(--nys-border-width-md, 2px) );--_nys-button-padding--x: calc( var(--nys-space-300, 24px) - var(--nys-border-width-md, 2px) )}:host([fullWidth]){--_nys-button-width: 100%}:host([variant=filled]){--_nys-button-background-color: var( --nys-button-background-color, var(--nys-color-theme, #154973) );--_nys-button-color: var( --nys-button-color, var(--nys-color-text-reverse, #ffffff) );--_nys-button-background-color--hover: var( --nys-button-background-color--hover, var(--nys-color-theme-strong, #0e324f) );--_nys-button-color--hover: var( --nys-button-color--hover, var(--nys-color-text-reverse, #ffffff) );--_nys-button-background-color--active: var( --nys-button-background-color--active, var(--nys-color-theme-stronger, #081b2b) );--_nys-button-color--active: var( --nys-button-color--active, var(--nys-color-text-reverse, #ffffff) );--_nys-button-background-color--disabled: var( --nys-color-neutral-10, #f6f6f6 );--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color: var( --nys-button-border-color, var(--nys-color-transparent, #ffffff00) )}:host([variant=outline]){--_nys-button-background-color: var( --nys-button-background-color, var(--nys-color-surface, #ffffff) );--_nys-button-color: var( --nys-button-color, var(--nys-color-theme, #154973) );--_nys-button-border-color: var( --nys-button-border-color, var(--nys-color-theme, #154973) );--_nys-button-background-color--hover: var( --nys-button-background-color--hover, var(--nys-color-theme-weaker, #eff6fb) );--_nys-button-color--hover: var( --nys-button-color--hover, var(--nys-color-theme, #154973) );--_nys-button-border-color--hover: var( --nys-button-border-color--hover, var(--nys-color-theme, #154973) );--_nys-button-background-color--active: var( --nys-button-background-color--active, var(--nys-color-theme-weak, #cddde9) );--_nys-button-color--active: var( --nys-button-color--active, var(--nys-color-theme, #154973) );--_nys-button-border-color--active: var( --nys-button-border-color--active, var(--nys-color-theme, #154973) );--_nys-button-background-color--disabled: var(--nys-color-surface, #ffffff);--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color--disabled: var(--nys-color-neutral-100, #d0d0ce)}:host([variant=text]){--_nys-button-height: fit-content;--_nys-button-border-radius--start: var(--nys-radius-md, 4px);--_nys-button-border-radius--end: var(--nys-radius-md, 4px);--_nys-button-padding--y: var(--nys-space-2px, 2px);--_nys-button-padding--x: var(--nys-space-50, 4px);--_nys-button-border-width: 0px;--_nys-button-text-decoration: underline;--_nys-button-background-color: var( --nys-button-background-color, var(--nys-color-transparent, #ffffff00) );--_nys-button-color: var( --nys-button-color, var(--nys-color-link, #004dd1) );--_nys-button-border-color: var( --nys-button-border-color, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--hover: var( --nys-button-background-color--hover, var(--nys-color-transparent, #ffffff00) );--_nys-button-color--hover: var( --nys-button-color--hover, var(--nys-color-link-strong, #003ba1) );--_nys-button-border-color--hover: var( --nys-button-border-color--hover, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--active: var( --nys-button-background-color--active, var(--nys-color-transparent, #ffffff00) );--_nys-button-color--active: var( --nys-button-color--active, var(--nys-color-link-strongest, #002971) );--_nys-button-border-color--active: var( --nys-button-border-color--active, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--disabled: var( --nys-color-transparent, #ffffff00 );--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color--disabled: var( --nys-color-transparent, #ffffff00 )}:host([variant=ghost]){--_nys-button-background-color: var( --nys-button-background-color, var(--nys-color-transparent, #ffffff00) );--_nys-button-color: var( --nys-button-color, var(--nys-color-text, #1b1b1b) );--_nys-button-border-color: var( --nys-button-border-color, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--hover: var( --nys-button-background-color--hover, var(--nys-color-black-transparent-100, #0000001a) );--_nys-button-color--hover: var( --nys-button-color--hover, var(--nys-color-text, #1b1b1b) );--_nys-button-border-color--hover: var( --nys-button-border-color--hover, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--active: var( --nys-button-background-color--active, var(--nys-color-black-transparent-200, #00000033) );--_nys-button-color--active: var( --nys-button-color--active, var(--nys-color-text, #1b1b1b) );--_nys-button-border-color--active: var( --nys-button-border-color--active, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--disabled: var( --nys-color-transparent, #ffffff00 );--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color--disabled: var( --nys-color-transparent, #ffffff00 )}:host([variant=filled][inverted]){--_nys-button-background-color: var( --nys-button-background-color, var(--nys-color-surface, #ffffff) );--_nys-button-color: var( --nys-button-color, var(--nys-color-text, #1b1b1b) );--_nys-button-background-color--hover: var( --nys-button-background-color--hover, var(--nys-color-neutral-100, #d0d0ce) );--_nys-button-color--hover: var( --nys-button-color--hover, var(--nys-color-text, #1b1b1b) );--_nys-button-background-color--active: var( --nys-button-background-color--active, var(--nys-color-neutral-300, #a7a9ab) );--_nys-button-color--active: var( --nys-button-color--active, var(--nys-color-text, #1b1b1b) );--_nys-button-background-color--disabled: var(--nys-color-text, #1b1b1b);--_nys-button-color--disabled: var(--nys-color-text-disabled, #62666a);--_nys-button-border-color--disabled: var( --nys-color-transparent, #ffffff00 )}:host([variant=outline][inverted]){--_nys-button-background-color: var( --nys-button-background-color, var(--nys-color-surface-reverse, #1b1b1b) );--_nys-button-color: var( --nys-button-color, var(--nys-color-text-reverse, #ffffff) );--_nys-button-border-color: var( --nys-button-border-color, var(--nys-color-ink-reverse, #ffffff) );--_nys-button-background-color--hover: var( --nys-button-background-color--hover, var(--nys-color-surface-reverse, #1b1b1b) );--_nys-button-color--hover: var( --nys-button-color--hover, var(--nys-color-text-reverse-weak, #d0d0ce) );--_nys-button-border-color--hover: var( --nys-button-border-color--hover, var(--nys-color-neutral-100, #d0d0ce) );--_nys-button-background-color--active: var( --nys-button-background-color--active, var(--nys-color-surface-reverse, #1b1b1b) );--_nys-button-color--active: var( --nys-button-color--active, var(--nys-color-text-reverse-weaker, #bec0c1) );--_nys-button-border-color--active: var( --nys-button-border-color--active, var(--nys-color-neutral-300, #a7a9ab) );--_nys-button-background-color--disabled: var( --nys-color-surface-reverse, #1b1b1b );--_nys-button-color--disabled: var( --nys-color-text-reverse-disabled, #62666a );--_nys-button-border-color--disabled: var(--nys-color-neutral-600, #62666a)}:host([variant=text][inverted]){--_nys-button-height: fit-content;--_nys-button-border-radius--start: var(--nys-radius-md, 4px);--_nys-button-border-radius--end: var(--nys-radius-md, 4px);--_nys-button-padding--y: var(--nys-space-2px, 2px);--_nys-button-padding--x: var(--nys-space-50, 4px);--_nys-button-border-width: 0px;--_nys-button-text-decoration: underline;--_nys-button-background-color: var( --nys-button-background-color, var(--nys-color-transparent, #ffffff00) );--_nys-button-color: var( --nys-button-color, var(--nys-color-link-reverse, #a7a9ab) );--_nys-button-border-color: var( --nys-button-border-color, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--hover: var( --nys-button-background-color--hover, var(--nys-color-transparent, #ffffff00) );--_nys-button-color--hover: var( --nys-button-color--hover, var(--nys-color-link-reverse-strong, #ededed) );--_nys-button-border-color--hover: var( --nys-button-border-color--hover, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--active: var( --nys-button-background-color--active, var(--nys-color-transparent, #ffffff00) );--_nys-button-color--active: var( --nys-button-color--active, var(--nys-color-reverse-strongest, #ffffff) );--_nys-button-border-color--active: var( --nys-button-border-color--active, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--disabled: var( --nys-color-transparent, #ffffff00 );--_nys-button-color--disabled: var( --nys-color-text-reverse-disabled, #62666a );--_nys-button-border-color--disabled: var( --nys-color-transparent, #ffffff00 )}:host([variant=ghost][inverted]){--_nys-button-background-color: var( --nys-button-background-color, var(--nys-color-transparent, #ffffff00) );--_nys-button-color: var( --nys-button-color, var(--nys-color-text-reverse, #ffffff) );--_nys-button-border-color: var( --nys-button-border-color, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--hover: var( --nys-button-background-color--hover, var(--nys-color-white-transparent-100, #ffffff1a) );--_nys-button-color--hover: var( --nys-button-color--hover, var(--nys-color-text-reverse, #ffffff) );--_nys-button-border-color--hover: var( --nys-button-border-color--hover, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--active: var( --nys-button-background-color--active, var(--nys-color-white-transparent-200, #ffffff33) );--_nys-button-color--active: var( --nys-button-color--active, var(--nys-color-text-reverse, #ffffff) );--_nys-button-border-color--active: var( --nys-button-border-color--active, var(--nys-color-transparent, #ffffff00) );--_nys-button-background-color--disabled: var( --nys-color-transparent, #ffffff00 );--_nys-button-color--disabled: var(--nys-color-text-disabled, #62666a);--_nys-button-border-color--disabled: var( --nys-color-transparent, #ffffff00 )}:host([circle]){--_nys-button-width: var(--_nys-button-height);--_nys-button-border-radius--start: var(--nys-radius-round, 1776px);--_nys-button-border-radius--end: var(--nys-radius-round, 1776px);--_nys-button-padding--y: 0;--_nys-button-padding--x: 0}.nys-button{width:var(--_nys-button-width);min-height:var(--_nys-button-height);border-start-start-radius:var(--_nys-button-border-radius--start);border-end-start-radius:var(--_nys-button-border-radius--start);border-start-end-radius:var(--_nys-button-border-radius--end);border-end-end-radius:var(--_nys-button-border-radius--end);padding:var(--_nys-button-padding--y) var(--_nys-button-padding--x);display:flex;align-items:center;justify-content:center;gap:var(--_nys-button-gap);font-family:var(--_nys-button-font-family);font-size:var(--_nys-button-font-size);font-weight:var(--_nys-button-font-weight);line-height:var(--_nys-button-line-height);text-decoration:var(--_nys-button-text-decoration);box-sizing:border-box;background-color:var(--_nys-button-background-color);color:var(--_nys-button-color);border:solid var(--_nys-button-border-width) var(--_nys-button-border-color);cursor:var(--_nys-button-cursor, pointer)}:host([circle]) .nys-button{max-width:var(--_nys-button-height);max-height:var(--_nys-button-height)}.nys-button:hover{background-color:var(--_nys-button-background-color--hover);color:var(--_nys-button-color--hover);border-color:var(--_nys-button-border-color--hover)}.nys-button:active{background-color:var(--_nys-button-background-color--active);color:var(--_nys-button-color--active);border-color:var(--_nys-button-border-color--active)}.nys-button:disabled,a[disabled]{background-color:var(--_nys-button-background-color--disabled);color:var(--_nys-button-color--disabled);border-color:var(--_nys-button-border-color--disabled);cursor:not-allowed}.nys-button__linkwrapper:has([disabled]){cursor:not-allowed;width:fit-content}a[disabled]{pointer-events:none}a[disabled]:hover{background-color:var(--_nys-button-background-color--disabled);color:var(--_nys-button-color--disabled);border-color:var(--_nys-button-border-color--disabled)}.nys-button *{cursor:var(--_nys-button-cursor, pointer)}.nys-button:disabled *{cursor:not-allowed}.nys-button:focus-visible{outline-offset:var(--_nys-button-outline-offset);outline:solid var(--_nys-button-outline-width) var(--_nys-button-outline-color)}.nys-button__text{display:flex;align-items:center;-webkit-user-select:none;user-select:none}';
4
+ const v = ':host{--_nys-button-width: fit-content;--_nys-button-height: var(--nys-size-600, 48px);--_nys-button-border-radius--start: var(--nys-radius-xl, 12px);--_nys-button-border-radius--end: var(--nys-radius-xl, 12px);--_nys-button-padding--y: calc(var(--nys-space-150, 12px) - var(--nys-border-width-md, 2px));--_nys-button-padding--x: calc(var(--nys-space-250, 20px) - var(--nys-border-width-md, 2px));--_nys-button-gap: var(--nys-space-100, 8px);--_nys-button-justify-content: center;--_nys-button-border-width: var(--nys-border-width-md, 2px);--_nys-button-outline-width: var(--nys-border-width-md, 2px);--_nys-button-outline-offset: var(--nys-space-2px, 2px);--_nys-button-outline-color: var(--nys-color-focus, #004dd1);--_nys-button-background-color: var(--nys-button-background-color, var(--nys-color-theme, #154973));--_nys-button-color: var(--nys-button-color, var(--nys-color-text-reverse, #ffffff));--_nys-button-border-color: var(--nys-button-border-color, var(--nys-color-theme, #154973));--_nys-button-background-color--hover: var(--nys-button-background-color--hover, var(--nys-color-theme-strong, #0e324f));--_nys-button-color--hover: var(--nys-button-color--hover, var(--nys-color-text-reverse, #ffffff));--_nys-button-border-color--hover: var(--nys-button-border-color--hover, var(--nys-color-theme-strong, #0e324f));--_nys-button-background-color--active: var(--nys-button-background-color--active, var(--nys-color-theme-stronger, #081b2b));--_nys-button-color--active: var(--nys-button-color--active, var(--nys-color-text-reverse, #ffffff));--_nys-button-border-color--active: var(--nys-button-border-color--active, var(--nys-color-theme-stronger, #081b2b));--_nys-button-background-color--disabled: var(--nys-color-neutral-10, #f6f6f6);--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color--disabled: var(--nys-color-neutral-10, #f6f6f6);--_nys-button-font-size: var(--nys-font-size-ui-md, 16px);--_nys-button-font-weight: var(--nys-font-weight-semibold, 600);--_nys-button-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-button-font-family: var(--nys-font-family-ui, var(--nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif));display:inline-flex}:host([size=sm]){--_nys-button-height: var(--nys-size-500, 40px);--_nys-button-padding--y: calc(var(--nys-space-100, 8px) - var(--nys-border-width-md, 2px));--_nys-button-padding--x: calc(var(--nys-space-200, 16px) - var(--nys-border-width-md, 2px))}:host([size=md]){--_nys-button-height: var(--nys-size-600, 48px);--_nys-button-padding--y: calc(var(--nys-space-150, 12px) - var(--nys-border-width-md, 2px));--_nys-button-padding--x: calc(var(--nys-space-250, 20px) - var(--nys-border-width-md, 2px))}:host([size=lg]){--_nys-button-height: var(--nys-size-700, 56px);--_nys-button-padding--y: calc(var(--nys-space-200, 16px) - var(--nys-border-width-md, 2px));--_nys-button-padding--x: calc(var(--nys-space-300, 24px) - var(--nys-border-width-md, 2px))}:host([fullWidth]){width:100%}:host([fullWidth]) .nys-button{width:100%}:host([variant=filled]){--_nys-button-background-color: var(--nys-button-background-color, var(--nys-color-theme, #154973));--_nys-button-color: var(--nys-button-color, var(--nys-color-text-reverse, #ffffff));--_nys-button-background-color--hover: var(--nys-button-background-color--hover, var(--nys-color-theme-strong, #0e324f));--_nys-button-color--hover: var(--nys-button-color--hover, var(--nys-color-text-reverse, #ffffff));--_nys-button-background-color--active: var(--nys-button-background-color--active, var(--nys-color-theme-stronger, #081b2b));--_nys-button-color--active: var(--nys-button-color--active, var(--nys-color-text-reverse, #ffffff));--_nys-button-background-color--disabled: var(--nys-color-neutral-10, #f6f6f6);--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color: var(--nys-button-border-color, var(--nys-color-transparent, #ffffff00))}:host([variant=outline]){--_nys-button-background-color: var(--nys-button-background-color, var(--nys-color-surface, #ffffff));--_nys-button-color: var(--nys-button-color, var(--nys-color-theme, #154973));--_nys-button-border-color: var(--nys-button-border-color, var(--nys-color-theme, #154973));--_nys-button-background-color--hover: var(--nys-button-background-color--hover, var(--nys-color-theme-weaker, #eff6fb));--_nys-button-color--hover: var(--nys-button-color--hover, var(--nys-color-theme, #154973));--_nys-button-border-color--hover: var(--nys-button-border-color--hover, var(--nys-color-theme, #154973));--_nys-button-background-color--active: var(--nys-button-background-color--active, var(--nys-color-theme-weak, #cddde9));--_nys-button-color--active: var(--nys-button-color--active, var(--nys-color-theme, #154973));--_nys-button-border-color--active: var(--nys-button-border-color--active, var(--nys-color-theme, #154973));--_nys-button-background-color--disabled: var(--nys-color-surface, #ffffff);--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color--disabled: var(--nys-color-neutral-100, #d0d0ce)}:host([variant=text]){--_nys-button-height: fit-content;--_nys-button-border-radius--start: var(--nys-radius-md, 4px);--_nys-button-border-radius--end: var(--nys-radius-md, 4px);--_nys-button-padding--y: var(--nys-space-2px, 2px);--_nys-button-padding--x: var(--nys-space-50, 4px);--_nys-button-border-width: 0px;--_nys-button-text-decoration: underline;--_nys-button-background-color: var(--nys-button-background-color, var(--nys-color-transparent, #ffffff00));--_nys-button-color: var(--nys-button-color, var(--nys-color-link, #004dd1));--_nys-button-border-color: var(--nys-button-border-color, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--hover: var(--nys-button-background-color--hover, var(--nys-color-transparent, #ffffff00));--_nys-button-color--hover: var(--nys-button-color--hover, var(--nys-color-link-strong, #003ba1));--_nys-button-border-color--hover: var(--nys-button-border-color--hover, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--active: var(--nys-button-background-color--active, var(--nys-color-transparent, #ffffff00));--_nys-button-color--active: var(--nys-button-color--active, var(--nys-color-link-strongest, #002971));--_nys-button-border-color--active: var(--nys-button-border-color--active, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--disabled: var(--nys-color-transparent, #ffffff00);--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color--disabled: var(--nys-color-transparent, #ffffff00)}:host([variant=ghost]){--_nys-button-background-color: var(--nys-button-background-color, var(--nys-color-transparent, #ffffff00));--_nys-button-color: var(--nys-button-color, var(--nys-color-text, #1b1b1b));--_nys-button-border-color: var(--nys-button-border-color, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--hover: var(--nys-button-background-color--hover, var(--nys-color-black-transparent-100, #0000001a));--_nys-button-color--hover: var(--nys-button-color--hover, var(--nys-color-text, #1b1b1b));--_nys-button-border-color--hover: var(--nys-button-border-color--hover, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--active: var(--nys-button-background-color--active, var(--nys-color-black-transparent-200, #00000033));--_nys-button-color--active: var(--nys-button-color--active, var(--nys-color-text, #1b1b1b));--_nys-button-border-color--active: var(--nys-button-border-color--active, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--disabled: var(--nys-color-transparent, #ffffff00);--_nys-button-color--disabled: var(--nys-color-text-disabled, #bec0c1);--_nys-button-border-color--disabled: var(--nys-color-transparent, #ffffff00)}:host([variant=filled][inverted]){--_nys-button-background-color: var(--nys-button-background-color, var(--nys-color-surface, #ffffff));--_nys-button-color: var(--nys-button-color, var(--nys-color-text, #1b1b1b));--_nys-button-background-color--hover: var(--nys-button-background-color--hover, var(--nys-color-neutral-100, #d0d0ce));--_nys-button-color--hover: var(--nys-button-color--hover, var(--nys-color-text, #1b1b1b));--_nys-button-background-color--active: var(--nys-button-background-color--active, var(--nys-color-neutral-300, #a7a9ab));--_nys-button-color--active: var(--nys-button-color--active, var(--nys-color-text, #1b1b1b));--_nys-button-background-color--disabled: var(--nys-color-text, #1b1b1b);--_nys-button-color--disabled: var(--nys-color-text-disabled, #62666a);--_nys-button-border-color--disabled: var(--nys-color-transparent, #ffffff00)}:host([variant=outline][inverted]){--_nys-button-background-color: var(--nys-button-background-color, var(--nys-color-surface-reverse, #1b1b1b));--_nys-button-color: var(--nys-button-color, var(--nys-color-text-reverse, #ffffff));--_nys-button-border-color: var(--nys-button-border-color, var(--nys-color-ink-reverse, #ffffff));--_nys-button-background-color--hover: var(--nys-button-background-color--hover, var(--nys-color-surface-reverse, #1b1b1b));--_nys-button-color--hover: var(--nys-button-color--hover, var(--nys-color-text-reverse-weak, #d0d0ce));--_nys-button-border-color--hover: var(--nys-button-border-color--hover, var(--nys-color-neutral-100, #d0d0ce));--_nys-button-background-color--active: var(--nys-button-background-color--active, var(--nys-color-surface-reverse, #1b1b1b));--_nys-button-color--active: var(--nys-button-color--active, var(--nys-color-text-reverse-weaker, #bec0c1));--_nys-button-border-color--active: var(--nys-button-border-color--active, var(--nys-color-neutral-300, #a7a9ab));--_nys-button-background-color--disabled: var(--nys-color-surface-reverse, #1b1b1b);--_nys-button-color--disabled: var(--nys-color-text-reverse-disabled, #62666a);--_nys-button-border-color--disabled: var(--nys-color-neutral-600, #62666a)}:host([variant=text][inverted]){--_nys-button-height: fit-content;--_nys-button-border-radius--start: var(--nys-radius-md, 4px);--_nys-button-border-radius--end: var(--nys-radius-md, 4px);--_nys-button-padding--y: var(--nys-space-2px, 2px);--_nys-button-padding--x: var(--nys-space-50, 4px);--_nys-button-border-width: 0px;--_nys-button-text-decoration: underline;--_nys-button-background-color: var(--nys-button-background-color, var(--nys-color-transparent, #ffffff00));--_nys-button-color: var(--nys-button-color, var(--nys-color-link-reverse, #a7a9ab));--_nys-button-border-color: var(--nys-button-border-color, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--hover: var(--nys-button-background-color--hover, var(--nys-color-transparent, #ffffff00));--_nys-button-color--hover: var(--nys-button-color--hover, var(--nys-color-link-reverse-strong, #ededed));--_nys-button-border-color--hover: var(--nys-button-border-color--hover, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--active: var(--nys-button-background-color--active, var(--nys-color-transparent, #ffffff00));--_nys-button-color--active: var(--nys-button-color--active, var(--nys-color-reverse-strongest, #ffffff));--_nys-button-border-color--active: var(--nys-button-border-color--active, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--disabled: var(--nys-color-transparent, #ffffff00);--_nys-button-color--disabled: var(--nys-color-text-reverse-disabled, #62666a);--_nys-button-border-color--disabled: var(--nys-color-transparent, #ffffff00)}:host([variant=ghost][inverted]){--_nys-button-background-color: var(--nys-button-background-color, var(--nys-color-transparent, #ffffff00));--_nys-button-color: var(--nys-button-color, var(--nys-color-text-reverse, #ffffff));--_nys-button-border-color: var(--nys-button-border-color, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--hover: var(--nys-button-background-color--hover, var(--nys-color-white-transparent-100, #ffffff1a));--_nys-button-color--hover: var(--nys-button-color--hover, var(--nys-color-text-reverse, #ffffff));--_nys-button-border-color--hover: var(--nys-button-border-color--hover, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--active: var(--nys-button-background-color--active, var(--nys-color-white-transparent-200, #ffffff33));--_nys-button-color--active: var(--nys-button-color--active, var(--nys-color-text-reverse, #ffffff));--_nys-button-border-color--active: var(--nys-button-border-color--active, var(--nys-color-transparent, #ffffff00));--_nys-button-background-color--disabled: var(--nys-color-transparent, #ffffff00);--_nys-button-color--disabled: var(--nys-color-text-disabled, #62666a);--_nys-button-border-color--disabled: var(--nys-color-transparent, #ffffff00)}:host([circle]){--_nys-button-width: var(--_nys-button-height);--_nys-button-border-radius--start: var(--nys-radius-round, 1776px);--_nys-button-border-radius--end: var(--nys-radius-round, 1776px);--_nys-button-padding--y: 0;--_nys-button-padding--x: 0}.nys-button{width:var(--_nys-button-width);min-height:var(--_nys-button-height);border-start-start-radius:var(--_nys-button-border-radius--start);border-end-start-radius:var(--_nys-button-border-radius--start);border-start-end-radius:var(--_nys-button-border-radius--end);border-end-end-radius:var(--_nys-button-border-radius--end);padding:var(--_nys-button-padding--y) var(--_nys-button-padding--x);display:flex;align-items:center;justify-content:var(--_nys-button-justify-content);gap:var(--_nys-button-gap);font-family:var(--_nys-button-font-family);font-size:var(--_nys-button-font-size);font-weight:var(--_nys-button-font-weight);line-height:var(--_nys-button-line-height);text-decoration:var(--_nys-button-text-decoration);box-sizing:border-box;background-color:var(--_nys-button-background-color);color:var(--_nys-button-color);border:solid var(--_nys-button-border-width) var(--_nys-button-border-color);cursor:var(--_nys-button-cursor, pointer)}:host([circle]) .nys-button{max-width:var(--_nys-button-height);max-height:var(--_nys-button-height)}.nys-button:hover{background-color:var(--_nys-button-background-color--hover);color:var(--_nys-button-color--hover);border-color:var(--_nys-button-border-color--hover)}.nys-button:active{background-color:var(--_nys-button-background-color--active);color:var(--_nys-button-color--active);border-color:var(--_nys-button-border-color--active)}.nys-button:disabled,a[disabled]{background-color:var(--_nys-button-background-color--disabled);color:var(--_nys-button-color--disabled);border-color:var(--_nys-button-border-color--disabled);cursor:not-allowed}.nys-button__linkwrapper:has([disabled]){cursor:not-allowed;width:fit-content}a[disabled]{pointer-events:none}a[disabled]:hover{background-color:var(--_nys-button-background-color--disabled);color:var(--_nys-button-color--disabled);border-color:var(--_nys-button-border-color--disabled)}.nys-button *{cursor:var(--_nys-button-cursor, pointer)}.nys-button:disabled *{cursor:not-allowed}.nys-button:focus-visible{outline-offset:var(--_nys-button-outline-offset);outline:solid var(--_nys-button-outline-width) var(--_nys-button-outline-color)}.nys-button__text{display:flex;align-items:center;-webkit-user-select:none;user-select:none}';
5
5
  var f = Object.defineProperty, n = (b, o, e, p) => {
6
6
  for (var c = void 0, i = b.length - 1, u; i >= 0; i--)
7
7
  (u = b[i]) && (c = u(o, e, c) || c);
@@ -23,7 +23,10 @@ const l = class l extends y {
23
23
  connectedCallback() {
24
24
  super.connectedCallback(), this.id || (this.id = this._generateUniqueId());
25
25
  }
26
- // Functions
26
+ /**
27
+ * Functions
28
+ * --------------------------------------------------------------------------
29
+ */
27
30
  _generateUniqueId() {
28
31
  return `nys-button-${Date.now()}-${h++}`;
29
32
  }
@@ -40,12 +43,13 @@ const l = class l extends y {
40
43
  break;
41
44
  }
42
45
  }
43
- // Event Handlers
44
- // Handle focus event
46
+ /**
47
+ * Event Handlers
48
+ * --------------------------------------------------------------------------
49
+ */
45
50
  _handleFocus() {
46
51
  this.dispatchEvent(new Event("nys-focus"));
47
52
  }
48
- // Handle blur event
49
53
  _handleBlur() {
50
54
  this.shadowRoot?.querySelector(".nys-button")?.classList.remove("active-focus"), this.dispatchEvent(new Event("nys-blur"));
51
55
  }
@@ -56,7 +60,6 @@ const l = class l extends y {
56
60
  }
57
61
  this._manageFormAction(), this.dispatchEvent(new Event("nys-click"));
58
62
  }
59
- // Handle keydown for keyboard accessibility
60
63
  _handleKeydown(o) {
61
64
  if (o.code === "Space" || o.code === "Enter" || o.key === " " || o.key === "Enter") {
62
65
  if (this.disabled) return;
package/dist/nys-button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"nys-button.js","sources":["../src/nys-button.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-button.scss?inline\";\n\nlet buttonIdCounter = 0; // Counter for generating unique IDs\n\nexport class NysButton extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\";\n @property({ type: String, reflect: true }) size: \"sm\" | \"md\" | \"lg\" = \"md\";\n @property({ type: Boolean, reflect: true }) fullWidth = false;\n @property({ type: String, reflect: true }) variant:\n | \"filled\"\n | \"outline\"\n | \"ghost\"\n | \"text\" = \"filled\";\n @property({ type: Boolean, reflect: true }) inverted = false; //used on dark text\n @property({ type: String }) label = \"\";\n @property({ type: String }) ariaLabel = \"\";\n @property({ type: String }) ariaControls = \"\";\n @property({ type: String }) prefixIcon = \"\";\n @property({ type: String }) suffixIcon = \"\";\n @property({ type: Boolean, reflect: true }) circle = false;\n @property({ type: String }) icon = \"\";\n @property({ type: Boolean, reflect: true }) disabled = false;\n @property({ type: String, reflect: true }) form: string | null = null;\n @property({ type: String }) value = \"\";\n @property({ type: String }) ariaDescription = \"\";\n @property({ type: String, reflect: true }) type:\n | \"submit\"\n | \"reset\"\n | \"button\" = \"button\";\n @property({ attribute: false }) onClick: ((event: Event) => void) | null =\n null;\n @property({ type: String }) href = \"\";\n @property({ type: String, reflect: true }) target:\n | \"_self\"\n | \"_blank\"\n | \"_parent\"\n | \"_top\"\n | \"framename\" = \"_self\";\n\n public async getButtonElement(): Promise<HTMLElement | null> {\n await this.updateComplete; // Wait for the component to finish rendering\n\n // if it's a link button\n const linkEl =\n this.shadowRoot?.querySelector<HTMLAnchorElement>(\"a.nys-button\") || null;\n if (linkEl) return linkEl;\n\n // Otherwise return the native button\n const btnEl =\n this.shadowRoot?.querySelector<HTMLButtonElement>(\"button.nys-button\") ||\n null;\n if (btnEl) return btnEl;\n\n return null;\n }\n\n private _internals: ElementInternals;\n\n // Lifecycle Methods\n static formAssociated = true; // allows use of elementInternals' API\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n // Generate a unique ID if not provided\n if (!this.id) {\n this.id = this._generateUniqueId();\n }\n }\n\n // Functions\n private _generateUniqueId() {\n return `nys-button-${Date.now()}-${buttonIdCounter++}`;\n }\n\n private _manageFormAction() {\n // If an onClick function is provided, call it\n if (typeof this.onClick === \"function\" && this.onClick !== null) {\n this.onClick(new Event(\"click\")); // Call user-provided onClick function with a fake click event\n }\n\n // If part of a form, perform the corresponding action based on button's \"type\"\n const form = this._internals.form;\n\n if (form) {\n switch (this.type) {\n case \"submit\":\n form.requestSubmit();\n break;\n case \"reset\":\n form.reset();\n break;\n case \"button\":\n }\n }\n }\n\n // Event Handlers\n // Handle focus event\n private _handleFocus() {\n this.dispatchEvent(new Event(\"nys-focus\"));\n }\n\n // Handle blur event\n private _handleBlur() {\n const button = this.shadowRoot?.querySelector(\".nys-button\");\n button?.classList.remove(\"active-focus\");\n this.dispatchEvent(new Event(\"nys-blur\"));\n }\n\n private _handleClick(event: Event) {\n if (this.disabled) {\n event.preventDefault();\n return;\n }\n this._manageFormAction();\n this.dispatchEvent(new Event(\"nys-click\"));\n }\n\n // Handle keydown for keyboard accessibility\n private _handleKeydown(e: KeyboardEvent) {\n if (\n e.code === \"Space\" ||\n e.code === \"Enter\" ||\n e.key === \" \" ||\n e.key === \"Enter\"\n ) {\n if (this.disabled) return;\n\n e.preventDefault();\n\n if (this.href) {\n // Click the internal <a> so native navigation happens\n const linkEl = this.renderRoot.querySelector(\n \"a.nys-button\",\n ) as HTMLAnchorElement;\n if (linkEl) {\n linkEl.click();\n }\n } else {\n this._handleAnyAttributeFunction();\n this._handleClick(e);\n }\n }\n }\n\n /**\n * Vanilla JS & Native HTML keydown solution:\n * The <nys-button onClick=\"doFunction();\"></nys-button> onClick is an attribute here.\n * Thus, we call it here. Otherwise, at this point, this.onClick is null as it isn't props, but a string attribute\n * In vanilla HTML/JS, clicking with execute the attribute function, BUT now with keydown, hence this solution.\n */\n private _handleAnyAttributeFunction() {\n const onClickAttr = this.getAttribute(\"onClick\");\n if (onClickAttr) {\n const callFunc = new Function(\"return \" + onClickAttr);\n callFunc();\n }\n }\n\n // Public Methods\n public focus(options?: FocusOptions) {\n const innerEl = this.renderRoot.querySelector(\n this.href ? \"a.nys-button\" : \"button.nys-button\",\n ) as HTMLElement | null;\n\n if (innerEl) {\n innerEl.focus(options);\n } else {\n // fallback: focus host\n super.focus(options);\n }\n }\n\n render() {\n return html`\n ${this.href\n ? html`\n <div class=\"nys-button__linkwrapper\">\n <a\n class=\"nys-button\"\n name=${ifDefined(this.name ? this.name : undefined)}\n ?disabled=${this.disabled}\n aria-disabled=\"${this.disabled ? \"true\" : \"false\"}\"\n value=${ifDefined(this.value ? this.value : undefined)}\n href=${this.href}\n target=${this.target}\n @click=${this._handleClick}\n @focus=\"${this._handleFocus}\"\n @blur=\"${this._handleBlur}\"\n @keydown=\"${this._handleKeydown}\"\n tabindex=\"${this.disabled ? -1 : 0}\"\n aria-label=${ifDefined(\n this.ariaLabel ||\n this.label ||\n (this.circle ? this.icon : null) ||\n \"button\",\n )}\n aria-description=${ifDefined(this.ariaDescription || undefined)}\n >\n ${this.prefixIcon && this.variant !== \"text\"\n ? html`<slot name=\"prefix-icon\">\n <nys-icon size=\"16\" name=${this.prefixIcon}></nys-icon>\n </slot>`\n : \"\"}\n ${this.label && !this.circle\n ? html`<div class=\"nys-button__text\">${this.label}</div>`\n : \"\"}\n ${this.suffixIcon && this.variant !== \"text\"\n ? html`<slot name=\"suffix-icon\">\n <nys-icon size=\"16\" name=${this.suffixIcon}></nys-icon>\n </slot>`\n : \"\"}\n ${this.circle && this.icon\n ? html`<slot name=\"circle-icon\"\n ><nys-icon\n size=${this.size === \"sm\"\n ? \"24\"\n : this.size === \"lg\"\n ? \"40\"\n : \"32\"}\n name=${this.icon}\n ></nys-icon\n ></slot>`\n : \"\"}\n </a>\n </div>\n `\n : html`\n <button\n class=\"nys-button\"\n name=${ifDefined(this.name ? this.name : undefined)}\n ?disabled=${this.disabled}\n form=${ifDefined(this.form || undefined)}\n value=${ifDefined(this.value ? this.value : undefined)}\n type=${this.type}\n aria-controls=${ifDefined(this.ariaControls || undefined)}\n @click=${this._handleClick}\n @focus=\"${this._handleFocus}\"\n @blur=\"${this._handleBlur}\"\n @keydown=\"${this._handleKeydown}\"\n tabindex=\"${this.disabled ? -1 : 0}\"\n aria-label=${ifDefined(\n this.ariaLabel ||\n this.label ||\n (this.circle ? this.icon : null) ||\n this.prefixIcon ||\n this.suffixIcon ||\n \"button\",\n )}\n aria-description=${ifDefined(this.ariaDescription || undefined)}\n role=\"button\"\n >\n ${this.prefixIcon && this.variant !== \"text\"\n ? html`<slot name=\"prefix-icon\">\n <nys-icon size=\"16\" name=${this.prefixIcon}></nys-icon>\n </slot>`\n : \"\"}\n ${this.label && !this.circle\n ? html`<div class=\"nys-button__text\">${this.label}</div>`\n : \"\"}\n ${this.suffixIcon && this.variant !== \"text\"\n ? html`<slot name=\"suffix-icon\">\n <nys-icon size=\"16\" name=${this.suffixIcon}></nys-icon>\n </slot>`\n : \"\"}\n ${this.circle && this.icon\n ? html`<slot name=\"circle-icon\">\n <nys-icon\n size=${this.size === \"sm\"\n ? \"24\"\n : this.size === \"lg\"\n ? \"40\"\n : \"32\"}\n name=${this.icon}\n ></nys-icon>\n </slot>`\n : \"\"}\n </button>\n `}\n `;\n }\n}\n\nif (!customElements.get(\"nys-button\")) {\n customElements.define(\"nys-button\", NysButton);\n}\n"],"names":["buttonIdCounter","_NysButton","LitElement","linkEl","btnEl","form","event","e","onClickAttr","options","innerEl","html","ifDefined","unsafeCSS","styles","NysButton","__decorateClass","property"],"mappings":"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"}
1
+ {"version":3,"file":"nys-button.js","sources":["../src/nys-button.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-button.scss?inline\";\n\nlet buttonIdCounter = 0;\n\n/**\n * A button for actions like saving, submitting, or navigating. Form-associated with full keyboard support.\n *\n * Use `filled` for primary actions (one per section), `outline` for secondary, `ghost` for tertiary,\n * `text` for inline. Set `href` to render as a navigation link.\n *\n * @summary Button for actions and CTAs with variants, sizes, and icon support.\n * @element nys-button\n *\n * @slot prefix-icon - Icon before label. Not shown for `text` variant.\n * @slot suffix-icon - Icon after label. Not shown for `text` variant.\n * @slot circle-icon - Icon for circle mode. Overrides `icon` prop.\n *\n * @cssprop [--nys-button-color] - Text color of the button label.\n * @cssprop [--nys-button-color--hover] - Text color when hovered.\n * @cssprop [--nys-button-color--active] - Text color when active/pressed.\n * @cssprop [--nys-button-background-color] - Background color of the button.\n * @cssprop [--nys-button-background-color--hover] - Background color when hovered.\n * @cssprop [--nys-button-background-color--active] - Background color when active/pressed.\n * @cssprop [--nys-button-border-color] - Border color of the button.\n * @cssprop [--nys-button-border-color--hover] - Border color when hovered.\n * @cssprop [--nys-button-border-color--active] - Border color when active/pressed.\n *\n * @fires nys-click - Fired when the button is clicked (mouse or keyboard). Not fired when disabled.\n * @fires nys-focus - Fired when the button receives focus.\n * @fires nys-blur - Fired when the button loses focus.\n *\n * @example Basic filled button\n * ```html\n * <nys-button label=\"Submit\" variant=\"filled\"></nys-button>\n * ```\n *\n * @example Secondary outline button\n * ```html\n * <nys-button label=\"Cancel\" variant=\"outline\"></nys-button>\n * ```\n *\n * @example Button with icons\n * ```html\n * <nys-button label=\"Previous\" prefixIcon=\"chevron_left\"></nys-button>\n * <nys-button label=\"Next\" suffixIcon=\"chevron_right\"></nys-button>\n * ```\n *\n * @example Circle icon button\n * ```html\n * <nys-button circle icon=\"close\" label=\"Close dialog\"></nys-button>\n * ```\n *\n * @example Link-style button for navigation\n * ```html\n * <nys-button label=\"Visit NY.gov\" href=\"https://www.ny.gov/\" target=\"_blank\" suffixIcon=\"open_in_new\"></nys-button>\n * ```\n *\n * @example Form submit button\n * ```html\n * <nys-button type=\"submit\" label=\"Save Changes\" variant=\"filled\"></nys-button>\n * ```\n */\n\nexport class NysButton extends LitElement {\n static styles = unsafeCSS(styles);\n\n /**\n * Unique identifier. Auto-generated if not provided.\n */\n @property({ type: String, reflect: true }) id = \"\";\n\n /**\n * Name for form submission.\n */\n @property({ type: String, reflect: true }) name = \"\";\n\n /**\n * Button height: `sm` (40px) for dense UIs, `md` (48px, default) for standard use, `lg` (56px) for prominent CTAs.\n * @default \"md\"\n */\n @property({ type: String, reflect: true }) size: \"sm\" | \"md\" | \"lg\" = \"md\";\n\n /**\n * Expands button to fill container width. Use for mobile layouts or stacked button groups.\n * @default false\n */\n @property({ type: Boolean, reflect: true }) fullWidth = false;\n\n /**\n * Visual style: `filled` for primary (one per section), `outline` for secondary, `ghost` for tertiary, `text` for inline actions. Avoid `text` for navigation.\n * @default \"filled\"\n */\n @property({ type: String, reflect: true }) variant:\n | \"filled\"\n | \"outline\"\n | \"ghost\"\n | \"text\" = \"filled\";\n\n /**\n * Adjusts colors for dark backgrounds.\n * @default false\n */\n @property({ type: Boolean, reflect: true }) inverted = false;\n\n /**\n * Visible button text. Use sentence case, action-oriented text (e.g., \"Save Draft\"). Becomes aria-label in `circle` mode.\n */\n @property({ type: String }) label = \"\";\n\n /**\n * Screen reader label. Required for icon-only buttons if `label` is not set.\n */\n @property({ type: String }) ariaLabel = \"\";\n\n /**\n * ID of controlled element (e.g., dropdown or modal). Sets `aria-controls`.\n */\n @property({ type: String }) ariaControls = \"\";\n\n /**\n * Material Symbol icon before label. Not shown for `text` variant or `circle` mode.\n */\n @property({ type: String }) prefixIcon = \"\";\n\n /**\n * Material Symbol icon after label. Use `chevron_down` for dropdowns, `open_in_new` for external links. Not shown for `text` variant or `circle` mode.\n */\n @property({ type: String }) suffixIcon = \"\";\n\n /**\n * Renders circular icon-only button. Requires `icon` prop. `label` becomes aria-label.\n * @default false\n */\n @property({ type: Boolean, reflect: true }) circle = false;\n\n /**\n * Icon for circle mode. Required when `circle` is true. Scales with size (sm=24px, md=32px, lg=40px).\n */\n @property({ type: String }) icon = \"\";\n\n /**\n * Prevents interaction. Avoid disabling without explanation—show validation errors instead.\n * @default false\n */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /**\n * Form `id` to associate with. Use when button is outside the form element.\n */\n @property({ type: String, reflect: true }) form: string | null = null;\n\n /**\n * Value submitted with form data. Only used when `type=\"submit\"`.\n */\n @property({ type: String }) value = \"\";\n\n /**\n * Additional screen reader description. Sets `aria-description`.\n */\n @property({ type: String }) ariaDescription = \"\";\n\n /**\n * Form behavior: `button` (default, no form action), `submit` (submits form), `reset` (resets form). Always set explicitly to avoid unintended submissions.\n * @default \"button\"\n */\n @property({ type: String, reflect: true }) type:\n | \"submit\"\n | \"reset\"\n | \"button\" = \"button\";\n\n /**\n * Click handler. Use instead of `@click` to ensure keyboard accessibility.\n */\n @property({ attribute: false }) onClick: ((event: Event) => void) | null =\n null;\n\n /**\n * URL to navigate to. Renders as `<a>` tag. Omit for action buttons.\n */\n @property({ type: String }) href = \"\";\n\n /**\n * Link target: `_self` (same tab), `_blank` (new tab—add `suffixIcon=\"open_in_new\"`), `_parent`, `_top`, or frame name.\n * @default \"_self\"\n */\n @property({ type: String, reflect: true }) target:\n | \"_self\"\n | \"_blank\"\n | \"_parent\"\n | \"_top\"\n | \"framename\" = \"_self\";\n\n public async getButtonElement(): Promise<HTMLElement | null> {\n await this.updateComplete; // Wait for the component to finish rendering\n\n // if it's a link button\n const linkEl =\n this.shadowRoot?.querySelector<HTMLAnchorElement>(\"a.nys-button\") || null;\n if (linkEl) return linkEl;\n\n // Otherwise return the native button\n const btnEl =\n this.shadowRoot?.querySelector<HTMLButtonElement>(\"button.nys-button\") ||\n null;\n if (btnEl) return btnEl;\n\n return null;\n }\n\n private _internals: ElementInternals;\n\n /**\n * Lifecycle methods\n * --------------------------------------------------------------------------\n */\n\n static formAssociated = true; // allows use of elementInternals' API\n\n constructor() {\n super();\n this._internals = this.attachInternals();\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n // Generate a unique ID if not provided\n if (!this.id) {\n this.id = this._generateUniqueId();\n }\n }\n\n /**\n * Functions\n * --------------------------------------------------------------------------\n */\n\n private _generateUniqueId() {\n return `nys-button-${Date.now()}-${buttonIdCounter++}`;\n }\n\n private _manageFormAction() {\n // If an onClick function is provided, call it\n if (typeof this.onClick === \"function\" && this.onClick !== null) {\n this.onClick(new Event(\"click\")); // Call user-provided onClick function with a fake click event\n }\n\n // If part of a form, perform the corresponding action based on button's \"type\"\n const form = this._internals.form;\n\n if (form) {\n switch (this.type) {\n case \"submit\":\n form.requestSubmit();\n break;\n case \"reset\":\n form.reset();\n break;\n case \"button\":\n }\n }\n }\n\n /**\n * Event Handlers\n * --------------------------------------------------------------------------\n */\n\n private _handleFocus() {\n this.dispatchEvent(new Event(\"nys-focus\"));\n }\n\n private _handleBlur() {\n const button = this.shadowRoot?.querySelector(\".nys-button\");\n button?.classList.remove(\"active-focus\");\n this.dispatchEvent(new Event(\"nys-blur\"));\n }\n\n private _handleClick(event: Event) {\n if (this.disabled) {\n event.preventDefault();\n return;\n }\n this._manageFormAction();\n this.dispatchEvent(new Event(\"nys-click\"));\n }\n\n private _handleKeydown(e: KeyboardEvent) {\n if (\n e.code === \"Space\" ||\n e.code === \"Enter\" ||\n e.key === \" \" ||\n e.key === \"Enter\"\n ) {\n if (this.disabled) return;\n\n e.preventDefault();\n\n if (this.href) {\n // Click the internal <a> so native navigation happens\n const linkEl = this.renderRoot.querySelector(\n \"a.nys-button\",\n ) as HTMLAnchorElement;\n if (linkEl) {\n linkEl.click();\n }\n } else {\n this._handleAnyAttributeFunction();\n this._handleClick(e);\n }\n }\n }\n\n /**\n * Vanilla JS & Native HTML keydown solution:\n * The <nys-button onClick=\"doFunction();\"></nys-button> onClick is an attribute here.\n * Thus, we call it here. Otherwise, at this point, this.onClick is null as it isn't props, but a string attribute\n * In vanilla HTML/JS, clicking with execute the attribute function, BUT now with keydown, hence this solution.\n */\n private _handleAnyAttributeFunction() {\n const onClickAttr = this.getAttribute(\"onClick\");\n if (onClickAttr) {\n const callFunc = new Function(\"return \" + onClickAttr);\n callFunc();\n }\n }\n\n // Public Methods\n public focus(options?: FocusOptions) {\n const innerEl = this.renderRoot.querySelector(\n this.href ? \"a.nys-button\" : \"button.nys-button\",\n ) as HTMLElement | null;\n\n if (innerEl) {\n innerEl.focus(options);\n } else {\n // fallback: focus host\n super.focus(options);\n }\n }\n\n render() {\n return html`\n ${this.href\n ? html`\n <div class=\"nys-button__linkwrapper\">\n <a\n class=\"nys-button\"\n name=${ifDefined(this.name ? this.name : undefined)}\n ?disabled=${this.disabled}\n aria-disabled=\"${this.disabled ? \"true\" : \"false\"}\"\n value=${ifDefined(this.value ? this.value : undefined)}\n href=${this.href}\n target=${this.target}\n @click=${this._handleClick}\n @focus=\"${this._handleFocus}\"\n @blur=\"${this._handleBlur}\"\n @keydown=\"${this._handleKeydown}\"\n tabindex=\"${this.disabled ? -1 : 0}\"\n aria-label=${ifDefined(\n this.ariaLabel ||\n this.label ||\n (this.circle ? this.icon : null) ||\n \"button\",\n )}\n aria-description=${ifDefined(this.ariaDescription || undefined)}\n >\n ${this.prefixIcon && this.variant !== \"text\"\n ? html`<slot name=\"prefix-icon\">\n <nys-icon size=\"16\" name=${this.prefixIcon}></nys-icon>\n </slot>`\n : \"\"}\n ${this.label && !this.circle\n ? html`<div class=\"nys-button__text\">${this.label}</div>`\n : \"\"}\n ${this.suffixIcon && this.variant !== \"text\"\n ? html`<slot name=\"suffix-icon\">\n <nys-icon size=\"16\" name=${this.suffixIcon}></nys-icon>\n </slot>`\n : \"\"}\n ${this.circle && this.icon\n ? html`<slot name=\"circle-icon\"\n ><nys-icon\n size=${this.size === \"sm\"\n ? \"24\"\n : this.size === \"lg\"\n ? \"40\"\n : \"32\"}\n name=${this.icon}\n ></nys-icon\n ></slot>`\n : \"\"}\n </a>\n </div>\n `\n : html`\n <button\n class=\"nys-button\"\n name=${ifDefined(this.name ? this.name : undefined)}\n ?disabled=${this.disabled}\n form=${ifDefined(this.form || undefined)}\n value=${ifDefined(this.value ? this.value : undefined)}\n type=${this.type}\n aria-controls=${ifDefined(this.ariaControls || undefined)}\n @click=${this._handleClick}\n @focus=\"${this._handleFocus}\"\n @blur=\"${this._handleBlur}\"\n @keydown=\"${this._handleKeydown}\"\n tabindex=\"${this.disabled ? -1 : 0}\"\n aria-label=${ifDefined(\n this.ariaLabel ||\n this.label ||\n (this.circle ? this.icon : null) ||\n this.prefixIcon ||\n this.suffixIcon ||\n \"button\",\n )}\n aria-description=${ifDefined(this.ariaDescription || undefined)}\n role=\"button\"\n >\n ${this.prefixIcon && this.variant !== \"text\"\n ? html`<slot name=\"prefix-icon\">\n <nys-icon size=\"16\" name=${this.prefixIcon}></nys-icon>\n </slot>`\n : \"\"}\n ${this.label && !this.circle\n ? html`<div class=\"nys-button__text\">${this.label}</div>`\n : \"\"}\n ${this.suffixIcon && this.variant !== \"text\"\n ? html`<slot name=\"suffix-icon\">\n <nys-icon size=\"16\" name=${this.suffixIcon}></nys-icon>\n </slot>`\n : \"\"}\n ${this.circle && this.icon\n ? html`<slot name=\"circle-icon\">\n <nys-icon\n size=${this.size === \"sm\"\n ? \"24\"\n : this.size === \"lg\"\n ? \"40\"\n : \"32\"}\n name=${this.icon}\n ></nys-icon>\n </slot>`\n : \"\"}\n </button>\n `}\n `;\n }\n}\n\nif (!customElements.get(\"nys-button\")) {\n customElements.define(\"nys-button\", NysButton);\n}\n"],"names":["buttonIdCounter","_NysButton","LitElement","linkEl","btnEl","form","event","e","onClickAttr","options","innerEl","html","ifDefined","unsafeCSS","styles","NysButton","__decorateClass","property"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nysds/nys-button",
3
- "version": "1.12.0",
3
+ "version": "1.13.1",
4
4
  "description": "The Button component from the NYS Design System.",
5
5
  "module": "dist/nys-button.js",
6
6
  "types": "dist/index.d.ts",
@@ -23,7 +23,7 @@
23
23
  "lit-analyze": "lit-analyzer '**/*.ts'"
24
24
  },
25
25
  "dependencies": {
26
- "@nysds/nys-icon": "^1.12.0"
26
+ "@nysds/nys-icon": "^1.13.1"
27
27
  },
28
28
  "devDependencies": {
29
29
  "lit": "^3.3.1",