@pine-ds/core 0.2.4 → 1.0.0

package/dist/pine-core/p-ff9044ed.entry.js

@@ -0,0 +1,2 @@
+import{r as a,c as t,h as e,H as i,g as o}from"./p-2f77dbd3.js";const r='pds-tab{--border-none:var(--pine-border-width-none);--border-radius-availability:var(--pine-border-radius-100);--border-radius-default:var(--pine-border-radius-125);--border-radius-none:var(--pine-border-radius-0);--box-shadow-focus:0 0 0 2px var(--pine-color-blue-200);--color-background-active:var(--pine-color-charcoal-400);--color-background-availability:var(--pine-color-white);--color-background-default:var(--pine-color-grey-300);--color-background-hover:var(--pine-color-grey-400);--color-text-active:var(--pine-color-charcoal-400);--color-text-active-inverse:var(--pine-color-white);--color-text-default:var(--pine-color-charcoal-200);--color-text-focus:var(--pine-color-charcoal-300);--font-size-availability-content:var(--pine-font-size-075);--font-size-default:var(--pine-font-size-100);--font-size-filter-content:var(--pine-font-size-087);--font-weight-default:var(--pine-font-weight-medium);--line-height-availability-content:var(--pine-line-height-100);--line-height-default:var(--pine-line-height-150);--line-height-filter-content:var(--pine-line-height-125);--outline:4px solid var(--pine-color-blue-200);--spacing-padding-none:var(--pine-spacing-0);display:inline-block;position:relative}.pds-tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:var(--border-none);-webkit-box-shadow:none;box-shadow:none;color:inherit;cursor:pointer;font-family:inherit;padding:var(--spacing-padding-none);-ms-flex-align:center;align-items:center;color:var(--color-text-default);display:-ms-inline-flexbox;display:inline-flex;position:relative;text-decoration:none;white-space:nowrap}.pds-tab.is-active,.pds-tab[aria-selected=true]{color:var(--color-text-active)}.pds-tab.is-active .pds-tab__content::after,.pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tab:hover{color:var(--color-text-active)}.pds-tab:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-tab .pds-tab__content{font-family:inherit;font-size:var(--font-size-default);font-weight:var(--font-weight-default);line-height:var(--line-height-default);-webkit-padding-after:11px;padding-block-end:11px;position:relative}.pds-tab .pds-tab__content::after{background-color:currentColor;bottom:0;content:"";height:3px;left:0;opacity:0;position:absolute;right:0}.pds-tab .pds-tab-edge{display:none}.pds-tabs--availability{--color-background-tab:transparent}.pds-tabs--availability .pds-tab{background-color:var(--color-background-tab);border-radius:var(--border-radius-availability) var(--border-radius-availability) var(--border-radius-none) var(--border-radius-none);padding:8px 16px 13px}.pds-tabs--availability .pds-tab.is-active,.pds-tabs--availability .pds-tab[aria-selected=true]{--color-background-tab:var(--color-background-availability)}.pds-tabs--availability .pds-tab.is-active .pds-tab__content::after,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab__content::after{opacity:1}.pds-tabs--availability .pds-tab.is-active .pds-tab-edge,.pds-tabs--availability .pds-tab[aria-selected=true] .pds-tab-edge{z-index:1}.pds-tabs--availability .pds-tab:hover:not(.is-active,[aria-selected=true]){--color-background-tab:var(--color-background-default)}.pds-tabs--availability .pds-tab:focus-visible{color:var(--color-text-default)}.pds-tabs--availability .pds-tab__content{font-size:var(--font-size-availability-content);line-height:var(--line-height-availability-content);padding-bottom:7px}.pds-tabs--availability .pds-tab-edge{bottom:0;display:block;height:8px;inset-inline-end:100%;overflow:hidden;position:absolute;width:8px}.pds-tabs--availability .pds-tab-edge::before{border-radius:50%;bottom:0;-webkit-box-shadow:4px 4px 0 0 var(--color-background-tab);box-shadow:4px 4px 0 0 var(--color-background-tab);content:"";display:block;height:200%;inset-inline-end:0;position:absolute;width:200%}.pds-tabs--availability .pds-tab-edge--end{inset-inline-end:unset;inset-inline-start:100%}.pds-tabs--availability .pds-tab-edge--end::before{-webkit-box-shadow:-4px 4px 0 0 var(--color-background-tab);box-shadow:-4px 4px 0 0 var(--color-background-tab);inset-inline-end:unset;inset-inline-start:0}.pds-tabs--filter{--color-background-tab:var(--color-background-active)}.pds-tabs--filter .pds-tab{background-color:var(--color-background-tab);border-radius:50px;color:var(--color-text-active);padding:6px 15px}.pds-tabs--filter .pds-tab.is-active,.pds-tabs--filter .pds-tab[aria-selected=true]{--color-background-tab:var(--color-background-active);color:var(--color-text-active-inverse)}.pds-tabs--filter .pds-tab:hover:not(.is-active,[aria-selected=true]){--color-background-tab:var(--color-background-hover)}.pds-tabs--filter .pds-tab__content{font-size:var(--font-size-filter-content);line-height:var(--line-height-filter-content);-webkit-padding-after:0;padding-block-end:0}.pds-tabs--filter .pds-tab__content::after{content:unset}';const n=r;const s=class{constructor(e){a(this,e);this.pdsTabClick=t(this,"pdsTabClick",7);this.name=undefined;this.parentComponentId=undefined;this.variant=undefined;this.index=undefined;this.selected=false}onTabClick(a,t){this.pdsTabClick.emit([a,t])}render(){const a=e("span",{key:"c315c8920c12da7d1913db7e53dc075dc9734280",class:"pds-tab-edge",role:"presentation"});const t=e("span",{key:"37dfaa651e87a0291d28c50fbdda9c1cfa70f41b",class:"pds-tab-edge pds-tab-edge--end",role:"presentation"});return e(i,{key:"0aa73a4a6b1ff12fff6f212135f8f33c14e6ff5f",variant:this.variant,slot:"tabs",index:this.index},e("button",{key:"72443536e14ddad4ac8e19c025165884de81697f",role:"tab",id:this.parentComponentId+"__"+this.name,"aria-controls":this.parentComponentId+"__"+this.name+"-panel",tabindex:this.selected?"0":"-1","aria-selected":this.selected?"true":"false",class:this.selected?"pds-tab is-active":"pds-tab",onClick:this.onTabClick.bind(this,this.index,this.parentComponentId)},this.variant==="availability"&&a,this.variant==="availability"&&t,e("div",{key:"547a022cb0354b176a11e681e9103bb4486ab1ef",class:"pds-tab__content"},e("slot",{key:"db859b0d21de4e57a75e588d069a9b1b86d271c4"}))))}get el(){return o(this)}};s.style=n;export{s as pds_tab};
+//# sourceMappingURL=p-ff9044ed.entry.js.map

