@florid-kit/components 0.3.24 → 0.3.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/index.js +3 -2
  2. package/index.mjs +5 -4
  3. package/package.json +2 -2
package/index.js CHANGED
@@ -277,7 +277,7 @@
277
277
  }
278
278
 
279
279
  }
280
- `;C([l({type:String,reflect:!0})],m.prototype,"bgstyle",2);C([l({type:String,reflect:!0})],m.prototype,"size",2);C([l({type:String,reflect:!0})],m.prototype,"status",2);C([l({type:String,reflect:!0})],m.prototype,"type",2);C([l({type:String})],m.prototype,"strokewidth",2);C([l({type:String})],m.prototype,"icon",2);C([l({type:Boolean,reflect:!0})],m.prototype,"disabled",2);m=C([U("o-icon-button")],m);var be=Object.defineProperty,ye=Object.getOwnPropertyDescriptor,v=(o,t,e,s)=>{for(var n=s>1?void 0:s?ye(t,e):t,r=o.length-1,i;r>=0;r--)(i=o[r])&&(n=(s?i(t,e,n):i(n))||n);return s&&n&&be(t,e,n),n};const $e=Jt($);let u=class extends $e{constructor(){super(...arguments),this.type="submit",this.value="",this.variant="primary",this.text="",this.textsecond="",this.fullwidth=!1,this.disabled=!1,this.iconstrokewidth="1",this.icon="",this.startIcon=!1,this.endIcon=!1,this.iconSize="small",this.panelTarget="",this.href="",this.target=""}get name(){return this.getAttribute("name")??""}set name(o){this.setAttribute("name",o)}get form(){return this[dt].form}handleClick(){if(console.log(`[o-button] Click event triggered trying to open ${this.panelTarget} panel.`),this.panelTarget){const o=document.getElementById(this.panelTarget);o!=null&&o.openPanel&&typeof o.openPanel=="function"?o.openPanel():console.warn(`[o-button] No side panel with id="${this.panelTarget}" found or it does not have an openPanel method.`)}}render(){return this.href?this.renderLink():this.renderButton()}renderIcon(o){return this.icon?d`<o-icon-button
280
+ `;C([l({type:String,reflect:!0})],m.prototype,"bgstyle",2);C([l({type:String,reflect:!0})],m.prototype,"size",2);C([l({type:String,reflect:!0})],m.prototype,"status",2);C([l({type:String,reflect:!0})],m.prototype,"type",2);C([l({type:String})],m.prototype,"strokewidth",2);C([l({type:String})],m.prototype,"icon",2);C([l({type:Boolean,reflect:!0})],m.prototype,"disabled",2);m=C([U("o-icon-button")],m);var be=Object.defineProperty,ye=Object.getOwnPropertyDescriptor,v=(o,t,e,s)=>{for(var n=s>1?void 0:s?ye(t,e):t,r=o.length-1,i;r>=0;r--)(i=o[r])&&(n=(s?i(t,e,n):i(n))||n);return s&&n&&be(t,e,n),n};const $e=Jt($);let u=class extends $e{constructor(){super(...arguments),this.type="submit",this.value="",this.variant="primary",this.text="",this.textsecond="",this.fullwidth=!1,this.disabled=!1,this.iconstrokewidth="1",this.icon="",this.startIcon=!1,this.endIcon=!1,this.iconSize="small",this.panelTarget="",this.href="",this.target=""}get name(){return this.getAttribute("name")??""}set name(o){this.setAttribute("name",o)}get form(){return this[dt].form}handleClick(){if(this.panelTarget){const o=document.getElementById(this.panelTarget);o!=null&&o.openPanel&&typeof o.openPanel=="function"?o.openPanel():console.warn(`[o-button] No side panel with id="${this.panelTarget}" found or it does not have an openPanel method.`)}}render(){return this.href?this.renderLink():this.renderButton()}renderIcon(o){return this.icon?d`<o-icon-button
281
281
  class=${o==="start"?"icon-start":"icon-end"}
282
282
  icon=${this.icon}
283
283
  bgstyle="${this.variant==="primary"?"none-light":"none-contrast"}"
@@ -656,7 +656,7 @@
656
656
  text-decoration: underline;
657
657
  cursor: pointer;
658
658
  }
