@fluid-topics/ft-reader-metadata 1.1.52 → 1.1.54

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -39,7 +39,9 @@ class FtReaderMetadata extends FtReaderComponent {
39
39
  ${this.useForSwitchingToRelatives && this.metadata && this.metadata.values.length > 0 && this.relatives.length > 0
40
40
  ? this.renderSwitchToRelatives()
41
41
  : html `
42
- <ft-chip part="chip" ?multiLine=${this.multiLine}>
42
+ <ft-chip part="chip"
43
+ exportpartsPrefix="chip"
44
+ ?multiLine=${this.multiLine}>
43
45
  ${this.renderContent()}
44
46
  </ft-chip>
45
47
  `}
@@ -66,6 +68,7 @@ class FtReaderMetadata extends FtReaderComponent {
66
68
  <div part="floating-menu-container" class="ft-reader-metadata--container">
67
69
  <ft-floating-menu part="floating-menu" text="Toggle collapsible" trailingIcon>
68
70
  <ft-chip part="chip"
71
+ exportpartsPrefix="chip"
69
72
  ?multiLine=${this.multiLine}
70
73
  trailingIcon icon="thin_arrow"
71
74
  slot="toggle"
@@ -817,7 +817,7 @@ const V=Symbol.for(""),X=t=>{if(t?.r===V)return t?._$litStatic$},q=t=>({_$litSta
817
817
  width: ${at.smallIconOnlyWidth};
818
818
  padding: unset;
819
819
  }
820
- `,o.noTextSelect];var hi=function(t,o,e,i){for(var r,n=arguments.length,a=n<3?o:null===i?i=Object.getOwnPropertyDescriptor(o,e):i,l=t.length-1;l>=0;l--)(r=t[l])&&(a=(n<3?r(a):n>3?r(o,e,a):r(o,e))||a);return n>3&&a&&Object.defineProperty(o,e,a),a};class ui extends si{constructor(){super(...arguments),this.primary=!1,this.secondary=!1,this.tertiary=!1,this.neutral=!1,this.small=!1}get buttonClasses(){return{"ft-button":!0,"ft-button--primary":this.primary,"ft-button--secondary":this.secondary,"ft-button--tertiary":this.tertiary||!this.primary&&!this.secondary&&!this.neutral,"ft-button--neutral":this.neutral,"ft-button--large":!this.small,"ft-button--small":this.small,"ft-button--icon-only":!this.hasTextContent(),"ft-button--trailing-icon":this.trailingIcon,"ft-button--loading":this.trailingIcon,"ft-no-text-select":!0,"ft-button--no-icon":!this.icon}}get typographyVariant(){return this.small?tt.caption1medium:tt.body2medium}}ui.styles=[o.safariEllipsisFix,di],hi([i.property({type:Boolean})],ui.prototype,"primary",void 0),hi([i.property({type:Boolean})],ui.prototype,"secondary",void 0),hi([i.property({type:Boolean})],ui.prototype,"tertiary",void 0),hi([i.property({type:Boolean})],ui.prototype,"neutral",void 0),hi([i.property({type:Boolean})],ui.prototype,"small",void 0),o.customElement("ft-button")(fi),o.customElement("ftds-button")(ui);const gi=o.FtCssVariableFactory.extend("--ft-chip-color","",o.designSystemVariables.colorOnSurface),yi={backgroundColor:o.FtCssVariableFactory.extend("--ft-chip-background-color","",o.designSystemVariables.colorSurface),color:gi,fontSize:o.FtCssVariableFactory.extend("--ft-chip-font-size","",Bt.fontSize),iconSize:o.FtCssVariableFactory.create("--ft-chip-icon-size","","SIZE","18px"),rippleColor:o.FtCssVariableFactory.extend("--ft-chip-ripple-color","",gi),horizontalPadding:o.FtCssVariableFactory.create("--ft-chip-horizontal-padding","","SIZE","6px"),verticalPadding:o.FtCssVariableFactory.create("--ft-chip-vertical-padding","","SIZE","6px"),colorOutline:o.FtCssVariableFactory.external(o.designSystemVariables.colorOutline,"Design system"),opacityDisabled:o.FtCssVariableFactory.external(o.designSystemVariables.colorOpacityDisabled,"Design system")},bi=o.FtCssVariableFactory.extend("--ft-chip-highlighted-color","",o.FtCssVariableFactory.extend("--ft-chip-color","",o.designSystemVariables.colorOnPrimary)),mi={backgroundColor:o.FtCssVariableFactory.extend("--ft-chip-highlighted-background-color","",o.FtCssVariableFactory.extend("--ft-chip-background-color","",o.designSystemVariables.colorPrimary)),color:bi,rippleColor:o.FtCssVariableFactory.extend("--ft-chip-highlighted-ripple-color","",bi)},xi=o.FtCssVariableFactory.create("--ft-chip-dense-horizontal-padding","","SIZE","4px"),vi=o.FtCssVariableFactory.create("--ft-chip-dense-vertical-padding","","SIZE","4px"),Oi=[o.noTextSelect,e.css`
820
+ `,o.noTextSelect];var hi=function(t,o,e,i){for(var r,n=arguments.length,a=n<3?o:null===i?i=Object.getOwnPropertyDescriptor(o,e):i,l=t.length-1;l>=0;l--)(r=t[l])&&(a=(n<3?r(a):n>3?r(o,e,a):r(o,e))||a);return n>3&&a&&Object.defineProperty(o,e,a),a};class ui extends si{constructor(){super(...arguments),this.primary=!1,this.secondary=!1,this.tertiary=!1,this.neutral=!1,this.small=!1}get buttonClasses(){return{"ft-button":!0,"ft-button--primary":this.primary,"ft-button--secondary":this.secondary,"ft-button--tertiary":this.tertiary||!this.primary&&!this.secondary&&!this.neutral,"ft-button--neutral":this.neutral,"ft-button--large":!this.small,"ft-button--small":this.small,"ft-button--icon-only":!this.hasTextContent(),"ft-button--trailing-icon":this.trailingIcon,"ft-button--loading":this.trailingIcon,"ft-no-text-select":!0,"ft-button--no-icon":!this.icon}}get typographyVariant(){return this.small?tt.caption1medium:tt.body2medium}}ui.styles=[o.safariEllipsisFix,di],hi([i.property({type:Boolean})],ui.prototype,"primary",void 0),hi([i.property({type:Boolean})],ui.prototype,"secondary",void 0),hi([i.property({type:Boolean})],ui.prototype,"tertiary",void 0),hi([i.property({type:Boolean})],ui.prototype,"neutral",void 0),hi([i.property({type:Boolean})],ui.prototype,"small",void 0),o.customElement("ft-button")(fi),o.customElement("ftds-button")(ui);const gi=o.FtCssVariableFactory.extend("--ft-chip-color","",o.designSystemVariables.colorOnSurface),yi={backgroundColor:o.FtCssVariableFactory.extend("--ft-chip-background-color","",o.designSystemVariables.colorSurface),color:gi,fontSize:o.FtCssVariableFactory.extend("--ft-chip-font-size","",Bt.fontSize),iconSize:o.FtCssVariableFactory.create("--ft-chip-icon-size","","SIZE","18px"),borderRadius:o.FtCssVariableFactory.create("--ft-chip-border-radius","","SIZE",""),rippleColor:o.FtCssVariableFactory.extend("--ft-chip-ripple-color","",gi),horizontalPadding:o.FtCssVariableFactory.create("--ft-chip-horizontal-padding","","SIZE","6px"),verticalPadding:o.FtCssVariableFactory.create("--ft-chip-vertical-padding","","SIZE","6px"),colorOutline:o.FtCssVariableFactory.external(o.designSystemVariables.colorOutline,"Design system"),opacityDisabled:o.FtCssVariableFactory.external(o.designSystemVariables.colorOpacityDisabled,"Design system")},bi=o.FtCssVariableFactory.extend("--ft-chip-highlighted-color","",o.FtCssVariableFactory.extend("--ft-chip-color","",o.designSystemVariables.colorOnPrimary)),mi={backgroundColor:o.FtCssVariableFactory.extend("--ft-chip-highlighted-background-color","",o.FtCssVariableFactory.extend("--ft-chip-background-color","",o.designSystemVariables.colorPrimary)),color:bi,rippleColor:o.FtCssVariableFactory.extend("--ft-chip-highlighted-ripple-color","",bi)},xi=o.FtCssVariableFactory.create("--ft-chip-dense-horizontal-padding","","SIZE","4px"),vi=o.FtCssVariableFactory.create("--ft-chip-dense-vertical-padding","","SIZE","4px"),Oi=[o.noTextSelect,e.css`
821
821
  :host {
822
822
  display: inline-block;
823
823
  max-width: 100%;
@@ -844,7 +844,7 @@ const V=Symbol.for(""),X=t=>{if(t?.r===V)return t?._$litStatic$},q=t=>({_$litSta
844
844
  border: 1px solid ${yi.colorOutline};
845
845
  color: ${yi.color};
846
846
  ${o.setVariable(Le.color,yi.rippleColor)};
847
- border-radius: calc(var(--ft-chip-internal-content-height) / 2 + var(--ft-chip-internal-vertical-padding));
847
+ border-radius: var(${e.unsafeCSS(yi.borderRadius.name)}, calc(var(--ft-chip-internal-content-height) / 2 + var(--ft-chip-internal-vertical-padding)));
848
848
  padding: calc(var(--ft-chip-internal-vertical-padding) - 1px) calc(var(--ft-chip-internal-horizontal-padding) - 1px);
849
849
  background-color: ${yi.backgroundColor};
850
850
  line-height: var(--ft-chip-internal-content-height);
@@ -958,9 +958,10 @@ const V=Symbol.for(""),X=t=>{if(t?.r===V)return t?._$litStatic$},q=t=>({_$litSta
958
958
  <div class="${r.classMap(t)}"
959
959
  aria-label="${this.getLabel()}"
960
960
  tabindex="${this.interactionsOnChip?0:-1}"
961
- @keyup=${this.onKeyUp}>
961
+ @keyup=${this.onKeyUp}
962
+ part="chip">
962
963
  <ft-ripple ?disabled=${!this.interactionsOnChip}></ft-ripple>
963
- <ft-typography variant="body2" element="span" class="ft-chip--label">
964
+ <ft-typography variant="body2" element="span" class="ft-chip--label" part="label">
964
965
  <slot @slotchange=${this.onSlotchange}></slot>
965
966
  </ft-typography>
966
967
  ${this.internalIcon?this.renderIcon():null}
@@ -972,10 +973,11 @@ const V=Symbol.for(""),X=t=>{if(t?.r===V)return t?._$litStatic$},q=t=>({_$litSta
972
973
  .iconVariant=${this.iconVariant}
973
974
  icon="${this.internalIcon}"
974
975
  label="${this.iconLabel}"
976
+ part="icon-button"
975
977
  ></ft-button>
976
978
  `:e.html`
977
- <div class="ft-chip--icon-container ft-no-text-select">
978
- <ft-icon .variant=${this.iconVariant} .value="${this.internalIcon}"></ft-icon>
979
+ <div class="ft-chip--icon-container ft-no-text-select" part="icon-container">
980
+ <ft-icon .variant=${this.iconVariant} .value="${this.internalIcon}" part="icon"></ft-icon>
979
981
  </div>
980
982
  `}onKeyUp(t){this.interactionsOnChip&&["Enter"," "].includes(t.key)&&t.target.click()}onIconKeyUp(t){this.interactionsOnIcon&&["Enter"," "].includes(t.key)&&(t.stopPropagation(),this.dispatchEvent(new Si))}onIconClick(t){this.interactionsOnIcon&&(t.stopPropagation(),this.dispatchEvent(new Si))}getLabel(){return this.label||this.textContent}get textContent(){var t,o;return null!==(o=null===(t=this.slottedContent)||void 0===t?void 0:t.assignedNodes().map((t=>t.textContent)).join("").trim())&&void 0!==o?o:""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}get internalIcon(){return this.icon||(this.removable?"close":void 0)}}wi.elementDefinitions={"ft-ripple":_e,"ft-typography":vo,"ft-icon":Ve,"ft-button":fi},wi.styles=Oi,Ni([i.property({type:Boolean})],wi.prototype,"highlighted",void 0),Ni([i.property({type:Boolean})],wi.prototype,"removable",void 0),Ni([i.property({type:Boolean})],wi.prototype,"disabled",void 0),Ni([i.property({type:Boolean})],wi.prototype,"clickable",void 0),Ni([i.property({type:Boolean})],wi.prototype,"iconClickable",void 0),Ni([i.property({type:Boolean})],wi.prototype,"dense",void 0),Ni([i.property({type:Boolean})],wi.prototype,"multiLine",void 0),Ni([i.property()],wi.prototype,"label",void 0),Ni([i.property()],wi.prototype,"iconLabel",void 0),Ni([i.property()],wi.prototype,"icon",void 0),Ni([i.property()],wi.prototype,"iconVariant",void 0),Ni([i.property({type:Boolean})],wi.prototype,"trailingIcon",void 0),Ni([i.query("ft-typography slot")],wi.prototype,"slottedContent",void 0),o.customElement("ft-chip")(wi);const Ei=o.FtCssVariableFactory.create("--ft-floating-menu-z-index","","NUMBER","8"),$i=o.FtCssVariableFactory.create("--ft-floating-menu-max-width","","SIZE","300px"),Ci=o.FtCssVariableFactory.create("--ft-floating-menu-max-height","","SIZE","500px"),Ii=o.FtCssVariableFactory.extend("--ft-floating-menu-text-color","",o.designSystemVariables.colorOnSurfaceHigh),Ri=o.FtCssVariableFactory.external(o.designSystemVariables.colorSurface,"Design system"),Ui=o.FtCssVariableFactory.external(o.designSystemVariables.elevation02,"Design system"),ki=o.FtCssVariableFactory.external(o.designSystemVariables.borderRadiusS,"Design system"),Wi=e.css`
981
983
  .ft-floating-menu {
@@ -1110,7 +1112,9 @@ const V=Symbol.for(""),X=t=>{if(t?.r===V)return t?._$litStatic$},q=t=>({_$litSta
1110
1112
  class="${this.multiLine?"ft-reader-metadata-multi-line":""}"
1111
1113
  text="${this.tooltipText}">
1112
1114
  ${this.useForSwitchingToRelatives&&this.metadata&&this.metadata.values.length>0&&this.relatives.length>0?this.renderSwitchToRelatives():e.html`
1113
- <ft-chip part="chip" ?multiLine=${this.multiLine}>
1115
+ <ft-chip part="chip"
1116
+ exportpartsPrefix="chip"
1117
+ ?multiLine=${this.multiLine}>
1114
1118
  ${this.renderContent()}
1115
1119
  </ft-chip>
1116
1120
  `}
@@ -1120,6 +1124,7 @@ const V=Symbol.for(""),X=t=>{if(t?.r===V)return t?._$litStatic$},q=t=>({_$litSta
1120
1124
  <div part="floating-menu-container" class="ft-reader-metadata--container">
1121
1125
  <ft-floating-menu part="floating-menu" text="Toggle collapsible" trailingIcon>
1122
1126
  <ft-chip part="chip"
1127
+ exportpartsPrefix="chip"
1123
1128
  ?multiLine=${this.multiLine}
1124
1129
  trailingIcon icon="thin_arrow"
1125
1130
  slot="toggle"