package/dist/pine-core/p-ff9044ed.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pdsTabCss","PdsTabStyle0","PdsTab","onTabClick","index","parentComponentId","this","pdsTabClick","emit","render","availabilityTabEdgeInlineStart","h","key","class","role","availabilityTabEdgeInlineEnd","Host","variant","slot","id","name","tabindex","selected","onClick","bind"],"sources":["src/components/pds-tabs/pds-tab/pds-tab.scss?tag=pds-tab","src/components/pds-tabs/pds-tab/pds-tab.tsx"],"sourcesContent":["pds-tab {\n  --border-none: var(--pine-border-width-none);\n\n  --border-radius-availability: var(--pine-border-radius-100);\n  --border-radius-default: var(--pine-border-radius-125);\n  --border-radius-none: var(--pine-border-radius-0);\n\n  --box-shadow-focus: 0 0 0 2px var(--pine-color-blue-200);\n\n  --color-background-active: var(--pine-color-charcoal-400);\n  --color-background-availability: var(--pine-color-white);\n  --color-background-default: var(--pine-color-grey-300);\n  --color-background-hover: var(--pine-color-grey-400);\n  --color-text-active: var(--pine-color-charcoal-400);\n  --color-text-active-inverse: var(--pine-color-white);\n  --color-text-default: var(--pine-color-charcoal-200);\n  --color-text-focus: var(--pine-color-charcoal-300);\n\n  --font-size-availability-content: var(--pine-font-size-075);\n  --font-size-default: var(--pine-font-size-100);\n  --font-size-filter-content: var(--pine-font-size-087);\n\n  --font-weight-default: var(--pine-font-weight-medium);\n\n  --line-height-availability-content: var(--pine-line-height-100);\n  --line-height-default: var(--pine-line-height-150);\n  --line-height-filter-content: var(--pine-line-height-125);\n\n  --outline: 4px solid var(--pine-color-blue-200);\n\n  --spacing-padding-none: var(--pine-spacing-0);\n\n  display: inline-block;\n  position: relative;\n}\n\n///\n/// Resets base button styles\n///\n@mixin pds-button-style-reset {\n  appearance: none;\n  background-color: transparent;\n  border: var(--border-none);\n  box-shadow: none;\n  color: inherit;\n  cursor: pointer;\n  font-family: inherit;\n  padding: var(--spacing-padding-none);\n}\n\n.pds-tab {\n  @include pds-button-style-reset();\n\n  align-items: center;\n  color: var(--color-text-default);\n  display: inline-flex;\n  position: relative;\n  text-decoration: none;\n  white-space: nowrap;\n\n  &.is-active,\n  &[aria-selected='true'] {\n    color: var(--color-text-active);\n\n    .pds-tab__content::after {\n      opacity: 1;\n    }\n  }\n\n  &:hover {\n    color: var(--color-text-active);\n  }\n\n  &:focus-visible {\n    // outline: var(--pine-border-focus); Border radius for outline does not work in Safari\n    box-shadow: var(--box-shadow-focus); // Remove when outline radius is supported in Safari\n    outline: none;\n  }\n\n  .pds-tab__content {\n    font-family: inherit;\n    font-size: var(--font-size-default);\n    font-weight: var(--font-weight-default);\n    line-height: var(--line-height-default);\n    padding-block-end: 11px;\n    position: relative;\n\n    &::after {\n      background-color: currentColor;\n      bottom: 0;\n      content: '';\n      height: 3px;\n      left: 0;\n      opacity: 0;\n      position: absolute;\n      right: 0;\n    }\n  }\n\n  .pds-tab-edge {\n    display: none;\n  }\n}\n\n.pds-tabs--availability {\n  --color-background-tab: transparent;\n\n  .pds-tab {\n    background-color: var(--color-background-tab);\n    border-radius: var(--border-radius-availability) var(--border-radius-availability) var(--border-radius-none) var(--border-radius-none);\n    padding: 8px 16px 13px;\n\n    &.is-active,\n    &[aria-selected='true'] {\n      --color-background-tab: var(--color-background-availability);\n\n      .pds-tab__content::after {\n        opacity: 1;\n      }\n\n      .pds-tab-edge {\n        z-index: 1;\n      }\n    }\n\n    &:hover:not(.is-active, [aria-selected='true']) {\n      --color-background-tab: var(--color-background-default);\n    }\n\n    &:focus-visible {\n      color: var(--color-text-default);\n    }\n  }\n\n  .pds-tab__content {\n    font-size: var(--font-size-availability-content);\n    line-height: var(--line-height-availability-content);\n    padding-bottom: 7px;\n  }\n\n  .pds-tab-edge {\n    bottom: 0;\n    display: block;\n    height: 8px;\n    inset-inline-end: 100%;\n    overflow: hidden;\n    position: absolute;\n    width: 8px;\n\n    &::before {\n      border-radius: 50%;\n      bottom: 0;\n      box-shadow: 4px 4px 0 0 var(--color-background-tab);\n      content: '';\n      display: block;\n      height: 200%;\n      inset-inline-end: 0;\n      position: absolute;\n      width: 200%;\n    }\n  }\n\n  .pds-tab-edge--end {\n    inset-inline-end: unset;\n    inset-inline-start: 100%;\n\n    &::before {\n      box-shadow: -4px 4px 0 0 var(--color-background-tab);\n      inset-inline-end: unset;\n      inset-inline-start: 0;\n    }\n  }\n}\n\n.pds-tabs--filter {\n  --color-background-tab: var(--color-background-active);\n\n  .pds-tab {\n    background-color: var(--color-background-tab);\n    border-radius: 50px;\n    color: var(--color-text-active);\n    padding: 6px 15px;\n\n    &.is-active,\n    &[aria-selected='true'] {\n      --color-background-tab: var(--color-background-active);\n      color: var(--color-text-active-inverse)\n    }\n\n    &:hover:not(.is-active, [aria-selected='true']) {\n      --color-background-tab: var(--color-background-hover);\n    }\n  }\n\n  .pds-tab__content {\n    font-size: var(--font-size-filter-content);\n    line-height: var(--line-height-filter-content);\n    padding-block-end: 0;\n\n    &::after {\n      content: unset;\n    }\n  }\n}\n","import { Component, Element, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n  tag: 'pds-tab',\n  styleUrl: 'pds-tab.scss',\n  shadow: false,\n})\nexport class PdsTab {\n  @Element() el: HTMLPdsTabElement;\n\n  /**\n   * Sets the related tab name, this name must match a `pds-tabpanel`'s tab name property\n   */\n  @Prop() name!: string;\n\n  /**\n   * Keeps track of the parentComponentId unique id, this property is passed by parent component\n   */\n  /** @internal */\n  @Prop() parentComponentId: string;\n\n  /**\n   * Keeps track of if the expected tab variant, this property is passed by parent component\n   */\n  /** @internal */\n  @Prop() variant: string;\n\n  /**\n   * Keeps track of if the tab index number, this property is passed by parent component\n   */\n  /** @internal */\n  @Prop() index: number;\n\n  /**\n   * Keeps track of the tabpanel selected state, this property is passed by parent component\n   */\n  /** @internal */\n  @Prop() selected = false;\n\n  /**\n   * Emits an event upon tab click for `pds-tab` and `pds-tabpanel` to listen for\n   */\n  /** @internal */\n  @Event() pdsTabClick: EventEmitter<object>;\n  private onTabClick(index, parentComponentId) {\n    this.pdsTabClick.emit([index, parentComponentId]);\n  }\n\n  render() {\n    const availabilityTabEdgeInlineStart = (\n      <span class=\"pds-tab-edge\" role=\"presentation\"></span>\n    )\n\n    const availabilityTabEdgeInlineEnd = (\n      <span class=\"pds-tab-edge pds-tab-edge--end\" role=\"presentation\"></span>\n    )\n\n    return (\n      <Host variant={this.variant} slot=\"tabs\" index={this.index}>\n        <button\n          role=\"tab\"\n          id={this.parentComponentId + \"__\" + this.name}\n          aria-controls={this.parentComponentId + \"__\" + this.name + \"-panel\"}\n          tabindex={this.selected ? \"0\" : \"-1\"}\n          aria-selected={this.selected ? \"true\" : \"false\"}\n          class={this.selected ? \"pds-tab is-active\" : \"pds-tab\"}\n          onClick={this.onTabClick.bind(this, this.index, this.parentComponentId)}\n        >\n          {this.variant === \"availability\" && availabilityTabEdgeInlineStart}\n          {this.variant === \"availability\" && availabilityTabEdgeInlineEnd}\n          <div class=\"pds-tab__content\"><slot/></div>\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAY,u0JAClB,MAAAC,EAAeD,E,MCMFE,EAAM,M,iLA8BE,K,CAOX,UAAAC,CAAWC,EAAOC,GACxBC,KAAKC,YAAYC,KAAK,CAACJ,EAAOC,G,CAGhC,MAAAI,GACE,MAAMC,EACJC,EAAA,QAAAC,IAAA,2CAAMC,MAAM,eAAeC,KAAK,iBAGlC,MAAMC,EACJJ,EAAA,QAAAC,IAAA,2CAAMC,MAAM,iCAAiCC,KAAK,iBAGpD,OACEH,EAACK,EAAI,CAAAJ,IAAA,2CAACK,QAASX,KAAKW,QAASC,KAAK,OAAOd,MAAOE,KAAKF,OACnDO,EAAA,UAAAC,IAAA,2CACEE,KAAK,MACLK,GAAIb,KAAKD,kBAAoB,KAAOC,KAAKc,KAAI,gBAC9Bd,KAAKD,kBAAoB,KAAOC,KAAKc,KAAO,SAC3DC,SAAUf,KAAKgB,SAAW,IAAM,KAAI,gBACrBhB,KAAKgB,SAAW,OAAS,QACxCT,MAAOP,KAAKgB,SAAW,oBAAsB,UAC7CC,QAASjB,KAAKH,WAAWqB,KAAKlB,KAAMA,KAAKF,MAAOE,KAAKD,oBAEpDC,KAAKW,UAAY,gBAAkBP,EACnCJ,KAAKW,UAAY,gBAAkBF,EACpCJ,EAAA,OAAAC,IAAA,2CAAKC,MAAM,oBAAmBF,EAAA,QAAAC,IAAA,+C"}