659
- `;Y([l({type:Number})],z.prototype,"rating",2);Y([l({type:String})],z.prototype,"reviewCount",2);Y([l({type:String})],z.prototype,"href",2);z=Y([U("o-rating")],z);var Ee=Object.defineProperty,Ce=Object.getOwnPropertyDescriptor,y=(o,t,e,s)=>{for(var n=s>1?void 0:s?Ce(t,e):t,r=o.length-1,i;r>=0;r--)(i=o[r])&&(n=(s?i(t,e,n):i(n))||n);return s&&n&&Ee(t,e,n),n};let b=class extends ${constructor(){super(...arguments),this.open=!1,this.showHeader=!0,this.showFooter=!1,this.headerTitle="",this.closeButtonLabel="Close the modal",this.firstButtonLabel="Close",this.firstButtonVariant="primary",this.secondaryButtonLabel="",this.secondaryButtonVariant="secondary",this.previousFocusedElement=null,this.handleKeyDown=o=>{this.open&&(o.key==="Escape"?this.closePanel():o.key==="Tab"&&this.trapFocus(o))}}connectedCallback(){super.connectedCallback(),window.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){document.body.style.overflow="",window.removeEventListener("keydown",this.handleKeyDown),super.disconnectedCallback()}trapFocus(o){const t=this.getFocusableElements();if(t.length===0)return;const e=t[0],s=t[t.length-1];o.shiftKey&&document.activeElement===e?(o.preventDefault(),s.focus()):!o.shiftKey&&document.activeElement===s&&(o.preventDefault(),e.focus())}getFocusableElements(){const o=this.renderRoot.querySelector(".panel");return o?Array.from(o.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(t=>!t.hasAttribute("disabled")):[]}openPanel(){this.previousFocusedElement=document.activeElement,this.open=!0,document.body.style.overflow="hidden",this.updateComplete.then(()=>{const o=this.getFocusableElements()[0];o==null||o.focus()})}closePanel(){var o;this.open=!1,document.body.style.overflow="",(o=this.previousFocusedElement)==null||o.focus(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))}handleFirstClick(){typeof this.onFirstButtonClick=="function"&&this.onFirstButtonClick(),this.closePanel()}handleSecondaryClick(){typeof this.onSecondaryButtonClick=="function"&&this.onSecondaryButtonClick(),this.closePanel()}render(){return d`
659
+ `;Y([l({type:Number})],z.prototype,"rating",2);Y([l({type:String})],z.prototype,"reviewCount",2);Y([l({type:String})],z.prototype,"href",2);z=Y([U("o-rating")],z);var Ee=Object.defineProperty,Ce=Object.getOwnPropertyDescriptor,y=(o,t,e,s)=>{for(var n=s>1?void 0:s?Ce(t,e):t,r=o.length-1,i;r>=0;r--)(i=o[r])&&(n=(s?i(t,e,n):i(n))||n);return s&&n&&Ee(t,e,n),n};let b=class extends ${constructor(){super(...arguments),this.open=!1,this.showHeader=!0,this.showFooter=!1,this.headerTitle="",this.closeButtonLabel="Close the modal",this.firstButtonLabel="Close",this.firstButtonVariant="primary",this.secondaryButtonLabel="",this.secondaryButtonVariant="secondary",this.previousFocusedElement=null,this.handleKeyDown=o=>{this.open&&(o.key==="Escape"?this.closePanel():o.key==="Tab"&&this.trapFocus(o))}}connectedCallback(){super.connectedCallback(),window.addEventListener("keydown",this.handleKeyDown)}disconnectedCallback(){document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),window.removeEventListener("keydown",this.handleKeyDown),super.disconnectedCallback()}trapFocus(o){const t=this.getFocusableElements();if(t.length===0)return;const e=t[0],s=t[t.length-1];o.shiftKey&&document.activeElement===e?(o.preventDefault(),s.focus()):!o.shiftKey&&document.activeElement===s&&(o.preventDefault(),e.focus())}getFocusableElements(){const o=this.renderRoot.querySelector(".panel");return o?Array.from(o.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')).filter(t=>!t.hasAttribute("disabled")):[]}openPanel(){this.previousFocusedElement=document.activeElement,this.open=!0,document.body.style.overflow="hidden",document.body.setAttribute("data-side-panel","open"),this.updateComplete.then(()=>{const o=this.getFocusableElements()[0];o==null||o.focus()})}closePanel(){var o;this.open=!1,document.body.style.overflow="",document.body.removeAttribute("data-side-panel"),(o=this.previousFocusedElement)==null||o.focus(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))}handleFirstClick(){typeof this.onFirstButtonClick=="function"&&this.onFirstButtonClick(),this.closePanel()}handleSecondaryClick(){typeof this.onSecondaryButtonClick=="function"&&this.onSecondaryButtonClick(),this.closePanel()}render(){return d`
660
660
  <div class="overlay" @click=${this.closePanel}></div>
