@solid-design-system/components 3.8.0 → 3.8.1

package/dist/components/es/navigation-item.js

@@ -1 +1 @@
-import{S as t,t as e,c as i,i as s,n as o,a as r}from"./solid-components2.js";import{H as l}from"./slot.js";import{s as a,n}from"./static.js";import{o as d}from"./if-defined.js";var h=Object.defineProperty,c=Object.getOwnPropertyDescriptor,p=(t,e,i,s)=>{for(var o,r=s>1?void 0:s?c(e,i):e,l=t.length-1;l>=0;l--)(o=t[l])&&(r=(s?o(e,i,r):o(r))||r);return s&&r&&h(e,i,r),r};let u=class extends t{constructor(){super(...arguments),this.hasSlotController=new l(this,"[default]","description","children"),this.current=!1,this.disabled=!1,this.size="base",this.vertical=!1,this.chevron=!1,this.indented=!1,this.relaxed=!1,this.divider=!1,this.open=!1}isButton(){return!this.href&&!this.hasSlotController.test("children")}isLink(){return!!this.href}isAccordion(){return!this.href&&this.hasSlotController.test("children")}handleClickButton(t){this.disabled&&(t.preventDefault(),t.stopPropagation())}handleClickSummary(t){t.preventDefault(),t.stopPropagation(),this.disabled||(this.open?this.hideDetails():this.showDetails())}hideDetails(){this.open=!1,this.emit("sd-hide",{cancelable:!0})}showDetails(){this.open=!0,this.emit("sd-show",{cancelable:!0})}calculatePaddingX(){return this.relaxed&&this.indented?"pl-8 pr-4":this.relaxed?"px-4":this.indented?"pl-4":""}render(){const t=this.isLink(),i=this.isButton(),s=this.isAccordion(),o=(this.hasSlotController.test("[default]"),this.hasSlotController.test("main"),this.hasSlotController.test("description")),r=this.hasSlotController.test("children"),l=t?a`a`:s?a`summary`:a`button`,h=this.vertical?"pb-3":"pb-2",c=n`<${l} part="base" class="${e("px-4 hover:bg-neutral-200 group transition-all min-h-[48px] cursor-pointer relative focus-visible:focus-outline",{base:"text-base",lg:"text-lg",sm:"text-[14px]"}[this.size],this.disabled?"text-neutral-500 pointer-events-none":"text-primary",s?"flex flex-col":"inline-block w-full",this.divider&&this.vertical&&"mt-0.25")}" aria-controls="${d(s?"navigation-item-details":void 0)}" aria-current="${d(this.current?"page":void 0)}" aria-disabled="${this.disabled}" ?disabled="${d(i?this.disabled:void 0)}" href="${d(t?this.href:void 0)}" target="${d(t?this.target:void 0)}" download="${d(t?this.download:void 0)}" rel="${d(t&&this.target?"noreferrer noopener":void 0)}" role="${t?"link":"button"}" tabindex="${this.disabled?"-1":"0"}" @click="${s?this.handleClickSummary:i?this.handleClickButton:void 0}"><div part="current-indicator" class="${e("absolute left-0 pointer-events-none transition-all duration-150",this.vertical?"w-1 h-[calc(100%-16px)] top-2 group-hover:h-full group-hover:top-0":"h-1 w-full bottom-0",this.current?"bg-accent":"bg-transparent",this.disabled&&"bg-neutral-500")}"></div><span part="content-area" class="${e("relative pt-3 inline-flex justify-between items-center",s?"grow":"w-full",o?"pb-1":h,this.calculatePaddingX())}">${this.divider&&this.vertical?n`<sd-divider part="divider" class="${e("w-full transition-all absolute -top-0.25 left-0",this.calculatePaddingX())}"></sd-divider>`:""} <span part="content-container" class="inline-flex items-center flex-auto"><slot part="content" class="inline"></slot></span>${(this.chevron||r)&&this.vertical?n`<sd-icon name="chevron-down" part="chevron" library="system" color="currentColor" class="${e("h-6 w-6 ml-2 transition-all",s?this.open?"rotate-180":"rotate-0":"rotate-[270deg]")}"></sd-icon>`:""} </span>${o&&this.vertical?n`<slot name="description" part="description" class="${e("inline-block text-sm text-left text-black",s?"grow":"w-full",h,this.calculatePaddingX())}"></slot>`:""}</${l}>`;return s?n`<details part="details" id="navigation-item-details" ?open="${this.open}" class="relative flex">${c}<slot name="children"></slot></details>`:n`${c}`}};u.styles=[i,t.styles,s`:host{position:relative;box-sizing:border-box;display:inline-block}:host([vertical]){display:block}details summary::-webkit-details-marker{display:none}`],p([o({reflect:!0})],u.prototype,"href",2),p([o()],u.prototype,"target",2),p([o()],u.prototype,"download",2),p([o({type:Boolean,reflect:!0})],u.prototype,"current",2),p([o({type:Boolean,reflect:!0})],u.prototype,"disabled",2),p([o({reflect:!0})],u.prototype,"size",2),p([o({type:Boolean,reflect:!0})],u.prototype,"vertical",2),p([o({type:Boolean,reflect:!0})],u.prototype,"chevron",2),p([o({type:Boolean,reflect:!0})],u.prototype,"indented",2),p([o({type:Boolean,reflect:!0})],u.prototype,"relaxed",2),p([o({type:Boolean,reflect:!0})],u.prototype,"divider",2),p([o({type:Boolean,reflect:!0})],u.prototype,"open",2),u=p([r("sd-navigation-item")],u);export{u as default};
+import{S as t,t as e,c as i,i as s,n as r,a as o}from"./solid-components2.js";import{H as l}from"./slot.js";import{s as a,n}from"./static.js";import{o as d}from"./if-defined.js";var h=Object.defineProperty,c=Object.getOwnPropertyDescriptor,p=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?c(e,i):e,l=t.length-1;l>=0;l--)(r=t[l])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&h(e,i,o),o};let u=class extends t{constructor(){super(...arguments),this.hasSlotController=new l(this,"[default]","description","children"),this.current=!1,this.disabled=!1,this.size="base",this.vertical=!1,this.chevron=!1,this.indented=!1,this.relaxed=!1,this.divider=!1,this.open=!1}isButton(){return!this.href&&!this.hasSlotController.test("children")}isLink(){return!!this.href}isAccordion(){return!this.href&&this.hasSlotController.test("children")}handleClickButton(t){this.disabled&&(t.preventDefault(),t.stopPropagation())}handleClickSummary(t){t.preventDefault(),t.stopPropagation(),this.disabled||(this.open?this.hideDetails():this.showDetails())}hideDetails(){this.open=!1,this.emit("sd-hide",{cancelable:!0})}showDetails(){this.open=!0,this.emit("sd-show",{cancelable:!0})}calculatePaddingX(){return this.relaxed&&this.indented?"pl-8 pr-4":this.relaxed?"px-4":this.indented?"pl-4":""}render(){const t=this.isLink(),i=this.isButton(),s=this.isAccordion(),r=(this.hasSlotController.test("[default]"),this.hasSlotController.test("main"),this.hasSlotController.test("description")),o=this.hasSlotController.test("children"),l=t?a`a`:s?a`summary`:a`button`,h=this.vertical?"pb-3":"pb-2",c=n`<${l} part="base" class="${e("px-4 hover:bg-neutral-200 group transition-all min-h-[48px] cursor-pointer relative focus-visible:focus-outline",{base:"text-base",lg:"text-lg",sm:"text-[14px]"}[this.size],this.disabled?"text-neutral-500 pointer-events-none":"text-primary",s?"flex flex-col":"inline-block w-full",this.divider&&this.vertical&&"mt-0.25",!this.vertical&&"inline-flex items-center")}" aria-controls="${d(s?"navigation-item-details":void 0)}" aria-current="${d(this.current?"page":void 0)}" aria-disabled="${this.disabled}" ?disabled="${d(i?this.disabled:void 0)}" href="${d(t?this.href:void 0)}" target="${d(t?this.target:void 0)}" download="${d(t?this.download:void 0)}" rel="${d(t&&this.target?"noreferrer noopener":void 0)}" role="${t?"link":"button"}" tabindex="${this.disabled?"-1":"0"}" @click="${s?this.handleClickSummary:i?this.handleClickButton:void 0}"><div part="current-indicator" class="${e("absolute left-0 pointer-events-none transition-all duration-150",this.vertical?"w-1 h-[calc(100%-16px)] top-2 group-hover:h-full group-hover:top-0":"h-1 w-full bottom-0",this.current?"bg-accent":"bg-transparent",this.disabled&&"bg-neutral-500")}"></div><span part="content-area" class="${e("relative pt-3 inline-flex justify-between items-center",s?"grow":"w-full",r?"pb-1":h,this.calculatePaddingX())}">${this.divider&&this.vertical?n`<sd-divider part="divider" class="${e("w-full transition-all absolute -top-0.25 left-0",this.calculatePaddingX())}"></sd-divider>`:""} <span part="content-container" class="inline-flex items-center flex-auto"><slot part="content" class="inline"></slot></span>${(this.chevron||o)&&this.vertical?n`<sd-icon name="chevron-down" part="chevron" library="system" color="currentColor" class="${e("h-6 w-6 ml-2 transition-all",s?this.open?"rotate-180":"rotate-0":"rotate-[270deg]")}"></sd-icon>`:""} </span>${r&&this.vertical?n`<slot name="description" part="description" class="${e("inline-block text-sm text-left text-black",s?"grow":"w-full",h,this.calculatePaddingX())}"></slot>`:""}</${l}>`;return s?n`<details part="details" id="navigation-item-details" ?open="${this.open}" class="relative flex">${c}<slot name="children"></slot></details>`:n`${c}`}};u.styles=[i,t.styles,s`:host{position:relative;box-sizing:border-box;display:inline-block}:host([vertical]){display:block}details summary::-webkit-details-marker{display:none}`],p([r({reflect:!0})],u.prototype,"href",2),p([r()],u.prototype,"target",2),p([r()],u.prototype,"download",2),p([r({type:Boolean,reflect:!0})],u.prototype,"current",2),p([r({type:Boolean,reflect:!0})],u.prototype,"disabled",2),p([r({reflect:!0})],u.prototype,"size",2),p([r({type:Boolean,reflect:!0})],u.prototype,"vertical",2),p([r({type:Boolean,reflect:!0})],u.prototype,"chevron",2),p([r({type:Boolean,reflect:!0})],u.prototype,"indented",2),p([r({type:Boolean,reflect:!0})],u.prototype,"relaxed",2),p([r({type:Boolean,reflect:!0})],u.prototype,"divider",2),p([r({type:Boolean,reflect:!0})],u.prototype,"open",2),u=p([o("sd-navigation-item")],u);export{u as default};