package/dist/pine-core/p-fffaa868.entry.js

@@ -0,0 +1,2 @@
+import{r,h as o,H as e,g as a}from"./p-2f77dbd3.js";import{b as c}from"./p-403a20e8.js";const t=r=>!!r.shadowRoot&&!!r.attachShadow;const d=":host{--border-width-default:var(--pine-border-width-thin);--border-width-unstyled:var(--pine-border-radius-0);--color-border-default:transparent;--color-border-disabled:transparent;--color-border-focus:transparent;--color-border-hover:transparent;--color-background-primary-default:var(--pine-color-background-action-primary-default);--color-background-primary-disabled:var(--pine-color-background-action-primary-disabled);--color-background-primary-hover:var(--pine-color-background-action-primary-hover);--color-text-primary-default:var(--pine-color-text-action-primary-default);--color-text-primary-disabled:var(--pine-color-text-action-primary-disabled);--color-outline-primary:var(--pine-color-blue-200);--color-border-secondary-default:var(--pine-color-grey-400);--color-border-secondary-disabled:var(--pine-color-grey-300);--color-border-secondary-focus:var(--pine-color-grey-300);--color-border-secondary-hover:var(--pine-color-grey-500);--color-text-secondary-default:var(--pine-color-text-body-default);--color-text-secondary-disabled:var(--pine-color-text-action-primary-disabled);--color-outline-secondary:var(--pine-color-blue-200);--color-background-accent-default:var(--pine-color-background-action-accent-default);--color-background-accent-disabled:var(--pine-color-background-action-accent-disabled);--color-background-accent-hover:var(--pine-color-background-action-accent-hover);--color-text-accent-default:var(--pine-color-text-action-accent-default);--color-text-accent-disabled:var(--pine-color-text-action-accent-disabled);--color-outline-accent:var(--pine-color-blue-200);--color-background-destructive-default:var(--pine-color-background-action-destructive-default);--color-background-destructive-disabled:var(--pine-color-background-action-destructive-disabled);--color-background-destructive-hover:var(--pine-color-background-action-destructive-hover);--color-text-destructive-default:var(--pine-color-text-action-destructive-default);--color-text-destructive-disabled:var(--pine-color-text-action-destructive-disabled);--color-outline-destructive:var(--pine-color-red-200);--spacing-disclosure-icon-margin-inline-end:var(--pine-spacing-0);--spacing-disclosure-margin-inline-start:var(--pine-spacing-100);--spacing-icon-margin-inline-end:var(--pine-spacing-100);--spacing-padding-block:var(--pine-spacing-100);--spacing-padding-inline:var(--pine-spacing-200);--spacing-unstyled:var(--pine-spacing-0);--typography-default:var(--pine-body-med);display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle}.pds-button{-ms-flex-align:center;align-items:center;background-color:var(--color-background-default);border:var(--border-width-default) solid var(--color-border-default);border-radius:var(--pine-border-radius-125);color:var(--color-text-default);display:-ms-flexbox;display:flex;font:var(--typography-default);min-height:40px;padding:var(--spacing-padding-block) var(--spacing-padding-inline)}.pds-button pds-icon{fill:currentColor;-webkit-margin-end:var(--spacing-icon-margin-inline-end);margin-inline-end:var(--spacing-icon-margin-inline-end)}.pds-button:hover{background-color:var(--color-background-hover);border-color:var(--color-border-hover)}.pds-button:focus-visible{--box-shadow-focus:0 0 0 2px var(--pine-color-primary-200);border-color:var(--color-border-focus);-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-button:disabled{background-color:var(--color-background-disabled);border-color:var(--color-border-disabled);color:var(--color-text-disabled)}.pds-button--primary{--color-background-default:var(--color-background-primary-default);--color-background-hover:var(--color-background-primary-hover);--color-background-disabled:var(--color-background-primary-disabled);--color-text-default:var(--color-text-primary-default);--color-text-disabled:var(--color-text-primary-disabled);--color-outline:var(--color-outline-primary)}.pds-button--accent{--color-background-default:var(--color-background-accent-default);--color-background-hover:var(--color-background-accent-hover);--color-background-disabled:var(--color-background-accent-disabled);--color-text-default:var(--color-text-accent-default);--color-text-disabled:var(--color-text-accent-disabled);--color-outline:var(--color-outline-accent)}.pds-button--destructive{--color-background-default:var(--color-background-destructive-default);--color-background-hover:var(--color-background-destructive-hover);--color-background-disabled:var(--color-background-destructive-disabled);--color-text-default:var(--color-text-destructive-default);--color-text-disabled:var(--color-text-destructive-disabled);--color-outline:var(--color-outline-destructive)}.pds-button--secondary,.pds-button--disclosure{--color-background-default:transparent;--color-background-hover:transparent;--color-background-disabled:transparent;--color-border-disabled:var(--color-border-secondary-disabled);--color-border-focus:var(--color-border-secondary-focus);--color-border-hover:var(--color-border-secondary-hover);--color-border-default:var(--color-border-secondary-default);--color-text-default:var(--color-text-secondary-default);--color-text-disabled:var(--color-text-secondary-disabled);--color-outline:var(--color-outline-secondary)}.pds-button--disclosure pds-icon{-webkit-margin-end:var(--spacing-disclosure-icon-margin-inline-end);margin-inline-end:var(--spacing-disclosure-icon-margin-inline-end);-webkit-margin-start:var(--spacing-disclosure-margin-inline-start);margin-inline-start:var(--spacing-disclosure-margin-inline-start)}.pds-button--unstyled{--color-background-default:transparent;--color-background-hover:transparent;--color-background-disabled:transparent;--color-text-default:inherit;border:var(--border-width-unstyled);margin:var(--spacing-unstyled);min-height:auto;padding:var(--spacing-unstyled);width:inherit}";const n=d;const i=class{constructor(o){r(this,o);this.handleClick=r=>{if(this.type!="button"){if(t(this.el)){const o=this.el.closest("form");if(o){r.preventDefault();const e=document.createElement("button");e.type=this.type;e.style.display="none";o.appendChild(e);e.click();e.remove()}}}};this.componentId=undefined;this.disabled=false;this.icon=null;this.name=undefined;this.value=undefined;this.type="button";this.variant="primary"}classNames(){const r=["pds-button"];if(this.variant){r.push("pds-button--"+this.variant)}return r.join("  ")}render(){return o(e,{key:"453a94093ba7bb8aa0fdea470cd9008e96601dcf","aria-disabled":this.disabled?"true":null,id:this.componentId,onClick:this.handleClick,variant:this.variant},o("button",{key:"ec841dfb0b026d1c3376f686f6d9187cdecb1762",class:this.classNames(),disabled:this.disabled,name:this.name,part:"button",type:this.type,value:this.value},this.icon&&this.variant!=="disclosure"&&o("pds-icon",{key:"926395c361f5b94f9c4d12980c4a93a52bf79c41",name:this.icon,part:"icon"}),o("slot",{key:"4a74b8b6cd711fee67622c92b515cf329964da64"}),this.variant==="disclosure"&&o("pds-icon",{key:"e2d356d80d03c3d8a8fc1259528e13a1c88e1307",icon:c,part:"caret"})))}get el(){return a(this)}};i.style=n;export{i as pds_button};
+//# sourceMappingURL=p-fffaa868.entry.js.map