661
661
  <div
662
662
  class="panel"
@@ -762,6 +762,7 @@
762
762
  .content {
763
763
  flex: 1 1 auto;
764
764
  overflow-y: auto;
765
+ overflow-x: hidden;
765
766
  padding: 16px;
766
767
  }
767
768
 
package/index.mjs CHANGED
@@ -1003,7 +1003,7 @@ let u = class extends $e {
1003
1003
  return this[dt].form;
1004
1004
  }
1005
1005
  handleClick() {
1006
- if (console.log(`[o-button] Click event triggered trying to open ${this.panelTarget} panel.`), this.panelTarget) {
1006
+ if (this.panelTarget) {
1007
1007
  const o = document.getElementById(this.panelTarget);
1008
1008
  o != null && o.openPanel && typeof o.openPanel == "function" ? o.openPanel() : console.warn(`[o-button] No side panel with id="${this.panelTarget}" found or it does not have an openPanel method.`);
1009
1009
  }
@@ -1595,7 +1595,7 @@ let b = class extends $ {
1595
1595
  super.connectedCallback(), window.addEventListener("keydown", this.handleKeyDown);
1596
1596
  }
1597
1597
  disconnectedCallback() {
1598
- document.body.style.overflow = "", window.removeEventListener("keydown", this.handleKeyDown), super.disconnectedCallback();
1598
+ document.body.style.overflow = "", document.body.removeAttribute("data-side-panel"), window.removeEventListener("keydown", this.handleKeyDown), super.disconnectedCallback();
1599
1599
  }
1600
1600
  trapFocus(o) {
1601
1601
  const t = this.getFocusableElements();
@@ -1612,14 +1612,14 @@ let b = class extends $ {
1612
1612
  ).filter((t) => !t.hasAttribute("disabled")) : [];
1613
1613
  }
1614
1614
  openPanel() {
1615
- this.previousFocusedElement = document.activeElement, this.open = !0, document.body.style.overflow = "hidden", this.updateComplete.then(() => {
1615
+ this.previousFocusedElement = document.activeElement, this.open = !0, document.body.style.overflow = "hidden", document.body.setAttribute("data-side-panel", "open"), this.updateComplete.then(() => {
1616
1616
  const o = this.getFocusableElements()[0];
1617
1617
  o == null || o.focus();
1618
1618
  });
1619
1619
  }
1620
1620
  closePanel() {
1621
1621
  var o;
1622
- this.open = !1, document.body.style.overflow = "", (o = this.previousFocusedElement) == null || o.focus(), this.dispatchEvent(
1622
+ this.open = !1, document.body.style.overflow = "", document.body.removeAttribute("data-side-panel"), (o = this.previousFocusedElement) == null || o.focus(), this.dispatchEvent(
1623
1623
  new CustomEvent("close", { bubbles: !0, composed: !0 })
1624
1624
  );
1625
1625
  }
@@ -1739,6 +1739,7 @@ b.styles = E`
1739
1739
  .content {
1740
1740
  flex: 1 1 auto;
1741
1741
  overflow-y: auto;
1742
+ overflow-x: hidden;
1742
1743
  padding: 16px;
1743
1744
  }
1744
1745
 
package/package.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "@florid-kit/components",
3
- "version": "0.3.24",
3
+ "version": "0.3.26",
4
4
  "main": "index.js",
5
5
  "module": "index.mjs",
6
6
  "typings": "index.d.ts",
7
7
  "description": "This library was generated with [Nx](https://nx.dev).",
8
8
  "dependencies": {
9
- "@florid-kit/tokens": "^0.1.5"
9
+ "@florid-kit/tokens": "^0.1.7"
10
10
  },
11
11
  "devDependencies": {
12
12
  "@storybook/addon-a11y": "8.6.14",