@pine-ds/core 0.2.4 → 1.0.1

package/dist/pine-core/p-51f81513.entry.js

@@ -0,0 +1,2 @@
+import{r,h as a,H as o}from"./p-2f77dbd3.js";import{c as s,u as i}from"./p-403a20e8.js";const e=":host{display:inline-block}div{--color-background-container:var(--pine-color-blue-100);--color-background-badge:var(--pine-color-white);--color-border-badge:var(--pine-color-white);--border-default:var(--pine-border-width-thin) solid var(--pine-color-grey-300);--border-radius-round:var(--pine-border-radius-round);--border-radius-none:var(--pine-border-radius-0);--spacing-none:var(--pine-spacing-0);-ms-flex-align:center;align-items:center;background-color:var(--color-background-container);border-radius:var(--border-radius-admin-round, var(--border-radius-round));display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;position:relative}:host(.pds-avatar--admin) div{--border-radius-admin-round:var(--pine-spacing-150);border-radius:var(--border-radius-admin-round)}:host(.pds-avatar--has-image) div{background:transparent}@supports selector(:has){div:has(img){background-color:transparent}}.pds-avatar__button{--box-shadow-focus:0 0 0 2px var(--pine-color-primary-200);--border-radius-round:var(--pine-border-radius-round);-ms-flex-align:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:var(--border-radius-none);border-radius:var(--border-radius-round);cursor:pointer;display:-ms-flexbox;display:flex;padding:var(--spacing-none)}.pds-avatar__button:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}.pds-avatar__badge{background-color:var(--color-background-badge);border:var(--border-default);border-color:var(--color-border-badge);border-radius:var(--border-radius-round);bottom:var(--spacing-none);position:absolute;right:var(--spacing-none)}img{border-radius:var(--border-radius-admin-round, var(--border-radius-round));height:100%;-o-object-fit:cover;object-fit:cover;width:100%}";const n=e;const t=class{constructor(o){r(this,o);this.renderAssetWrapper=()=>{const r={height:this.avatarSize(),width:this.avatarSize()};return a("div",{style:r,part:"asset-wrapper"},this.renderIconOrImage(),this.renderBadge())};this.renderAvatar=()=>this.dropdown?a("button",{class:"pds-avatar__button",type:"button"},this.renderAssetWrapper()):this.renderAssetWrapper();this.renderBadge=()=>this.badge&&a("pds-icon",{class:"pds-avatar__badge",icon:s,size:"33.53%"});this.renderIconOrImage=()=>this.image?a("img",{alt:this.alt,src:this.image}):a("pds-icon",{color:"var(--pine-color-primary-400)",icon:i,size:"33.53%"});this.classNames=()=>({"pds-avatar":true,[`pds-avatar--has-image`]:this.image!==""&&this.image!==null,[`pds-avatar--${this.variant}`]:this.variant==="admin"});this.alt=null;this.badge=false;this.componentId=undefined;this.dropdown=false;this.image=null;this.size="lg";this.variant="customer"}avatarSize(){const r={xs:"24px",sm:"32px",md:"40px",lg:"56px",xl:"64px"};if(r[this.size]){return r[this.size]}else{return this.size}}render(){return a(o,{key:"0e214f7cca56b36b49e27c8dc097acc7b34391cc",id:this.componentId,class:Object.assign({},this.classNames())},this.renderAvatar())}};t.style=n;export{t as pds_avatar};
+//# sourceMappingURL=p-51f81513.entry.js.map