package/dist/pine-core/p-fffaa868.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hasShadowDom","el","shadowRoot","attachShadow","pdsButtonCss","PdsButtonStyle0","PdsButton","this","handleClick","ev","type","form","closest","preventDefault","fakeButton","document","createElement","style","display","appendChild","click","remove","classNames","variant","push","join","render","h","Host","key","disabled","id","componentId","onClick","class","name","part","value","icon","caretDown"],"sources":["src/utils/utils.ts","src/components/pds-button/pds-button.scss?tag=pds-button&encapsulation=shadow","src/components/pds-button/pds-button.tsx"],"sourcesContent":["export function format(first: string, middle: string, last: string): string {\n  return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');\n}\n\nexport const hasShadowDom = (el: HTMLElement) => {\n  return !!el.shadowRoot && !!(el as any).attachShadow\n}\n",":host {\n  --border-width-default: var(--pine-border-width-thin);\n  --border-width-unstyled: var(--pine-border-radius-0);\n\n  --color-border-default: transparent;\n  --color-border-disabled: transparent;\n  --color-border-focus: transparent;\n  --color-border-hover: transparent;\n\n  // primary\n  --color-background-primary-default: var(--pine-color-background-action-primary-default);\n  --color-background-primary-disabled: var(--pine-color-background-action-primary-disabled);\n  --color-background-primary-hover: var(--pine-color-background-action-primary-hover);\n  --color-text-primary-default: var(--pine-color-text-action-primary-default);\n  --color-text-primary-disabled: var(--pine-color-text-action-primary-disabled);\n  --color-outline-primary: var(--pine-color-blue-200);\n\n  // secondary\n  --color-border-secondary-default: var(--pine-color-grey-400);\n  --color-border-secondary-disabled: var(--pine-color-grey-300);\n  --color-border-secondary-focus: var(--pine-color-grey-300);\n  --color-border-secondary-hover: var(--pine-color-grey-500);\n  --color-text-secondary-default: var(--pine-color-text-body-default);\n  --color-text-secondary-disabled: var(--pine-color-text-action-primary-disabled);\n  --color-outline-secondary: var(--pine-color-blue-200);\n\n  // accent\n  --color-background-accent-default: var(--pine-color-background-action-accent-default);\n  --color-background-accent-disabled: var(--pine-color-background-action-accent-disabled);\n  --color-background-accent-hover: var(--pine-color-background-action-accent-hover);\n  --color-text-accent-default: var(--pine-color-text-action-accent-default);\n  --color-text-accent-disabled: var(--pine-color-text-action-accent-disabled);\n  --color-outline-accent: var(--pine-color-blue-200);\n\n  // destructive\n  --color-background-destructive-default: var(--pine-color-background-action-destructive-default);\n  --color-background-destructive-disabled: var(--pine-color-background-action-destructive-disabled);\n  --color-background-destructive-hover: var(--pine-color-background-action-destructive-hover);\n  --color-text-destructive-default: var(--pine-color-text-action-destructive-default);\n  --color-text-destructive-disabled: var(--pine-color-text-action-destructive-disabled);\n  --color-outline-destructive: var(--pine-color-red-200);\n\n  --spacing-disclosure-icon-margin-inline-end: var(--pine-spacing-0);\n  --spacing-disclosure-margin-inline-start: var(--pine-spacing-100);\n  --spacing-icon-margin-inline-end: var(--pine-spacing-100);\n  --spacing-padding-block: var(--pine-spacing-100);\n  --spacing-padding-inline: var(--pine-spacing-200);\n  --spacing-unstyled: var(--pine-spacing-0);\n\n  --typography-default: var(--pine-body-med);\n\n  display: inline-flex;\n  vertical-align: middle;\n}\n\n.pds-button {\n  align-items: center;\n  background-color: var(--color-background-default);\n  border: var(--border-width-default) solid var(--color-border-default);\n  border-radius: var(--pine-border-radius-125);\n  color: var(--color-text-default);\n  display: flex;\n  font: var(--typography-default);\n  min-height: 40px;\n  padding: var(--spacing-padding-block) var(--spacing-padding-inline);\n\n  pds-icon {\n    fill: currentColor;\n    margin-inline-end: var(--spacing-icon-margin-inline-end);\n  }\n\n  &:hover {\n    background-color: var(--color-background-hover);\n    border-color: var(--color-border-hover);\n  }\n\n  &:focus-visible {\n    --box-shadow-focus: 0 0 0 2px var(--pine-color-primary-200);\n    border-color: var(--color-border-focus);\n    // outline: var(--pine-border-focus); Border radius for outline does not work in Safari\n    box-shadow: var(--box-shadow-focus); // Remove when outline radius is supported in Safari\n    outline: none;\n  }\n\n  &:disabled {\n    background-color: var(--color-background-disabled);\n    border-color: var(--color-border-disabled);\n    color: var(--color-text-disabled);\n  }\n}\n\n.pds-button--primary {\n  --color-background-default: var(--color-background-primary-default);\n  --color-background-hover: var(--color-background-primary-hover);\n  --color-background-disabled: var(--color-background-primary-disabled);\n  --color-text-default: var(--color-text-primary-default);\n  --color-text-disabled: var(--color-text-primary-disabled);\n  --color-outline: var(--color-outline-primary);\n}\n\n.pds-button--accent {\n  --color-background-default: var(--color-background-accent-default);\n  --color-background-hover: var(--color-background-accent-hover);\n  --color-background-disabled: var(--color-background-accent-disabled);\n  --color-text-default: var(--color-text-accent-default);\n  --color-text-disabled: var(--color-text-accent-disabled);\n  --color-outline: var(--color-outline-accent);\n}\n\n.pds-button--destructive {\n  --color-background-default: var(--color-background-destructive-default);\n  --color-background-hover: var(--color-background-destructive-hover);\n  --color-background-disabled: var(--color-background-destructive-disabled);\n  --color-text-default: var(--color-text-destructive-default);\n  --color-text-disabled: var(--color-text-destructive-disabled);\n  --color-outline: var(--color-outline-destructive);\n}\n\n.pds-button--secondary,\n.pds-button--disclosure {\n  --color-background-default: transparent;\n  --color-background-hover: transparent;\n  --color-background-disabled: transparent;\n  --color-border-disabled: var(--color-border-secondary-disabled);\n  --color-border-focus: var(--color-border-secondary-focus);\n  --color-border-hover: var(--color-border-secondary-hover);\n  --color-border-default: var(--color-border-secondary-default);\n  --color-text-default: var(--color-text-secondary-default);\n  --color-text-disabled: var(--color-text-secondary-disabled);\n  --color-outline: var(--color-outline-secondary);\n}\n\n.pds-button--disclosure {\n  pds-icon {\n    margin-inline-end: var(--spacing-disclosure-icon-margin-inline-end);\n    margin-inline-start: var(--spacing-disclosure-margin-inline-start);\n  }\n}\n\n.pds-button--unstyled {\n  --color-background-default: transparent;\n  --color-background-hover: transparent;\n  --color-background-disabled: transparent;\n  --color-text-default: inherit;\n  border: var(--border-width-unstyled);\n  margin: var(--spacing-unstyled);\n  min-height: auto;\n  padding: var(--spacing-unstyled);\n  width: inherit;\n}\n","import { Component, Element, Host, h, Prop } from '@stencil/core';\nimport { hasShadowDom } from '../../utils/utils';\n\nimport { caretDown } from '@pine-ds/icons/icons';\n\n/**\n * @part button - The main button element that represents the button component.\n * @part caret - The caret icon element that appears when the button variant is 'disclosure'.\n * @part icon - The icon element that appears before the text in the button, if provided.\n*/\n\n@Component({\n  tag: 'pds-button',\n  styleUrl: 'pds-button.scss',\n  shadow: true,\n})\nexport class PdsButton {\n  @Element() el: HTMLPdsButtonElement;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Toggles disabled state of button\n   * @defaultValue false\n   */\n  @Prop() disabled? = false;\n\n  /**\n   * Displays icon before text when icon string matches an icon name\n   */\n  @Prop() icon?: string = null;\n\n  /**\n   * Provides button with a submittable name\n   */\n  @Prop() name?: string;\n\n  /**\n   * Provides button with a submittable value\n   */\n  @Prop() value?: string;\n\n  /**\n   * Provides button with a type\n   * @defaultValue button\n   */\n  @Prop() type?: 'button' | 'reset' | 'submit' = 'button';\n\n  /**\n   * Sets button variant styles as outlined in Figma documentation\n   */\n  @Prop() variant: 'primary' | 'secondary' | 'accent' | 'disclosure' | 'destructive' | 'unstyled' = 'primary';\n\n  private handleClick = (ev: Event) => {\n    if (this.type != 'button') {\n      // If button clicked IS NOT associated with a form\n      if (hasShadowDom(this.el)) {\n        const form = this.el.closest('form')\n        if (form) {\n          ev.preventDefault()\n\n          const fakeButton = document.createElement('button')\n          fakeButton.type = this.type\n          fakeButton.style.display = 'none'\n          form.appendChild(fakeButton)\n          fakeButton.click()\n          fakeButton.remove()\n        }\n      }\n    }\n  }\n\n  private classNames() {\n    const classNames = ['pds-button'];\n\n    if (this.variant) {\n      classNames.push('pds-button--' + this.variant);\n    }\n\n    return classNames.join('  ');\n  }\n\n  render() {\n    return (\n      <Host\n        aria-disabled={this.disabled ? 'true' : null}\n        id={this.componentId}\n        onClick={this.handleClick}\n        variant={this.variant}\n      >\n        <button\n          class={this.classNames()}\n          disabled={this.disabled}\n          name={this.name}\n          part=\"button\"\n          type={this.type}\n          value={this.value}\n        >\n          {this.icon && this.variant !== 'disclosure' && <pds-icon name={this.icon} part=\"icon\"></pds-icon>}\n          <slot />\n          {this.variant === 'disclosure' && <pds-icon icon={caretDown} part=\"caret\"></pds-icon>}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"wFAIO,MAAMA,EAAgBC,KAClBA,EAAGC,cAAiBD,EAAWE,aCL1C,MAAMC,EAAe,0uLACrB,MAAAC,EAAeD,E,MCeFE,EAAS,M,yBAwCZC,KAAAC,YAAeC,IACrB,GAAIF,KAAKG,MAAQ,SAAU,CAEzB,GAAIV,EAAaO,KAAKN,IAAK,CACzB,MAAMU,EAAOJ,KAAKN,GAAGW,QAAQ,QAC7B,GAAID,EAAM,CACRF,EAAGI,iBAEH,MAAMC,EAAaC,SAASC,cAAc,UAC1CF,EAAWJ,KAAOH,KAAKG,KACvBI,EAAWG,MAAMC,QAAU,OAC3BP,EAAKQ,YAAYL,GACjBA,EAAWM,QACXN,EAAWO,Q,8CAzCC,M,UAKI,K,mDAgBuB,S,aAKmD,S,CAqB1F,UAAAC,GACN,MAAMA,EAAa,CAAC,cAEpB,GAAIf,KAAKgB,QAAS,CAChBD,EAAWE,KAAK,eAAiBjB,KAAKgB,Q,CAGxC,OAAOD,EAAWG,KAAK,K,CAGzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2DACYtB,KAAKuB,SAAW,OAAS,KACxCC,GAAIxB,KAAKyB,YACTC,QAAS1B,KAAKC,YACde,QAAShB,KAAKgB,SAEdI,EAAA,UAAAE,IAAA,2CACEK,MAAO3B,KAAKe,aACZQ,SAAUvB,KAAKuB,SACfK,KAAM5B,KAAK4B,KACXC,KAAK,SACL1B,KAAMH,KAAKG,KACX2B,MAAO9B,KAAK8B,OAEX9B,KAAK+B,MAAQ/B,KAAKgB,UAAY,cAAgBI,EAAA,YAAAE,IAAA,2CAAUM,KAAM5B,KAAK+B,KAAMF,KAAK,SAC/ET,EAAA,QAAAE,IAAA,6CACCtB,KAAKgB,UAAY,cAAgBI,EAAA,YAAAE,IAAA,2CAAUS,KAAMC,EAAWH,KAAK,W"}

package/dist/pine-core/pine-core.esm.js

@@ -1,2 +1,2 @@
-import{p as e,b as o}from"./p-2f77dbd3.js";export{s as setNonce}from"./p-2f77dbd3.js";import{g as n}from"./p-e1255160.js";const t=()=>{const o=import.meta.url;const n={};if(o!==""){n.resourcesUrl=new URL(".",o).href}return e(n)};t().then((async e=>{await n();return o([["p-8b45381c",[[1,"pds-copytext",{border:[516],componentId:[1,"component-id"],fullWidth:[4,"full-width"],truncate:[4],value:[1]}]]],["p-8196f142",[[1,"pds-table-head"]]],["p-237f0b79",[[1,"pds-table-row",{isSelected:[32]}]]],["p-a0733832",[[1,"pds-accordion",{componentId:[1,"component-id"],isOpen:[1540,"open"]},null,{isOpen:["handleOpenState"]}]]],["p-70860aa6",[[1,"pds-avatar",{alt:[1],badge:[4],componentId:[1,"component-id"],dropdown:[4],image:[1],size:[513],variant:[513]}]]],["p-e200c428",[[1,"pds-chip",{componentId:[1,"component-id"],sentiment:[1],dot:[4],label:[1],large:[4],variant:[1]}]]],["p-6a8d8d12",[[1,"pds-link",{componentId:[1,"component-id"],external:[4],variant:[1],fontSize:[1,"font-size"],href:[1]}]]],["p-1b7c9a32",[[6,"pds-sortable-item",{enableActions:[4,"enable-actions"],componentId:[1,"component-id"],handle:[4]}]]],["p-b5582d9f",[[0,"pds-box",{alignItems:[1,"align-items"],auto:[4],backgroundColor:[1,"background-color"],border:[4],borderColor:[1,"border-color"],borderRadius:[1,"border-radius"],direction:[1],display:[1],fit:[4],gap:[1],flex:[1],justifyContent:[1,"justify-content"],minHeight:[1,"min-height"],minWidth:[1,"min-width"],offset:[1],offsetXs:[1,"offset-xs"],offsetSm:[1,"offset-sm"],offsetMd:[1,"offset-md"],offsetLg:[1,"offset-lg"],offsetXl:[1,"offset-xl"],padding:[1],shadow:[1],size:[1],sizeXs:[1,"size-xs"],sizeSm:[1,"size-sm"],sizeMd:[1,"size-md"],sizeLg:[1,"size-lg"],sizeXl:[1,"size-xl"]}]]],["p-ea2edef4",[[1,"pds-divider",{componentId:[1,"component-id"],offset:[1],vertical:[4]}]]],["p-c3440b2d",[[1,"pds-image",{alt:[1],componentId:[1,"component-id"],height:[2],loading:[1],sizes:[1],src:[1],srcset:[1],width:[2]}]]],["p-26477108",[[1,"pds-input",{componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],label:[1],name:[1],placeholder:[1],readonly:[4],required:[4],type:[1],value:[1025]}]]],["p-7fc3e294",[[1,"pds-progress",{animated:[4],componentId:[1,"component-id"],fillColor:[1,"fill-color"],label:[1],percent:[2],showPercent:[4,"show-percent"]}]]],["p-61ba006d",[[2,"pds-radio",{checked:[4],disabled:[4],errorMessage:[1,"error-message"],invalid:[4],componentId:[1,"component-id"],label:[1],helperMessage:[1,"helper-message"],name:[1],required:[4],value:[1]}]]],["p-1632460c",[[0,"pds-row",{alignItems:[1,"align-items"],border:[4],colGap:[1,"col-gap"],componentId:[1,"component-id"],justifyContent:[1,"justify-content"],minHeight:[1,"min-height"],noWrap:[4,"no-wrap"]}]]],["p-6f2f7e92",[[6,"pds-sortable",{border:[516],componentId:[1,"component-id"],dividers:[516],handleType:[1,"handle-type"]}]]],["p-18abb120",[[1,"pds-switch",{componentId:[1,"component-id"],checked:[4],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],label:[1],name:[1],required:[4],type:[1],value:[1]}]]],["p-2a609e04",[[4,"pds-tab",{name:[1],parentComponentId:[1,"parent-component-id"],variant:[1],index:[2],selected:[4]}]]],["p-d479e9d1",[[1,"pds-table",{compact:[4],componentId:[1,"component-id"],responsive:[4],fixedColumn:[4,"fixed-column"],selectable:[4],sortingColumn:[32],sortingDirection:[32]},[[0,"pdsTableSort","handleTableSort"]]]]],["p-afdfadb0",[[1,"pds-table-body"]]],["p-93859623",[[4,"pds-tabpanel",{name:[1],parentComponentId:[1,"parent-component-id"],variant:[1],selected:[1028]}]]],["p-a913d9f3",[[1,"pds-tabs",{tablistLabel:[1,"tablist-label"],componentId:[1,"component-id"],variant:[1],activeTabName:[1025,"active-tab-name"],activeTabIndex:[1026,"active-tab-index"]},[[16,"pdsTabClick","tabClickHandler"],[0,"keydown","handleKeyDown"]]]]],["p-d5628be9",[[1,"pds-textarea",{componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[1028],label:[1],name:[1],placeholder:[1],readonly:[4],required:[4],rows:[2],value:[1025]}]]],["p-df08eb9e",[[1,"pds-tooltip",{content:[1],componentId:[1,"component-id"],hasArrow:[4,"has-arrow"],htmlContent:[4,"html-content"],placement:[513],opened:[1540],isOpen:[32],showTooltip:[64],hideTooltip:[64]},null,{opened:["handleOpenToggle"]}]]],["p-52e6f836",[[1,"pds-icon",{color:[1],icon:[8],name:[513],size:[513],src:[1],ariaLabel:[32],isVisible:[32],svgContent:[32]},null,{name:["loadIcon"],src:["loadIcon"],icon:["loadIcon"]}]]],["p-35d540e7",[[1,"pds-button",{componentId:[1,"component-id"],disabled:[4],icon:[1],name:[1],value:[1],type:[1],variant:[1]}]]],["p-5966e442",[[1,"pds-table-head-cell",{sortable:[4],sortingDirection:[32],tableScrolling:[32]}]]],["p-57e352da",[[1,"pds-checkbox",{checked:[1028],componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],indeterminate:[4],invalid:[4],label:[1],labelHidden:[4,"label-hidden"],name:[1],required:[4],value:[1]}],[1,"pds-table-cell",{truncate:[4],tableScrolling:[32]}]]]],e)}));
+import{p as e,b as o}from"./p-2f77dbd3.js";export{s as setNonce}from"./p-2f77dbd3.js";import{g as n}from"./p-e1255160.js";const a=()=>{const o=import.meta.url;const n={};if(o!==""){n.resourcesUrl=new URL(".",o).href}return e(n)};a().then((async e=>{await n();return o([["p-70481699",[[1,"pds-copytext",{border:[516],componentId:[1,"component-id"],fullWidth:[4,"full-width"],truncate:[4],value:[1]}]]],["p-16e9d55b",[[1,"pds-table-head"]]],["p-5f2b3f57",[[1,"pds-table-row",{isSelected:[32]}]]],["p-c3828098",[[1,"pds-accordion",{componentId:[1,"component-id"],isOpen:[1540,"open"]},null,{isOpen:["handleOpenState"]}]]],["p-51f81513",[[1,"pds-avatar",{alt:[1],badge:[4],componentId:[1,"component-id"],dropdown:[4],image:[1],size:[513],variant:[513]}]]],["p-bc4bbda0",[[1,"pds-chip",{componentId:[1,"component-id"],sentiment:[1],dot:[4],label:[1],large:[4],variant:[1]}]]],["p-0eb4e674",[[1,"pds-link",{componentId:[1,"component-id"],external:[4],variant:[1],fontSize:[1,"font-size"],href:[1]}]]],["p-8ce3a7ef",[[6,"pds-sortable-item",{enableActions:[4,"enable-actions"],componentId:[1,"component-id"],showHandle:[1028,"show-handle"]}]]],["p-9a129745",[[0,"pds-box",{alignItems:[1,"align-items"],auto:[4],backgroundColor:[1,"background-color"],border:[4],borderColor:[1,"border-color"],borderRadius:[1,"border-radius"],direction:[1],display:[1],fit:[4],gap:[1],flex:[1],justifyContent:[1,"justify-content"],minHeight:[1,"min-height"],minWidth:[1,"min-width"],offset:[1],offsetXs:[1,"offset-xs"],offsetSm:[1,"offset-sm"],offsetMd:[1,"offset-md"],offsetLg:[1,"offset-lg"],offsetXl:[1,"offset-xl"],padding:[1],shadow:[1],size:[1],sizeXs:[1,"size-xs"],sizeSm:[1,"size-sm"],sizeMd:[1,"size-md"],sizeLg:[1,"size-lg"],sizeXl:[1,"size-xl"]}]]],["p-9f8a1aa6",[[1,"pds-divider",{componentId:[1,"component-id"],offset:[1],vertical:[4]}]]],["p-bd5135c3",[[1,"pds-image",{alt:[1],componentId:[1,"component-id"],height:[2],loading:[1],sizes:[1],src:[1],srcset:[1],width:[2]}]]],["p-206b272d",[[1,"pds-input",{componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],label:[1],name:[1],placeholder:[1],readonly:[4],required:[4],type:[1],value:[1025]}]]],["p-4f7ee11c",[[1,"pds-progress",{animated:[4],componentId:[1,"component-id"],fillColor:[1,"fill-color"],label:[1],percent:[2],showPercent:[4,"show-percent"]}]]],["p-2fe87b9d",[[2,"pds-radio",{checked:[4],disabled:[4],errorMessage:[1,"error-message"],invalid:[4],componentId:[1,"component-id"],label:[1],helperMessage:[1,"helper-message"],name:[1],required:[4],value:[1]}]]],["p-1632460c",[[0,"pds-row",{alignItems:[1,"align-items"],border:[4],colGap:[1,"col-gap"],componentId:[1,"component-id"],justifyContent:[1,"justify-content"],minHeight:[1,"min-height"],noWrap:[4,"no-wrap"]}]]],["p-5073b1c0",[[6,"pds-sortable",{border:[516],componentId:[1,"component-id"],dividers:[516],handleType:[1,"handle-type"]}]]],["p-c1249ab9",[[1,"pds-switch",{componentId:[1,"component-id"],checked:[4],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[4],label:[1],name:[1],required:[4],type:[1],value:[1]}]]],["p-ff9044ed",[[4,"pds-tab",{name:[1],parentComponentId:[1,"parent-component-id"],variant:[1],index:[2],selected:[4]}]]],["p-87c2ac18",[[1,"pds-table",{compact:[4],componentId:[1,"component-id"],responsive:[4],fixedColumn:[4,"fixed-column"],selectable:[4],sortingColumn:[32],sortingDirection:[32]},[[0,"pdsTableSort","handleTableSort"]]]]],["p-afdfadb0",[[1,"pds-table-body"]]],["p-209bc3fd",[[4,"pds-tabpanel",{name:[1],parentComponentId:[1,"parent-component-id"],variant:[1],selected:[1028]}]]],["p-2e01613b",[[1,"pds-tabs",{tablistLabel:[1,"tablist-label"],componentId:[1,"component-id"],variant:[1],activeTabName:[1025,"active-tab-name"],activeTabIndex:[1026,"active-tab-index"]},[[16,"pdsTabClick","tabClickHandler"],[0,"keydown","handleKeyDown"]]]]],["p-809648ee",[[1,"pds-textarea",{componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],invalid:[1028],label:[1],name:[1],placeholder:[1],readonly:[4],required:[4],rows:[2],value:[1025]}]]],["p-173f8d39",[[1,"pds-tooltip",{content:[1],componentId:[1,"component-id"],hasArrow:[4,"has-arrow"],htmlContent:[4,"html-content"],placement:[513],opened:[1540],isOpen:[32],showTooltip:[64],hideTooltip:[64]},null,{opened:["handleOpenToggle"]}]]],["p-52e6f836",[[1,"pds-icon",{color:[1],icon:[8],name:[513],size:[513],src:[1],ariaLabel:[32],isVisible:[32],svgContent:[32]},null,{name:["loadIcon"],src:["loadIcon"],icon:["loadIcon"]}]]],["p-fffaa868",[[1,"pds-button",{componentId:[1,"component-id"],disabled:[4],icon:[1],name:[1],value:[1],type:[1],variant:[1]}]]],["p-b52c9d3d",[[1,"pds-table-head-cell",{sortable:[4],sortingDirection:[32],tableScrolling:[32]}]]],["p-61ab207f",[[1,"pds-checkbox",{checked:[1028],componentId:[1,"component-id"],disabled:[4],errorMessage:[1,"error-message"],helperMessage:[1,"helper-message"],indeterminate:[4],invalid:[4],label:[1],labelHidden:[4,"label-hidden"],name:[1],required:[4],value:[1]}],[1,"pds-table-cell",{truncate:[4],tableScrolling:[32]}]]]],e)}));
 //# sourceMappingURL=pine-core.esm.js.map

package/dist/pine-core/pine-core.esm.js.map

@@ -1 +1 @@
-{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","border","componentId","fullWidth","truncate","value","isSelected","isOpen","alt","badge","dropdown","image","size","variant","sentiment","dot","label","large","external","fontSize","enableActions","handle","alignItems","auto","backgroundColor","borderColor","borderRadius","direction","display","fit","gap","flex","justifyContent","minHeight","minWidth","offset","offsetXs","offsetSm","offsetMd","offsetLg","offsetXl","padding","shadow","sizeXs","sizeSm","sizeMd","sizeLg","sizeXl","vertical","height","loading","sizes","src","srcset","width","disabled","errorMessage","helperMessage","invalid","name","placeholder","readonly","required","type","animated","fillColor","percent","showPercent","checked","colGap","noWrap","dividers","handleType","parentComponentId","index","selected","compact","responsive","fixedColumn","selectable","sortingColumn","sortingDirection","tablistLabel","activeTabName","activeTabIndex","rows","content","hasArrow","htmlContent","placement","opened","showTooltip","hideTooltip","color","icon","ariaLabel","isVisible","svgContent","sortable","tableScrolling","indeterminate","labelHidden"],"sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.15.0 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    const scriptElm = BUILD.scriptDataOpts\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? (scriptElm || {})['data-opts'] || {} : {};\n    if (importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n    }\n    return promiseResolve(opts);\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"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"}
+{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","border","componentId","fullWidth","truncate","value","isSelected","isOpen","alt","badge","dropdown","image","size","variant","sentiment","dot","label","large","external","fontSize","enableActions","showHandle","alignItems","auto","backgroundColor","borderColor","borderRadius","direction","display","fit","gap","flex","justifyContent","minHeight","minWidth","offset","offsetXs","offsetSm","offsetMd","offsetLg","offsetXl","padding","shadow","sizeXs","sizeSm","sizeMd","sizeLg","sizeXl","vertical","height","loading","sizes","src","srcset","width","disabled","errorMessage","helperMessage","invalid","name","placeholder","readonly","required","type","animated","fillColor","percent","showPercent","checked","colGap","noWrap","dividers","handleType","parentComponentId","index","selected","compact","responsive","fixedColumn","selectable","sortingColumn","sortingDirection","tablistLabel","activeTabName","activeTabIndex","rows","content","hasArrow","htmlContent","placement","opened","showTooltip","hideTooltip","color","icon","ariaLabel","isVisible","svgContent","sortable","tableScrolling","indeterminate","labelHidden"],"sources":["../../node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.15.0 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    const scriptElm = BUILD.scriptDataOpts\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? (scriptElm || {})['data-opts'] || {} : {};\n    if (importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n    }\n    return promiseResolve(opts);\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"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"}