package/dist/pine-core/p-51f81513.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pdsAvatarCss","PdsAvatarStyle0","PdsAvatar","this","renderAssetWrapper","style","height","avatarSize","width","h","part","renderIconOrImage","renderBadge","renderAvatar","dropdown","class","type","badge","icon","checkCircleFilled","size","image","alt","src","color","userFilled","classNames","variant","sizes","xs","sm","md","lg","xl","render","Host","key","id","componentId","Object","assign"],"sources":["src/components/pds-avatar/pds-avatar.scss?tag=pds-avatar&encapsulation=shadow","src/components/pds-avatar/pds-avatar.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n}\n\ndiv {\n  // These custom props are not reachable\n  --color-background-container: var(--pine-color-blue-100);\n  --color-background-badge: var(--pine-color-white);\n  --color-border-badge: var(--pine-color-white);\n\n  --border-default: var(--pine-border-width-thin) solid var(--pine-color-grey-300);\n  --border-radius-round: var(--pine-border-radius-round);\n  --border-radius-none: var(--pine-border-radius-0);\n\n  --spacing-none: var(--pine-spacing-0);\n\n  align-items: center;\n  background-color: var(--color-background-container);\n  border-radius: var(--border-radius-admin-round, var(--border-radius-round));\n  display: inline-flex;\n  justify-content: center;\n  position: relative;\n\n  :host(.pds-avatar--admin) & {\n    --border-radius-admin-round: var(--pine-spacing-150);\n    border-radius: var(--border-radius-admin-round);\n  }\n\n  // Remove when FF has support for :has\n  :host(.pds-avatar--has-image) & {\n    background: transparent\n  }\n\n  @supports selector(:has) {\n    &:has(img) {\n      background-color: transparent\n    }\n  }\n}\n\n.pds-avatar__button {\n  --box-shadow-focus: 0 0 0 2px var(--pine-color-primary-200);\n  --border-radius-round: var(--pine-border-radius-round);\n\n  align-items: center;\n  appearance: none;\n  background: transparent;\n  border: var(--border-radius-none);\n  border-radius: var(--border-radius-round);\n  cursor: pointer;\n  display: flex;\n  padding: var(--spacing-none);\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\n.pds-avatar__badge {\n  background-color: var(--color-background-badge);\n  border: var(--border-default);\n  border-color: var(--color-border-badge);\n  border-radius: var(--border-radius-round);\n  bottom: var(--spacing-none);\n  position: absolute;\n  right: var(--spacing-none);\n}\n\nimg {\n  border-radius: var(--border-radius-admin-round, var(--border-radius-round));\n  height: 100%;\n  object-fit: cover;\n  width: 100%;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport { checkCircleFilled, userFilled } from '@pine-ds/icons/icons';\n\n/**\n * @part image - The main image element that represents the avatar component.\n*/\n@Component({\n  tag: 'pds-avatar',\n  styleUrl: 'pds-avatar.scss',\n  shadow: true,\n})\nexport class PdsAvatar {\n\n  /**\n   * The alt for a custom user image.\n   * @defaultValue null\n   */\n  @Prop() alt?: string | null = null;\n\n  /**\n   * Determines whether the badge is visible or not.\n   * @defaultValue false\n   */\n  @Prop() badge? = false;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether the avatar functions as a dropdown trigger.\n   * @defaultValue false\n   */\n  @Prop() dropdown? = false;\n\n  /**\n   * The src for a custom user image.\n   * @defaultValue null\n   */\n  @Prop() image?: string | null = null;\n\n  /**\n   * Size of the avatar. Value can be preset or custom.\n   * @defaultValue lg\n   */\n  @Prop({ reflect: true }) size?:\n  | 'xl' // 64px\n  | 'lg' // 56px\n  | 'md' // 40px\n  | 'sm' // 32px\n  | 'xs' // 24px\n  | string = 'lg';\n\n  /**\n   * Determines the variant of avatar. Changes appearance accordingly.\n   * @defaultValue customer\n   */\n  @Prop({ reflect: true }) variant?: 'customer' | 'admin' = 'customer';\n\n  private avatarSize() {\n    const sizes: { [key: string]: any } = {\n      xs: '24px',\n      sm: '32px',\n      md: '40px',\n      lg: '56px',\n      xl: '64px',\n    }\n\n    if (sizes[this.size]) {\n      return sizes[this.size];\n    } else {\n      return this.size\n    }\n  }\n\n  private renderAssetWrapper = () => {\n    const style = {\n      height: this.avatarSize(),\n      width: this.avatarSize()\n    };\n\n    return (\n      <div style={style} part=\"asset-wrapper\">\n        {this.renderIconOrImage()}\n        {this.renderBadge()}\n      </div>\n    )\n  };\n\n  private renderAvatar = () => {\n    return (\n      this.dropdown\n        ?\n        <button class=\"pds-avatar__button\" type=\"button\">\n          {this.renderAssetWrapper()}\n        </button>\n        :\n        this.renderAssetWrapper()\n    )\n  };\n\n  private renderBadge = () => (\n    this.badge\n    // Percentage is average size of icon in relation to total avatar size\n    // of all preset sizes found in Figma.\n    // Used to allow icons to scale to container size\n      && <pds-icon class=\"pds-avatar__badge\" icon={checkCircleFilled} size=\"33.53%\"></pds-icon>\n  );\n\n  private renderIconOrImage = () => (\n    this.image\n      ? <img alt={this.alt} src={this.image} />\n      // Percentage is average size of icon in relation to total avatar size\n      // of all preset sizes found in Figma.\n      // Used to allow icons to scale to container size\n      : <pds-icon color=\"var(--pine-color-primary-400)\" icon={userFilled} size=\"33.53%\"></pds-icon>\n  );\n\n  private classNames = () => (\n    {\n      'pds-avatar': true,\n      [`pds-avatar--has-image`]: this.image !== '' && this.image !== null, // Remove when FF supports :has selector\n      [`pds-avatar--${this.variant}`]: this.variant === 'admin'\n    }\n  );\n\n  render() {\n\n    return (\n      <Host\n        id={this.componentId}\n        class={{...this.classNames()}}\n      >\n        {this.renderAvatar()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"wFAAA,MAAMA,EAAe,4zDACrB,MAAAC,EAAeD,E,MCUFE,EAAS,M,yBAiEZC,KAAAC,mBAAqB,KAC3B,MAAMC,EAAQ,CACZC,OAAQH,KAAKI,aACbC,MAAOL,KAAKI,cAGd,OACEE,EAAA,OAAKJ,MAAOA,EAAOK,KAAK,iBACrBP,KAAKQ,oBACLR,KAAKS,cACF,EAIFT,KAAAU,aAAe,IAEnBV,KAAKW,SAEHL,EAAA,UAAQM,MAAM,qBAAqBC,KAAK,UACrCb,KAAKC,sBAGRD,KAAKC,qBAIHD,KAAAS,YAAc,IACpBT,KAAKc,OAIAR,EAAA,YAAUM,MAAM,oBAAoBG,KAAMC,EAAmBC,KAAK,WAGjEjB,KAAAQ,kBAAoB,IAC1BR,KAAKkB,MACDZ,EAAA,OAAKa,IAAKnB,KAAKmB,IAAKC,IAAKpB,KAAKkB,QAI9BZ,EAAA,YAAUe,MAAM,gCAAgCN,KAAMO,EAAYL,KAAK,WAGrEjB,KAAAuB,WAAa,MAEjB,aAAc,KACd,CAAC,yBAA0BvB,KAAKkB,QAAU,IAAMlB,KAAKkB,QAAU,KAC/D,CAAC,eAAelB,KAAKwB,WAAYxB,KAAKwB,UAAY,U,SA1GxB,K,WAMb,M,yCAWG,M,WAMY,K,UAYrB,K,aAM+C,U,CAElD,UAAApB,GACN,MAAMqB,EAAgC,CACpCC,GAAI,OACJC,GAAI,OACJC,GAAI,OACJC,GAAI,OACJC,GAAI,QAGN,GAAIL,EAAMzB,KAAKiB,MAAO,CACpB,OAAOQ,EAAMzB,KAAKiB,K,KACb,CACL,OAAOjB,KAAKiB,I,EAuDhB,MAAAc,GAEE,OACEzB,EAAC0B,EAAI,CAAAC,IAAA,2CACHC,GAAIlC,KAAKmC,YACTvB,MAAKwB,OAAAC,OAAA,GAAMrC,KAAKuB,eAEfvB,KAAKU,e"}

package/dist/pine-core/p-5df59e63.system.entry.js

@@ -0,0 +1,2 @@
+System.register(["./p-64b4cb70.system.js","./p-674edd62.system.js"],(function(e){"use strict";var r,a,s,i,t;return{setters:[function(e){r=e.r;a=e.h;s=e.H;i=e.g},function(e){t=e.h}],execute:function(){var d=".pds-sortable-item.sc-pds-sortable-item-h{--border-radius:var(--pine-border-radius-125);--border-default:var(--pine-border-width-thin) solid var(--pine-color-grey-300);--box-shadow:var(--pine-box-shadow-lg);--color-background-default:var(--pine-color-white);--color-background-interactive:var(--pine-color-grey-200);--color-interactive-handle:var(--pine-color-blue-300);--spacing-margin-inline-end:var(--pine-spacing-300);--spacing-padding-block-xs:var(--pine-spacing-100);--spacing-padding-inline:var(--pine-spacing-300);--spacing-padding-inline-start:var(--pine-spacing-300);-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;padding-block:var(--spacing-padding-block-xs);padding-inline:var(--spacing-padding-inline)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__actions.sc-pds-sortable-item{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-padding-start:var(--spacing-padding-inline-start);padding-inline-start:var(--spacing-padding-inline-start)}.pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{line-height:1;-webkit-margin-end:var(--spacing-margin-inline-end);margin-inline-end:var(--spacing-margin-inline-end)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:first-child{border-start-end-radius:var(--border-radius);border-start-start-radius:var(--border-radius)}.pds-sortable--bordered .pds-sortable-item.sc-pds-sortable-item-h:last-child{border-end-end-radius:var(--border-radius);border-end-start-radius:var(--border-radius)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h{-webkit-border-after:var(--border-default);border-block-end:var(--border-default)}.pds-sortable--divided .pds-sortable-item.sc-pds-sortable-item-h:last-child{-webkit-border-after:0;border-block-end:0}.pds-sortable--handle-type-row .pds-sortable-item.sc-pds-sortable-item-h{cursor:-webkit-grab;cursor:grab}.pds-sortable--handle-type-handle .pds-sortable-item.sc-pds-sortable-item-h .pds-sortable-item__handle.sc-pds-sortable-item{cursor:-webkit-grab;cursor:grab}.pds-sortable-item.sc-pds-sortable-item-h:hover{background-color:var(--color-background-interactive)}.pds-sortable-item.sc-pds-sortable-item-h:hover pds-icon.sc-pds-sortable-item{color:var(--color-interactive-handle)}.pds-sortable-item--drag.sc-pds-sortable-item-h{background-color:var(--color-background-default);border-radius:0;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);opacity:1}.pds-sortable-item--ghost.sc-pds-sortable-item-h{background-color:var(--color-background-interactive);border-radius:0}";var o=d;var n=e("pds_sortable_item",function(){function e(e){r(this,e);this.enableActions=false;this.componentId=undefined;this.showHandle=false}e.prototype.componentWillRender=function(){this.sortableRef=this.el.closest("pds-sortable");if(this.sortableRef&&this.sortableRef.handleType==="handle"){this.showHandle=true}};e.prototype.render=function(){return a(s,{key:"61c57ebc93b66e4c8777fe52163c2c7f600361a5",class:"pds-sortable-item",id:this.componentId},this.showHandle&&a("div",{key:"f2bafa535db6cfa07113bd8f9a32d5b7a0bc694d",class:"pds-sortable-item__handle"},a("pds-icon",{key:"9ead72e13f881f9cdbe4cb910de09173c42c96c5",icon:t})),a("slot",{key:"7322ce5649cd2f7765d9275ec47317570854e5f9"}),this.enableActions&&a("div",{key:"709a91c4160407b491fb7ed44c7c7c0a9e980262",class:"pds-sortable-item__actions"},a("slot",{key:"280ed68aec92927b2a79581f56d3905188a27f1a",name:"sortable-item-actions"})))};Object.defineProperty(e.prototype,"el",{get:function(){return i(this)},enumerable:false,configurable:true});return e}());n.style=o}}}));
+//# sourceMappingURL=p-5df59e63.system.entry.js.map

package/dist/pine-core/p-5df59e63.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pdsSortableItemCss","PdsSortableItemStyle0","PdsSortableItem","exports","class_1","prototype","componentWillRender","this","sortableRef","el","closest","handleType","showHandle","render","h","Host","key","class","id","componentId","icon","handleIcon","enableActions","name"],"sources":["src/components/pds-sortable/pds-sortable-item/pds-sortable-item.scss?tag=pds-sortable-item&encapsulation=scoped","src/components/pds-sortable/pds-sortable-item/pds-sortable-item.tsx"],"sourcesContent":[":host(.pds-sortable-item) {\n  --border-radius: var(--pine-border-radius-125);\n\n  --border-default: var(--pine-border-width-thin) solid var(--pine-color-grey-300);\n\n  --box-shadow: var(--pine-box-shadow-lg);\n\n  --color-background-default: var(--pine-color-white);\n  --color-background-interactive: var(--pine-color-grey-200);\n  --color-interactive-handle: var(--pine-color-blue-300);\n\n  --spacing-margin-inline-end: var(--pine-spacing-300);\n  --spacing-padding-block-xs: var(--pine-spacing-100);\n  --spacing-padding-inline: var(--pine-spacing-300);\n  --spacing-padding-inline-start: var(--pine-spacing-300);\n\n  align-items: center;\n  display: flex;\n  padding-block: var(--spacing-padding-block-xs);\n  padding-inline: var(--spacing-padding-inline);\n\n  .pds-sortable-item__actions {\n    margin-inline-start: auto;\n    padding-inline-start: var(--spacing-padding-inline-start);\n  }\n\n  .pds-sortable-item__handle {\n    line-height: 1;\n    margin-inline-end: var(--spacing-margin-inline-end);\n  }\n\n  // styles when sortable is bordered\n  .pds-sortable--bordered & {\n    &:first-child {\n      border-start-end-radius: var(--border-radius);\n      border-start-start-radius: var(--border-radius);\n    }\n\n    &:last-child {\n      border-end-end-radius: var(--border-radius);\n      border-end-start-radius: var(--border-radius);\n    }\n  }\n\n  // styles when sortable is divided\n  .pds-sortable--divided & {\n    border-block-end: var(--border-default);\n\n    &:last-child {\n      border-block-end: 0;\n    }\n  }\n\n  // cursor styles based on handle-type\n  .pds-sortable--handle-type-row & {\n    cursor: grab;\n  }\n\n  .pds-sortable--handle-type-handle & {\n    .pds-sortable-item__handle {\n      cursor: grab;\n    }\n  }\n}\n\n:host(.pds-sortable-item):hover {\n  background-color: var(--color-background-interactive);\n\n  pds-icon {\n    color: var(--color-interactive-handle)\n  }\n}\n\n:host(.pds-sortable-item--drag) {\n  background-color: var(--color-background-default);\n  border-radius: 0;\n  box-shadow: var(--box-shadow);\n  opacity: 1;\n}\n\n:host(.pds-sortable-item--ghost) {\n  background-color: var(--color-background-interactive);\n  border-radius: 0;\n}\n","import { Component, Element, Host, h, Prop } from '@stencil/core';\n\nimport { handle as handleIcon } from '@pine-ds/icons/icons';\n/**\n * @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`.\n */\n@Component({\n  tag: 'pds-sortable-item',\n  styleUrl: 'pds-sortable-item.scss',\n  scoped: true,\n})\nexport class PdsSortableItem {\n  @Element() el: HTMLPdsSortableItemElement;\n  sortableRef: HTMLPdsSortableElement;\n  /**\n   * Determines whether `sortable-item-actions` slot should be enabled.\n   * @defaultValue false\n   */\n  @Prop() enableActions = false;\n\n  /**\n   * A unique identifier used for the sortable item `id` attribute.\n   */\n  @Prop() componentId: string;\n\n  /**\n   * Determines whether `sortable-item` should have a handle.\n   * @defaultValue false\n   */\n  @Prop({ mutable: true }) showHandle = false;\n\n  componentWillRender() {\n    // When the parent sortable has a type of 'handle', the sortable items\n    // will automatically set showHandle to 'true'.\n    this.sortableRef = this.el.closest('pds-sortable') as HTMLPdsSortableElement;\n\n    if (this.sortableRef && this.sortableRef.handleType === 'handle') {\n      this.showHandle = true;\n    }\n  }\n\n  render() {\n    return (\n      <Host class=\"pds-sortable-item\" id={this.componentId}>\n        {this.showHandle && (\n          <div class=\"pds-sortable-item__handle\">\n            <pds-icon icon={handleIcon}></pds-icon>\n          </div>\n        )}\n        <slot></slot>\n        {this.enableActions && (\n          <div class=\"pds-sortable-item__actions\">\n            <slot name=\"sortable-item-actions\" />\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"wMAAA,IAAMA,EAAqB,kiFAC3B,IAAAC,EAAeD,E,ICUFE,EAAeC,EAAA,+B,2CAOF,M,2CAWc,K,CAEtCC,EAAAC,UAAAC,oBAAA,WAGEC,KAAKC,YAAcD,KAAKE,GAAGC,QAAQ,gBAEnC,GAAIH,KAAKC,aAAeD,KAAKC,YAAYG,aAAe,SAAU,CAChEJ,KAAKK,WAAa,I,GAItBR,EAAAC,UAAAQ,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAM,oBAAoBC,GAAIX,KAAKY,aACtCZ,KAAKK,YACJE,EAAA,OAAAE,IAAA,2CAAKC,MAAM,6BACTH,EAAA,YAAAE,IAAA,2CAAUI,KAAMC,KAGpBP,EAAA,QAAAE,IAAA,6CACCT,KAAKe,eACJR,EAAA,OAAAE,IAAA,2CAAKC,MAAM,8BACTH,EAAA,QAAAE,IAAA,2CAAMO,KAAK,2B,uHAzCK,I"}

package/dist/pine-core/p-5f2b3f57.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as s,H as c,g as o}from"./p-2f77dbd3.js";const i=":host{--color-background-fixed:var(--pine-color-white);--color-background-interactive:var(--pine-color-grey-200);border-color:inherit;display:table-row;vertical-align:inherit}:host::part(checkbox-cell){background-color:var(--color-background-fixed);left:0;position:-webkit-sticky;position:sticky;z-index:1}:host(:hover),:host(:hover)::part(checkbox-cell),:host(:hover) ::slotted(pds-table-cell),:host(.is-selected),:host(.is-selected)::part(checkbox-cell),:host(.is-selected) ::slotted(pds-table-cell){background:var(--color-background-interactive)}";const l=i;const r=class{constructor(s){e(this,s);this.pdsTableRowSelected=t(this,"pdsTableRowSelected",7);this.handleCheckboxClick=()=>{this.isSelected=!this.isSelected;const e=Array.from(this.hostElement.parentNode.children).indexOf(this.hostElement);this.pdsTableRowSelected.emit({rowIndex:e,isSelected:this.isSelected})};this.generateUniqueId=()=>{const e=Math.random().toString(36).substring(2,8);const t=(new Date).toISOString().replace(/[:.]/g,"-");const s=`${e}-${t}`;return s};this.isSelected=false}classNames(){const e=[];if(this.isSelected){e.push("is-selected")}return e.join("  ")}componentWillRender(){this.tableRef=this.hostElement.closest("pds-table");if(this.tableRef&&this.tableRef.fixedColumn){const e=this.hostElement.querySelector("pds-table-cell");e===null||e===void 0?void 0:e.classList.add("is-fixed")}}render(){return s(c,{key:"9ef478c127a101b918e3e444109a0a3b72d809d6",class:this.classNames(),role:"row"},this.tableRef&&this.tableRef.selectable&&s("pds-table-cell",{key:"f7ecba3776fe1a5606ea66bc43f495e03635803f",part:this.tableRef.fixedColumn?"checkbox-cell":"",class:this.tableRef.selectable?"has-checkbox":""},s("pds-checkbox",{key:"6e4ebaa953542cb476f141818375b3ba8b490b2c",componentId:this.generateUniqueId(),onClick:this.handleCheckboxClick,label:"Select Row",labelHidden:true,checked:this.isSelected})),s("slot",{key:"4ccbd6b1a81d420dec05acb4f7a404ee670959b3"}))}get hostElement(){return o(this)}};r.style=l;export{r as pds_table_row};
+//# sourceMappingURL=p-5f2b3f57.entry.js.map

package/dist/pine-core/p-5f2b3f57.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pdsTableRowCss","PdsTableRowStyle0","PdsTableRow","this","handleCheckboxClick","isSelected","selectedIndex","Array","from","hostElement","parentNode","children","indexOf","pdsTableRowSelected","emit","rowIndex","generateUniqueId","randomString","Math","random","toString","substring","timestamp","Date","toISOString","replace","uniqueId","classNames","push","join","componentWillRender","tableRef","closest","fixedColumn","tableCell","querySelector","classList","add","render","h","Host","key","class","role","selectable","part","componentId","onClick","label","labelHidden","checked"],"sources":["src/components/pds-table/pds-table-row/pds-table-row.scss?tag=pds-table-row&encapsulation=shadow","src/components/pds-table/pds-table-row/pds-table-row.tsx"],"sourcesContent":[":host {\n  --color-background-fixed: var(--pine-color-white);\n  --color-background-interactive: var(--pine-color-grey-200);\n\n  border-color: inherit;\n  display: table-row;\n  vertical-align: inherit;\n\n  // used for pds-checkbox-cell\n  // because it is in the ShadowDom\n  &::part(checkbox-cell) {\n    background-color: var(--color-background-fixed);\n    left: 0;\n    position: sticky;\n    z-index: 1;\n  }\n}\n\n:host(:hover),\n:host(:hover)::part(checkbox-cell),\n:host(:hover) ::slotted(pds-table-cell),\n:host(.is-selected),\n:host(.is-selected)::part(checkbox-cell),\n:host(.is-selected) ::slotted(pds-table-cell) {\n  background: var(--color-background-interactive);\n}\n","import { Component, Element, Host, h, Event, EventEmitter, State } from '@stencil/core';\n\n@Component({\n  tag: 'pds-table-row',\n  styleUrl: 'pds-table-row.scss',\n  shadow: true,\n})\nexport class PdsTableRow {\n  @Element() hostElement: HTMLPdsTableRowElement;\n  tableRef: HTMLPdsTableElement;\n\n  /**\n   * Event that is emitted when the checkbox is clicked, carrying the selected value.\n   */\n  @Event() pdsTableRowSelected: EventEmitter<{ rowIndex: number; isSelected: boolean; }>;\n\n  /**\n   * A local state to track whether the row is currently selected.\n   */\n  @State() isSelected: boolean = false;\n\n  private handleCheckboxClick = () => {\n    this.isSelected = !this.isSelected; // Toggle the selected state\n    const selectedIndex = Array.from(this.hostElement.parentNode.children).indexOf(this.hostElement);\n    this.pdsTableRowSelected.emit({ rowIndex: selectedIndex, isSelected: this.isSelected });\n  }\n\n  private classNames() {\n    const classNames = [];\n\n    if (this.isSelected) {\n      classNames.push(\"is-selected\");\n    }\n\n    return classNames.join('  ');\n  }\n\n  componentWillRender() {\n    this.tableRef = this.hostElement.closest('pds-table') as HTMLPdsTableElement;\n\n    if (this.tableRef && this.tableRef.fixedColumn) {\n      const tableCell = this.hostElement.querySelector('pds-table-cell');\n      tableCell?.classList.add(\"is-fixed\");\n    }\n  }\n\n  private generateUniqueId = () => {\n    const randomString = Math.random().toString(36).substring(2, 8);\n    const timestamp = new Date().toISOString().replace(/[:.]/g, '-');\n    const uniqueId = `${randomString}-${timestamp}`;\n\n    return uniqueId;\n  }\n\n  render() {\n    return (\n      <Host\n        class={this.classNames()}\n        role=\"row\"\n      >\n        {this.tableRef && this.tableRef.selectable && (\n          <pds-table-cell part={this.tableRef.fixedColumn ? 'checkbox-cell' : ''} class={this.tableRef.selectable ? 'has-checkbox' : ''} >\n            <pds-checkbox\n              componentId={this.generateUniqueId()}\n              onClick={this.handleCheckboxClick}\n              label={\"Select Row\"}\n              labelHidden={true}\n              checked={this.isSelected}\n            />\n          </pds-table-cell>\n        )}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAiB,wiBACvB,MAAAC,EAAeD,E,MCMFE,EAAW,M,kFAcdC,KAAAC,oBAAsB,KAC5BD,KAAKE,YAAcF,KAAKE,WACxB,MAAMC,EAAgBC,MAAMC,KAAKL,KAAKM,YAAYC,WAAWC,UAAUC,QAAQT,KAAKM,aACpFN,KAAKU,oBAAoBC,KAAK,CAAEC,SAAUT,EAAeD,WAAYF,KAAKE,YAAa,EAsBjFF,KAAAa,iBAAmB,KACzB,MAAMC,EAAeC,KAAKC,SAASC,SAAS,IAAIC,UAAU,EAAG,GAC7D,MAAMC,GAAY,IAAIC,MAAOC,cAAcC,QAAQ,QAAS,KAC5D,MAAMC,EAAW,GAAGT,KAAgBK,IAEpC,OAAOI,CAAQ,E,gBAhCc,K,CAQvB,UAAAC,GACN,MAAMA,EAAa,GAEnB,GAAIxB,KAAKE,WAAY,CACnBsB,EAAWC,KAAK,c,CAGlB,OAAOD,EAAWE,KAAK,K,CAGzB,mBAAAC,GACE3B,KAAK4B,SAAW5B,KAAKM,YAAYuB,QAAQ,aAEzC,GAAI7B,KAAK4B,UAAY5B,KAAK4B,SAASE,YAAa,CAC9C,MAAMC,EAAY/B,KAAKM,YAAY0B,cAAc,kBACjDD,IAAS,MAATA,SAAS,SAATA,EAAWE,UAAUC,IAAI,W,EAY7B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAOvC,KAAKwB,aACZgB,KAAK,OAEJxC,KAAK4B,UAAY5B,KAAK4B,SAASa,YAC9BL,EAAA,kBAAAE,IAAA,2CAAgBI,KAAM1C,KAAK4B,SAASE,YAAc,gBAAkB,GAAIS,MAAOvC,KAAK4B,SAASa,WAAa,eAAiB,IACzHL,EAAA,gBAAAE,IAAA,2CACEK,YAAa3C,KAAKa,mBAClB+B,QAAS5C,KAAKC,oBACd4C,MAAO,aACPC,YAAa,KACbC,QAAS/C,KAAKE,cAIpBkC,EAAA,QAAAE,IAAA,6C"}

package/dist/pine-core/p-61ab207f.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as i,h as o,H as r,g as a}from"./p-2f77dbd3.js";import{m as s,P as t,a as d}from"./p-e4f30321.js";const n=':host{--border-default:var(--pine-border-width-thin) solid var(--pine-color-grey-400);--border-color-interactive-hover:var(--pine-border-width-thin) solid var(--pine-color-grey-500);--border-radius:var(--pine-border-radius-050);--box-shadow-focus:0 0 0 2px var(--pine-color-blue-200);--box-shadow-focus-invalid:0 0 0 2px var(--pine-color-red-200);--color-background:var(--pine-color-white);--color-background-disabled:var(--pine-color-grey-200);--color-background-hover:var(--pine-color-grey-100);--color-border-disabled:var(--pine-color-charcoal-100);--color-border-icon:var(--pine-color-white);--color-checked:var(--pine-color-charcoal-500);--color-disabled:var(--pine-color-grey-300);--color-invalid:var(--pine-color-red-300);--color-text-disabled:var(--pine-color-grey-500);--color-text-message:var(--pine-color-charcoal-200);--sizing-input:var(--pine-font-size-100);-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;-ms-flex-flow:row wrap;flex-flow:row wrap}:host(.is-invalid) input{border-color:var(--color-invalid)}:host(.is-invalid) input:checked{background:var(--color-invalid)}:host(.is-invalid) input:focus-visible{-webkit-box-shadow:var(--box-shadow-focus-invalid);box-shadow:var(--box-shadow-focus-invalid);outline:none}:host(.is-invalid) label,:host(.is-invalid) .pds-checkbox__message--error{color:var(--color-invalid)}:host(.is-indeterminate) input:checked::after{border-bottom:0;-webkit-transform:rotate(87deg) translate3d(-114%, 25%, 0);transform:rotate(87deg) translate3d(-114%, 25%, 0)}input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--color-background);border:var(--border-default);border-radius:var(--border-radius);height:var(--sizing-input);margin:0;position:relative;width:var(--sizing-input)}input:hover{background:var(--color-background-hover);border:var(--border-color-interactive-hover)}input:checked{background:var(--color-checked);border-color:var(--color-checked)}input:checked::after{border:1px solid var(--color-border-icon);border-left:0;border-top:0;content:"";display:block;height:7px;left:50%;position:absolute;top:50%;-webkit-transform:rotate(43deg) translate3d(-110%, -30%, 0);transform:rotate(43deg) translate3d(-110%, -30%, 0);width:4px}input:disabled{background:var(--color-background-disabled);border-color:var(--color-disabled);cursor:not-allowed}input:disabled:checked{background:var(--color-disabled);border-color:var(--color-disabled)}input:disabled:checked::after{border-color:var(--color-border-disabled)}input:disabled+label{color:var(--color-text-disabled);cursor:not-allowed}input:disabled~.pds-checkbox__message{color:var(--color-text-disabled)}input:focus-visible{-webkit-box-shadow:var(--box-shadow-focus);box-shadow:var(--box-shadow-focus);outline:none}label{-webkit-margin-start:10px;margin-inline-start:10px}.visually-hidden{border:0;clip:rect(0 0 0 0);-webkit-clip-path:polygon(0 0, 0 0, 0 0);clip-path:polygon(0 0, 0 0, 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pds-checkbox__message{color:var(--color-text-message);font-size:14px;-webkit-margin-before:6px;margin-block-start:6px;-webkit-margin-start:26px;margin-inline-start:26px;width:100%}';const c=n;const l=class{constructor(o){e(this,o);this.pdsCheckboxChange=i(this,"pdsCheckboxChange",7);this.handleCheckboxChange=e=>{if(this.disabled){return}const i=e.target;this.checked=i.checked;this.pdsCheckboxChange.emit({checked:i.checked,value:this.value})};this.checked=undefined;this.componentId=undefined;this.disabled=undefined;this.errorMessage=undefined;this.helperMessage=undefined;this.indeterminate=undefined;this.invalid=undefined;this.label=undefined;this.labelHidden=undefined;this.name=undefined;this.required=undefined;this.value=undefined}classNames(){const e=[];if(this.invalid){e.push("is-invalid")}if(this.indeterminate){e.push("is-indeterminate")}if(this.disabled){e.push("is-disabled")}return e.join("  ")}render(){return o(r,{key:"6353e355fefe987180b1cb5b00af00e92c8f0c44",class:this.classNames()},o("input",{key:"16f720ba2c5cad01f8d29456e3ecbc8e4cbb1ce8","aria-describedby":d(this.componentId,this.invalid,this.helperMessage),"aria-invalid":this.invalid?"true":undefined,type:"checkbox",id:this.componentId,name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,onChange:this.handleCheckboxChange}),o(t,{key:"8de98b79b9390c392a2bf41173ac97e4e2f4d5e2",htmlFor:this.componentId,text:this.label,classNames:this.labelHidden?"visually-hidden":""}),this.helperMessage&&o("div",{key:"02f61d5598e4da36f3c87cbb23863d0a485e3542",class:"pds-checkbox__message",id:s(this.componentId,"helper")},this.helperMessage),this.errorMessage&&o("div",{key:"4628f5df5aeeda30f53c327abf62d1125d3eb441",class:`pds-checkbox__message pds-checkbox__message--error`,id:s(this.componentId,"error"),"aria-live":"assertive"},this.errorMessage))}};l.style=c;const h=":host{--box-shadow-fixed:3px 3px 6px -2px rgba(0, 0, 0, 0.2);--color-background-fixed:var(--pine-color-white);--color-cell-default:var(--pine-color-charcoal-200);--dimension-fixed-cell-position:0;--dimension-max-width-truncated:100px;--font-size-cell-default:var(--pine-font-size-087);--number-fixed-column-index:0;--spacing-line-height-cell-default:var(--pine-line-height-125);--spacing-padding-cell-default:calc(var(--pine-spacing-300) / 2);--spacing-padding-compact:var(--pine-spacing-050);color:var(--color-cell-default);display:table-cell;font-size:var(--font-size-cell-default);line-height:var(--spacing-line-height-cell-default);padding:var(--spacing-padding-cell-default);vertical-align:inherit}:host(.is-compact){padding-block:var(--spacing-padding-compact)}:host(.is-fixed){background:var(--color-background-fixed);left:var(--dimension-fixed-cell-position);position:-webkit-sticky;position:sticky;z-index:1}:host(.has-scrolled.is-fixed){-webkit-box-shadow:var(--box-shadow-fixed);box-shadow:var(--box-shadow-fixed)}:host(.is-truncated){max-width:var(--dimension-max-width-truncated);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.has-checkbox){vertical-align:middle;width:16px}";const b=h;const p=class{constructor(i){e(this,i);this.handleScroll=()=>{if(this.tableRef.scrollLeft>0){this.tableScrolling=true}else{this.tableScrolling=false}};this.truncate=undefined;this.tableScrolling=false}componentWillRender(){this.tableRef=this.hostElement.closest("pds-table")}componentDidLoad(){if(this.tableRef&&this.tableRef.responsive&&this.tableRef.fixedColumn){this.tableRef.addEventListener("scroll",this.handleScroll)}}classNames(){const e=[];if(this.tableRef&&this.tableRef.compact){e.push("is-compact")}if(this.truncate){e.push("is-truncated")}if(this.tableRef&&this.tableRef.fixedColumn&&this.tableScrolling){e.push("has-scrolled")}return e.join(" ")}render(){return o(r,{key:"7c7f228b3911eec633c6ffd817f22fbc6666be8a",class:this.classNames(),role:"gridcell",style:this.tableRef&&this.tableRef.fixedColumn&&this.tableRef.selectable?{"--fixed-cell-position":"40px"}:{}},o("slot",{key:"37c43f300478beffc41d2450bbb5a6e13099f58e"}))}get hostElement(){return a(this)}};p.style=b;export{l as pds_checkbox,p as pds_table_cell};
+//# sourceMappingURL=p-61ab207f.entry.js.map

package/dist/pine-core/p-61ab207f.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pdsCheckboxCss","PdsCheckboxStyle0","PdsCheckbox","this","handleCheckboxChange","e","disabled","target","checked","pdsCheckboxChange","emit","value","classNames","invalid","push","indeterminate","join","render","h","Host","key","class","assignDescription","componentId","helperMessage","undefined","type","id","name","required","onChange","PdsLabel","htmlFor","text","label","labelHidden","messageId","errorMessage","pdsTableCellCss","PdsTableCellStyle0","PdsTableCell","handleScroll","tableRef","scrollLeft","tableScrolling","componentWillRender","hostElement","closest","componentDidLoad","responsive","fixedColumn","addEventListener","compact","truncate","role","style","selectable"],"sources":["src/components/pds-checkbox/pds-checkbox.scss?tag=pds-checkbox&encapsulation=shadow","src/components/pds-checkbox/pds-checkbox.tsx","src/components/pds-table/pds-table-cell/pds-table-cell.scss?tag=pds-table-cell&encapsulation=shadow","src/components/pds-table/pds-table-cell/pds-table-cell.tsx"],"sourcesContent":[":host {\n  --border-default: var(--pine-border-width-thin) solid var(--pine-color-grey-400);\n\n  --border-color-interactive-hover: var(--pine-border-width-thin) solid var(--pine-color-grey-500);\n\n  --border-radius: var(--pine-border-radius-050);\n\n  --box-shadow-focus: 0 0 0 2px var(--pine-color-blue-200);\n  --box-shadow-focus-invalid: 0 0 0 2px var(--pine-color-red-200);\n\n  --color-background: var(--pine-color-white);\n  --color-background-disabled: var(--pine-color-grey-200);\n  --color-background-hover: var(--pine-color-grey-100);\n  --color-border-disabled: var(--pine-color-charcoal-100);\n  --color-border-icon: var(--pine-color-white);\n  --color-checked: var(--pine-color-charcoal-500);\n  --color-disabled: var(--pine-color-grey-300);\n  --color-invalid: var(--pine-color-red-300);\n  --color-text-disabled: var(--pine-color-grey-500);\n  --color-text-message: var(--pine-color-charcoal-200);\n\n  --sizing-input: var(--pine-font-size-100);\n\n  align-items: center;\n  display: flex;\n  flex-flow: row wrap;\n}\n\n:host(.is-invalid) {\n  input {\n    border-color: var(--color-invalid);\n\n    &:checked {\n      background: var(--color-invalid);\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-invalid); // Remove when outline radius is supported in Safari\n      outline: none;\n    }\n  }\n\n  label,\n  .pds-checkbox__message--error {\n    color: var(--color-invalid);\n  }\n}\n\n:host(.is-indeterminate) {\n  input:checked {\n    &::after {\n      border-bottom: 0;\n      transform: rotate(87deg) translate3d(-114%, 25%, 0);\n    }\n  }\n}\n\ninput {\n  appearance: none;\n  background-color: var(--color-background);\n  border: var(--border-default);\n  border-radius: var(--border-radius);\n  height: var(--sizing-input);\n  margin: 0;\n  position: relative;\n  width: var(--sizing-input);\n\n  &:hover {\n    background: var(--color-background-hover);\n    border: var(--border-color-interactive-hover);\n  }\n\n  &:checked {\n    background: var(--color-checked);\n    border-color: var(--color-checked);\n\n    &::after {\n      border: 1px solid var(--color-border-icon);\n      border-left: 0;\n      border-top: 0;\n      content: \"\";\n      display: block;\n      height: 7px;\n      left: 50%;\n      position: absolute;\n      top: 50%;\n      transform: rotate(43deg) translate3d(-110%, -30%, 0);\n      width: 4px;\n    }\n  }\n\n  &:disabled {\n    background: var(--color-background-disabled);\n    border-color: var(--color-disabled);\n    cursor: not-allowed;\n\n    &:checked {\n      background: var(--color-disabled);\n      border-color: var(--color-disabled);\n\n      &::after {\n        border-color: var(--color-border-disabled);\n      }\n    }\n\n    + label {\n      color: var(--color-text-disabled);\n      cursor: not-allowed;\n    }\n\n    ~ .pds-checkbox__message {\n      color: var(--color-text-disabled);\n    }\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\nlabel {\n  margin-inline-start: 10px;\n}\n\n.visually-hidden {\n  border: 0;\n  clip: rect(0 0 0 0);\n  clip-path: polygon(0 0, 0 0, 0 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n.pds-checkbox__message {\n  color: var(--color-text-message);\n  font-size: 14px;\n  margin-block-start: 6px;\n  margin-inline-start: 26px;\n  width: 100%;\n}\n","import { Component, h, Prop, Host, Event, EventEmitter } from '@stencil/core';\nimport { assignDescription, messageId } from '../../utils/form';\nimport { PdsLabel } from '../_internal/pds-label/pds-label';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\n\n@Component({\n  tag: 'pds-checkbox',\n  styleUrl: 'pds-checkbox.scss',\n  shadow: true,\n})\nexport class PdsCheckbox {\n  /**\n   * It determines whether or not the checkbox is checked.\n   */\n  @Prop({ mutable: true }) checked: boolean;\n\n  /**\n   * A unique identifier used for the underlying component `id` attribute and the label `for` attribute.\n   */\n  @Prop() componentId!: string;\n\n  /**\n   * It determines whether or not the checkbox is disabled.\n   */\n  @Prop() disabled: boolean;\n\n  /**\n   * Displays message text describing an invalid state.\n   */\n  @Prop() errorMessage: string;\n\n  /**\n   * String used for helper message below checkbox.\n   */\n  @Prop() helperMessage: string;\n\n  /**\n   * If `true`, the checkbox will visually appear as indeterminate.\n   * Only JavaScript can set the objects `indeterminate` property. See [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes).\n   */\n  @Prop() indeterminate: boolean;\n\n  /**\n   * It determines whether or not the checkbox is invalid.\n   */\n  @Prop() invalid: boolean;\n\n  /**\n   * String used for label text next to checkbox.\n   */\n  @Prop() label: string;\n\n    /**\n   * Visually hides the label text for instances where only the checkbox should be displayed. Label remains accessible to assistive technology such as screen readers.\n   */\n    @Prop() labelHidden: boolean;\n\n  /**\n   * String used for checkbox `name` attribute.\n   */\n  @Prop() name: string;\n\n  /**\n   * It determines whether or not the checkbox is required.\n   */\n  @Prop() required: boolean;\n\n  /**\n   * The value of the checkbox that is submitted with a form.\n   */\n  @Prop() value: string;\n\n  /**\n   * Event emitted that contains the `value` and `checked`.\n   */\n  @Event() pdsCheckboxChange: EventEmitter<CheckboxChangeEventDetail>;\n\n  private handleCheckboxChange = (e: Event) => {\n    if (this.disabled) {\n      return;\n    }\n\n    const target = e.target as HTMLInputElement;\n    this.checked = target.checked;\n\n    this.pdsCheckboxChange.emit({\n      checked: target.checked,\n      value: this.value\n    });\n  }\n\n  private classNames() {\n    const classNames = [];\n\n    if (this.invalid) { classNames.push('is-invalid'); }\n    if (this.indeterminate) { classNames.push('is-indeterminate'); }\n    if (this.disabled) { classNames.push('is-disabled'); }\n\n    return classNames.join('  ');\n  }\n\n  render() {\n    return (\n      <Host class={this.classNames()}>\n        <input\n          aria-describedby={assignDescription(this.componentId, this.invalid, this.helperMessage)}\n          aria-invalid={this.invalid ? \"true\" : undefined}\n          type=\"checkbox\"\n          id={this.componentId}\n          name={this.name}\n          value={this.value}\n          checked={this.checked}\n          required={this.required}\n          disabled={this.disabled}\n          onChange={this.handleCheckboxChange}\n        />\n        <PdsLabel htmlFor={this.componentId} text={this.label} classNames={this.labelHidden ? 'visually-hidden' : ''} />\n        {this.helperMessage &&\n          <div\n            class={'pds-checkbox__message'}\n            id={messageId(this.componentId, 'helper')}\n          >\n            {this.helperMessage}\n          </div>\n        }\n        {this.errorMessage &&\n          <div\n            class={`pds-checkbox__message pds-checkbox__message--error`}\n            id={messageId(this.componentId, 'error')}\n            aria-live=\"assertive\"\n          >\n            {this.errorMessage}\n          </div>\n        }\n      </Host>\n    );\n  }\n}\n",":host {\n  --box-shadow-fixed: 3px 3px 6px -2px rgba(0, 0, 0, 0.2);\n\n  --color-background-fixed: var(--pine-color-white);\n  --color-cell-default: var(--pine-color-charcoal-200);\n\n  --dimension-fixed-cell-position: 0;\n  --dimension-max-width-truncated: 100px;\n\n  --font-size-cell-default: var(--pine-font-size-087);\n\n  --number-fixed-column-index: 0;\n\n  --spacing-line-height-cell-default: var(--pine-line-height-125);\n  --spacing-padding-cell-default: calc(var(--pine-spacing-300) / 2);\n  --spacing-padding-compact: var(--pine-spacing-050);\n\n  color: var(--color-cell-default);\n  display: table-cell;\n  font-size: var(--font-size-cell-default);\n  line-height: var(--spacing-line-height-cell-default);\n  padding: var(--spacing-padding-cell-default);\n  vertical-align: inherit;\n}\n\n:host(.is-compact) {\n  padding-block: var(--spacing-padding-compact);\n}\n\n:host(.is-fixed) {\n  background: var(--color-background-fixed);\n  left: var(--dimension-fixed-cell-position);\n  position: sticky;\n  z-index: 1;\n}\n\n// box shadow when table has scrolled and cell is fixed\n:host(.has-scrolled.is-fixed) {\n  box-shadow: var(--box-shadow-fixed);\n}\n\n:host(.is-truncated) {\n  max-width: var(--dimension-max-width-truncated);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n:host(.has-checkbox) {\n  vertical-align: middle;\n  width: 16px;\n}\n","import { Component, Element, Host, Prop, State, h } from '@stencil/core';\n\n@Component({\n  tag: 'pds-table-cell',\n  styleUrl: 'pds-table-cell.scss',\n  shadow: true,\n})\nexport class PdsTableCell {\n  @Element() hostElement: HTMLPdsTableCellElement;\n  tableRef: HTMLPdsTableElement;\n\n  componentWillRender() {\n    this.tableRef = this.hostElement.closest('pds-table') as HTMLPdsTableElement;\n  }\n\n  componentDidLoad() {\n    if (this.tableRef && this.tableRef.responsive && this.tableRef.fixedColumn) {\n      this.tableRef.addEventListener('scroll', this.handleScroll);\n    }\n  }\n\n  /**\n   * Truncates content to a max width of 100px and adds an ellipsis.\n   */\n  @Prop() truncate: boolean;\n\n  @State() private tableScrolling: boolean = false;\n\n  private classNames() {\n    const classNames = [];\n\n    if (this.tableRef && this.tableRef.compact) {\n      classNames.push('is-compact');\n    }\n\n    if (this.truncate) {\n      classNames.push('is-truncated');\n    }\n\n    if (this.tableRef && this.tableRef.fixedColumn && this.tableScrolling) {\n      classNames.push('has-scrolled');\n    }\n\n    return classNames.join(' ');\n  }\n\n  private handleScroll = () => {\n    if (this.tableRef.scrollLeft > 0) {\n      this.tableScrolling = true;\n    } else {\n      this.tableScrolling = false;\n    }\n  };\n\n  render() {\n    return (\n      <Host\n        class={this.classNames()}\n        role=\"gridcell\"\n        style={\n          this.tableRef &&\n          this.tableRef.fixedColumn &&\n          this.tableRef.selectable\n            ? { '--fixed-cell-position': '40px' }\n            : {}\n          }\n        >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kHAAA,MAAMA,EAAiB,8pGACvB,MAAAC,EAAeD,E,MCSFE,EAAW,M,8EAmEdC,KAAAC,qBAAwBC,IAC9B,GAAIF,KAAKG,SAAU,CACjB,M,CAGF,MAAMC,EAASF,EAAEE,OACjBJ,KAAKK,QAAUD,EAAOC,QAEtBL,KAAKM,kBAAkBC,KAAK,CAC1BF,QAASD,EAAOC,QAChBG,MAAOR,KAAKQ,OACZ,E,wSAGI,UAAAC,GACN,MAAMA,EAAa,GAEnB,GAAIT,KAAKU,QAAS,CAAED,EAAWE,KAAK,a,CACpC,GAAIX,KAAKY,cAAe,CAAEH,EAAWE,KAAK,mB,CAC1C,GAAIX,KAAKG,SAAU,CAAEM,EAAWE,KAAK,c,CAErC,OAAOF,EAAWI,KAAK,K,CAGzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,MAAOlB,KAAKS,cAChBM,EAAA,SAAAE,IAAA,8DACoBE,EAAkBnB,KAAKoB,YAAapB,KAAKU,QAASV,KAAKqB,eAAc,eACzErB,KAAKU,QAAU,OAASY,UACtCC,KAAK,WACLC,GAAIxB,KAAKoB,YACTK,KAAMzB,KAAKyB,KACXjB,MAAOR,KAAKQ,MACZH,QAASL,KAAKK,QACdqB,SAAU1B,KAAK0B,SACfvB,SAAUH,KAAKG,SACfwB,SAAU3B,KAAKC,uBAEjBc,EAACa,EAAQ,CAAAX,IAAA,2CAACY,QAAS7B,KAAKoB,YAAaU,KAAM9B,KAAK+B,MAAOtB,WAAYT,KAAKgC,YAAc,kBAAoB,KACzGhC,KAAKqB,eACJN,EAAA,OAAAE,IAAA,2CACEC,MAAO,wBACPM,GAAIS,EAAUjC,KAAKoB,YAAa,WAE/BpB,KAAKqB,eAGTrB,KAAKkC,cACJnB,EAAA,OAAAE,IAAA,2CACEC,MAAO,qDACPM,GAAIS,EAAUjC,KAAKoB,YAAa,SAAQ,YAC9B,aAETpB,KAAKkC,c,aCnIlB,MAAMC,EAAkB,wrCACxB,MAAAC,EAAeD,E,MCMFE,EAAY,M,yBAuCfrC,KAAAsC,aAAe,KACrB,GAAItC,KAAKuC,SAASC,WAAa,EAAG,CAChCxC,KAAKyC,eAAiB,I,KACjB,CACLzC,KAAKyC,eAAiB,K,+CAxBiB,K,CAf3C,mBAAAC,GACE1C,KAAKuC,SAAWvC,KAAK2C,YAAYC,QAAQ,Y,CAG3C,gBAAAC,GACE,GAAI7C,KAAKuC,UAAYvC,KAAKuC,SAASO,YAAc9C,KAAKuC,SAASQ,YAAa,CAC1E/C,KAAKuC,SAASS,iBAAiB,SAAUhD,KAAKsC,a,EAW1C,UAAA7B,GACN,MAAMA,EAAa,GAEnB,GAAIT,KAAKuC,UAAYvC,KAAKuC,SAASU,QAAS,CAC1CxC,EAAWE,KAAK,a,CAGlB,GAAIX,KAAKkD,SAAU,CACjBzC,EAAWE,KAAK,e,CAGlB,GAAIX,KAAKuC,UAAYvC,KAAKuC,SAASQ,aAAe/C,KAAKyC,eAAgB,CACrEhC,EAAWE,KAAK,e,CAGlB,OAAOF,EAAWI,KAAK,I,CAWzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAOlB,KAAKS,aACZ0C,KAAK,WACLC,MACEpD,KAAKuC,UACLvC,KAAKuC,SAASQ,aACd/C,KAAKuC,SAASc,WACV,CAAE,wBAAyB,QAC3B,IAGNtC,EAAA,QAAAE,IAAA,6C"}

package/dist/pine-core/p-6370aa12.system.entry.js

@@ -0,0 +1,2 @@
+System.register(["./p-64b4cb70.system.js"],(function(e){"use strict";var t,c,i,o,s;return{setters:[function(e){t=e.r;c=e.c;i=e.h;o=e.H;s=e.g}],execute:function(){var r=":host{--color-background-fixed:var(--pine-color-white);--color-background-interactive:var(--pine-color-grey-200);border-color:inherit;display:table-row;vertical-align:inherit}:host::part(checkbox-cell){background-color:var(--color-background-fixed);left:0;position:-webkit-sticky;position:sticky;z-index:1}:host(:hover),:host(:hover)::part(checkbox-cell),:host(:hover) ::slotted(pds-table-cell),:host(.is-selected),:host(.is-selected)::part(checkbox-cell),:host(.is-selected) ::slotted(pds-table-cell){background:var(--color-background-interactive)}";var a=r;var l=e("pds_table_row",function(){function e(e){var i=this;t(this,e);this.pdsTableRowSelected=c(this,"pdsTableRowSelected",7);this.handleCheckboxClick=function(){i.isSelected=!i.isSelected;var e=Array.from(i.hostElement.parentNode.children).indexOf(i.hostElement);i.pdsTableRowSelected.emit({rowIndex:e,isSelected:i.isSelected})};this.generateUniqueId=function(){var e=Math.random().toString(36).substring(2,8);var t=(new Date).toISOString().replace(/[:.]/g,"-");var c="".concat(e,"-").concat(t);return c};this.isSelected=false}e.prototype.classNames=function(){var e=[];if(this.isSelected){e.push("is-selected")}return e.join("  ")};e.prototype.componentWillRender=function(){this.tableRef=this.hostElement.closest("pds-table");if(this.tableRef&&this.tableRef.fixedColumn){var e=this.hostElement.querySelector("pds-table-cell");e===null||e===void 0?void 0:e.classList.add("is-fixed")}};e.prototype.render=function(){return i(o,{key:"9ef478c127a101b918e3e444109a0a3b72d809d6",class:this.classNames(),role:"row"},this.tableRef&&this.tableRef.selectable&&i("pds-table-cell",{key:"f7ecba3776fe1a5606ea66bc43f495e03635803f",part:this.tableRef.fixedColumn?"checkbox-cell":"",class:this.tableRef.selectable?"has-checkbox":""},i("pds-checkbox",{key:"6e4ebaa953542cb476f141818375b3ba8b490b2c",componentId:this.generateUniqueId(),onClick:this.handleCheckboxClick,label:"Select Row",labelHidden:true,checked:this.isSelected})),i("slot",{key:"4ccbd6b1a81d420dec05acb4f7a404ee670959b3"}))};Object.defineProperty(e.prototype,"hostElement",{get:function(){return s(this)},enumerable:false,configurable:true});return e}());l.style=a}}}));
+//# sourceMappingURL=p-6370aa12.system.entry.js.map

package/dist/pine-core/p-6370aa12.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pdsTableRowCss","PdsTableRowStyle0","PdsTableRow","exports","this","handleCheckboxClick","_this","isSelected","selectedIndex","Array","from","hostElement","parentNode","children","indexOf","pdsTableRowSelected","emit","rowIndex","generateUniqueId","randomString","Math","random","toString","substring","timestamp","Date","toISOString","replace","uniqueId","concat","class_1","prototype","classNames","push","join","componentWillRender","tableRef","closest","fixedColumn","tableCell","querySelector","classList","add","render","h","Host","key","class","role","selectable","part","componentId","onClick","label","labelHidden","checked"],"sources":["src/components/pds-table/pds-table-row/pds-table-row.scss?tag=pds-table-row&encapsulation=shadow","src/components/pds-table/pds-table-row/pds-table-row.tsx"],"sourcesContent":[":host {\n  --color-background-fixed: var(--pine-color-white);\n  --color-background-interactive: var(--pine-color-grey-200);\n\n  border-color: inherit;\n  display: table-row;\n  vertical-align: inherit;\n\n  // used for pds-checkbox-cell\n  // because it is in the ShadowDom\n  &::part(checkbox-cell) {\n    background-color: var(--color-background-fixed);\n    left: 0;\n    position: sticky;\n    z-index: 1;\n  }\n}\n\n:host(:hover),\n:host(:hover)::part(checkbox-cell),\n:host(:hover) ::slotted(pds-table-cell),\n:host(.is-selected),\n:host(.is-selected)::part(checkbox-cell),\n:host(.is-selected) ::slotted(pds-table-cell) {\n  background: var(--color-background-interactive);\n}\n","import { Component, Element, Host, h, Event, EventEmitter, State } from '@stencil/core';\n\n@Component({\n  tag: 'pds-table-row',\n  styleUrl: 'pds-table-row.scss',\n  shadow: true,\n})\nexport class PdsTableRow {\n  @Element() hostElement: HTMLPdsTableRowElement;\n  tableRef: HTMLPdsTableElement;\n\n  /**\n   * Event that is emitted when the checkbox is clicked, carrying the selected value.\n   */\n  @Event() pdsTableRowSelected: EventEmitter<{ rowIndex: number; isSelected: boolean; }>;\n\n  /**\n   * A local state to track whether the row is currently selected.\n   */\n  @State() isSelected: boolean = false;\n\n  private handleCheckboxClick = () => {\n    this.isSelected = !this.isSelected; // Toggle the selected state\n    const selectedIndex = Array.from(this.hostElement.parentNode.children).indexOf(this.hostElement);\n    this.pdsTableRowSelected.emit({ rowIndex: selectedIndex, isSelected: this.isSelected });\n  }\n\n  private classNames() {\n    const classNames = [];\n\n    if (this.isSelected) {\n      classNames.push(\"is-selected\");\n    }\n\n    return classNames.join('  ');\n  }\n\n  componentWillRender() {\n    this.tableRef = this.hostElement.closest('pds-table') as HTMLPdsTableElement;\n\n    if (this.tableRef && this.tableRef.fixedColumn) {\n      const tableCell = this.hostElement.querySelector('pds-table-cell');\n      tableCell?.classList.add(\"is-fixed\");\n    }\n  }\n\n  private generateUniqueId = () => {\n    const randomString = Math.random().toString(36).substring(2, 8);\n    const timestamp = new Date().toISOString().replace(/[:.]/g, '-');\n    const uniqueId = `${randomString}-${timestamp}`;\n\n    return uniqueId;\n  }\n\n  render() {\n    return (\n      <Host\n        class={this.classNames()}\n        role=\"row\"\n      >\n        {this.tableRef && this.tableRef.selectable && (\n          <pds-table-cell part={this.tableRef.fixedColumn ? 'checkbox-cell' : ''} class={this.tableRef.selectable ? 'has-checkbox' : ''} >\n            <pds-checkbox\n              componentId={this.generateUniqueId()}\n              onClick={this.handleCheckboxClick}\n              label={\"Select Row\"}\n              labelHidden={true}\n              checked={this.isSelected}\n            />\n          </pds-table-cell>\n        )}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kKAAA,IAAMA,EAAiB,wiBACvB,IAAAC,EAAeD,E,ICMFE,EAAWC,EAAA,2B,4FAcdC,KAAAC,oBAAsB,WAC5BC,EAAKC,YAAcD,EAAKC,WACxB,IAAMC,EAAgBC,MAAMC,KAAKJ,EAAKK,YAAYC,WAAWC,UAAUC,QAAQR,EAAKK,aACpFL,EAAKS,oBAAoBC,KAAK,CAAEC,SAAUT,EAAeD,WAAYD,EAAKC,Y,EAsBpEH,KAAAc,iBAAmB,WACzB,IAAMC,EAAeC,KAAKC,SAASC,SAAS,IAAIC,UAAU,EAAG,GAC7D,IAAMC,GAAY,IAAIC,MAAOC,cAAcC,QAAQ,QAAS,KAC5D,IAAMC,EAAW,GAAAC,OAAGV,EAAY,KAAAU,OAAIL,GAEpC,OAAOI,C,kBAhCsB,K,CAQvBE,EAAAC,UAAAC,WAAA,WACN,IAAMA,EAAa,GAEnB,GAAI5B,KAAKG,WAAY,CACnByB,EAAWC,KAAK,c,CAGlB,OAAOD,EAAWE,KAAK,K,EAGzBJ,EAAAC,UAAAI,oBAAA,WACE/B,KAAKgC,SAAWhC,KAAKO,YAAY0B,QAAQ,aAEzC,GAAIjC,KAAKgC,UAAYhC,KAAKgC,SAASE,YAAa,CAC9C,IAAMC,EAAYnC,KAAKO,YAAY6B,cAAc,kBACjDD,IAAS,MAATA,SAAS,SAATA,EAAWE,UAAUC,IAAI,W,GAY7BZ,EAAAC,UAAAY,OAAA,WACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO3C,KAAK4B,aACZgB,KAAK,OAEJ5C,KAAKgC,UAAYhC,KAAKgC,SAASa,YAC9BL,EAAA,kBAAAE,IAAA,2CAAgBI,KAAM9C,KAAKgC,SAASE,YAAc,gBAAkB,GAAIS,MAAO3C,KAAKgC,SAASa,WAAa,eAAiB,IACzHL,EAAA,gBAAAE,IAAA,2CACEK,YAAa/C,KAAKc,mBAClBkC,QAAShD,KAAKC,oBACdgD,MAAO,aACPC,YAAa,KACbC,QAASnD,KAAKG,cAIpBqC,EAAA,QAAAE,IAAA,6C,gIAhEgB,I"}

package/dist/pine-core/p-674edd62.system.js

@@ -0,0 +1,2 @@
+System.register([],(function(a){"use strict";return{execute:function(){var s=a("b","data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' class='pdsicon'><path fill-rule='evenodd' d='M.862 4.862c.26-.26.682-.26.943 0L8 11.057l6.195-6.195a.667.667 0 1 1 .943.943L8.471 12.47a.667.667 0 0 1-.942 0L.862 5.805a.667.667 0 0 1 0-.943Z'/></svg>");var v=a("c","data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' class='pdsicon'><path d='M8 0C3.58 0 0 3.58 0 8s3.58 8 8 8 8-3.58 8-8-3.58-8-8-8Zm4.473 5.807L7.14 11.14c-.26.26-.68.26-.94 0L3.533 8.473a.664.664 0 1 1 .94-.94l2.194 2.194 4.86-4.86c.26-.26.68-.26.94 0 .266.253.266.68.006.94Z'/></svg>");var l=a("a","data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' class='pdsicon'><path fill-rule='evenodd' d='M10 5.333c0-.368.299-.666.667-.666h4c.368 0 .666.298.666.666v9.334a.667.667 0 0 1-.666.666H5.333a.667.667 0 0 1-.666-.666v-4a.667.667 0 1 1 1.333 0V14h8V6h-3.333A.667.667 0 0 1 10 5.333Z'/><path fill-rule='evenodd' d='M.667 1.333c0-.368.298-.666.666-.666h9.334c.368 0 .666.298.666.666v9.334a.667.667 0 0 1-.666.666H1.333a.667.667 0 0 1-.666-.666V1.333ZM2 2v8h8V2H2Z'/></svg>");var g=a("d","data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' class='pdsicon'><path fill-rule='evenodd' d='M3.594 5.594a.889.889 0 0 1 1.257 0L7.778 8.52l2.927-2.927a.889.889 0 0 1 1.257 1.257l-3.556 3.555a.889.889 0 0 1-1.257 0L3.594 6.851a.889.889 0 0 1 0-1.257Z'/></svg>");var t=a("h","data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' class='pdsicon'><path fill-rule='evenodd' d='M.667 5.333a.667.667 0 0 0 0 1.334h14.666a.667.667 0 1 0 0-1.334H.667Zm0 4.667a.667.667 0 0 0 0 1.333h14.666a.667.667 0 1 0 0-1.333H.667Z'/></svg>");var e=a("l","data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' class='pdsicon'><path fill-rule='evenodd' d='M15.138.862a.664.664 0 0 1 .195.461v5.344a.667.667 0 0 1-1.333 0V2.943L7.805 9.138a.667.667 0 1 1-.943-.943L13.057 2H9.333a.667.667 0 0 1 0-1.333h5.333c.171 0 .342.065.472.195ZM1.333 2a.667.667 0 0 0-.666.667v12c0 .368.298.666.666.666h12a.667.667 0 0 0 .667-.666V10a.667.667 0 0 0-1.333 0v4H2V3.333h4A.667.667 0 1 0 6 2H1.333Z'/></svg>");var w=a("r","data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' class='pdsicon'><path d='M13.138 3.805a.667.667 0 0 0-.943-.943L8 7.057 3.805 2.862a.667.667 0 1 0-.943.943L7.057 8l-4.195 4.195a.667.667 0 1 0 .943.943L8 8.943l4.195 4.195a.667.667 0 0 0 .943-.943L8.943 8l4.195-4.195Z'/></svg>");var d=a("e","data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' class='pdsicon'><path fill-rule='evenodd' d='M7.15 5.594a.889.889 0 0 1 1.256 0l3.556 3.555a.889.889 0 0 1-1.257 1.257L7.778 7.48 4.85 10.406A.889.889 0 1 1 3.594 9.15l3.555-3.555Z'/></svg>");var i=a("u","data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' class='pdsicon'><path d='M12.222 8.925A5.98 5.98 0 0 1 8 10.667a5.983 5.983 0 0 1-4.222-1.742A7.335 7.335 0 0 0 0 15.333c0 .368.299.667.667.667h14.666a.667.667 0 0 0 .667-.667 7.335 7.335 0 0 0-3.778-6.408Z'/><path d='M8 9.333A4.667 4.667 0 1 0 8 0a4.667 4.667 0 0 0 0 9.333Z'/></svg>")}}}));
+//# sourceMappingURL=p-674edd62.system.js.map