package/dist/types/components/pds-progress/pds-progress.d.ts

@@ -10,7 +10,7 @@ export declare class PdsProgress {
     componentId: string;
     /**
     * Sets the progress fill color. Accepts a color token or a [valid color value](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value).
-    * @defaultValue 'var(--pds-color-primary)'
+    * @defaultValue 'var(--pine-color-blue-300)'
     */
     fillColor: string;
     /**

package/dist/types/components/pds-sortable/pds-sortable-item/pds-sortable-item.d.ts

@@ -2,6 +2,8 @@
  * @slot sortable-item-actions - Content is placed within the `pds-sortable-item__actions` element as children. This slot is only rendered if `actions` is set to `true`.
  */
 export declare class PdsSortableItem {
+    el: HTMLPdsSortableItemElement;
+    sortableRef: HTMLPdsSortableElement;
     /**
      * Determines whether `sortable-item-actions` slot should be enabled.
      * @defaultValue false
@@ -15,6 +17,7 @@ export declare class PdsSortableItem {
      * Determines whether `sortable-item` should have a handle.
      * @defaultValue false
      */
-    handle: boolean;
+    showHandle: boolean;
+    componentWillRender(): void;
     render(): any;
 }

package/dist/types/components/pds-sortable/sortable-interface.d.ts

@@ -0,0 +1,7 @@
+export interface SortableType {
+    animation: number;
+    ghostClass: string;
+    dragClass: string;
+    onEnd: (evt: Event) => void;
+    handle?: string;
+}

package/dist/types/components.d.ts

@@ -461,7 +461,7 @@ export namespace Components {
         "componentId": string;
         /**
           * Sets the progress fill color. Accepts a color token or a [valid color value](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value).
-          * @defaultValue 'var(--pds-color-primary)'
+          * @defaultValue 'var(--pine-color-blue-300)'
          */
         "fillColor": string;
         /**
@@ -590,7 +590,7 @@ export namespace Components {
           * Determines whether `sortable-item` should have a handle.
           * @defaultValue false
          */
-        "handle": boolean;
+        "showHandle": boolean;
     }
     interface PdsSwitch {
         /**
@@ -1668,7 +1668,7 @@ declare namespace LocalJSX {
         "componentId": string;
         /**
           * Sets the progress fill color. Accepts a color token or a [valid color value](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value).
-          * @defaultValue 'var(--pds-color-primary)'
+          * @defaultValue 'var(--pine-color-blue-300)'
          */
         "fillColor"?: string;
         /**
@@ -1805,7 +1805,7 @@ declare namespace LocalJSX {
           * Determines whether `sortable-item` should have a handle.
           * @defaultValue false
          */
-        "handle"?: boolean;
+        "showHandle"?: boolean;
     }
     interface PdsSwitch {
         /**