@vanelsas/baredom 1.3.0 → 2.0.0
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.
- package/CHANGELOG.md +37 -1
- package/README.md +60 -6
- package/dist/base.js +397 -373
- package/dist/x-alert.js +19 -19
- package/dist/x-avatar-group.js +11 -11
- package/dist/x-avatar.js +16 -16
- package/dist/x-badge.js +11 -11
- package/dist/x-bento-grid.js +5 -5
- package/dist/x-bento-item.js +4 -4
- package/dist/x-breadcrumbs.js +14 -14
- package/dist/x-button.js +16 -16
- package/dist/x-cancel-dialogue.js +17 -17
- package/dist/x-card.js +7 -7
- package/dist/x-chart.js +47 -47
- package/dist/x-checkbox.js +11 -11
- package/dist/x-chip.js +9 -9
- package/dist/x-collapse.js +11 -11
- package/dist/x-command-palette.js +31 -31
- package/dist/x-container.js +6 -6
- package/dist/x-context-menu.js +20 -19
- package/dist/x-copy.js +24 -24
- package/dist/x-currency-field.js +22 -22
- package/dist/x-date-picker.js +41 -41
- package/dist/x-divider.js +13 -13
- package/dist/x-drawer.js +11 -11
- package/dist/x-dropdown.js +10 -10
- package/dist/x-fieldset.js +6 -6
- package/dist/x-file-download.js +7 -7
- package/dist/x-form-field.js +16 -16
- package/dist/x-form.js +10 -10
- package/dist/x-gaussian-blur.js +18 -18
- package/dist/x-grid.js +6 -6
- package/dist/x-kinetic-font.js +29 -0
- package/dist/x-kinetic-typography.js +39 -61
- package/dist/x-liquid-dock.js +40 -0
- package/dist/x-liquid-fill.js +45 -0
- package/dist/x-liquid-glass.js +48 -0
- package/dist/x-menu-item.js +10 -10
- package/dist/x-menu.js +12 -12
- package/dist/x-metaball-cursor.js +28 -27
- package/dist/x-modal.js +12 -12
- package/dist/x-morph-stack.js +41 -0
- package/dist/x-navbar.js +13 -13
- package/dist/x-neural-glow.js +34 -34
- package/dist/x-notification-center.js +9 -10
- package/dist/x-organic-divider.js +19 -19
- package/dist/x-organic-progress.js +38 -38
- package/dist/x-organic-shape.js +14 -14
- package/dist/x-pagination.js +16 -16
- package/dist/x-popover.js +14 -14
- package/dist/x-progress-circle.js +10 -10
- package/dist/x-progress.js +11 -11
- package/dist/x-radio.js +12 -12
- package/dist/x-ripple-effect.js +12 -13
- package/dist/x-scroll-parallax.js +19 -19
- package/dist/x-scroll-stack.js +18 -18
- package/dist/x-scroll-story.js +36 -37
- package/dist/x-scroll-timeline.js +47 -50
- package/dist/x-scroll.js +41 -41
- package/dist/x-search-field.js +15 -15
- package/dist/x-select.js +10 -10
- package/dist/x-sidebar.js +17 -17
- package/dist/x-skeleton.js +6 -6
- package/dist/x-slider.js +16 -16
- package/dist/x-soft-body.js +23 -0
- package/dist/x-spacer.js +5 -5
- package/dist/x-spinner.js +6 -6
- package/dist/x-splash.js +14 -14
- package/dist/x-stat.js +11 -11
- package/dist/x-stepper.js +16 -16
- package/dist/x-switch.js +11 -11
- package/dist/x-tab.js +8 -8
- package/dist/x-table-cell.js +23 -23
- package/dist/x-table-row.js +10 -10
- package/dist/x-table.js +16 -16
- package/dist/x-tabs.js +11 -11
- package/dist/x-text-area.js +18 -18
- package/dist/x-theme.js +25 -0
- package/dist/x-timeline-item.js +24 -24
- package/dist/x-timeline.js +9 -9
- package/dist/x-toast.js +25 -25
- package/dist/x-toaster.js +8 -8
- package/dist/x-typography.js +11 -10
- package/package.json +30 -2
package/dist/x-progress.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { $APP, shadow$provide } from "./base.js";
|
|
2
|
-
var
|
|
3
|
-
$APP.
|
|
4
|
-
$APP.
|
|
5
|
-
$APP.
|
|
6
|
-
a.setAttribute("aria-valuemax",""+$APP.
|
|
7
|
-
""+$APP.
|
|
8
|
-
"showValue",{get:function(){return this.hasAttribute("show-value")},set:function(b){return $APP.
|
|
9
|
-
b:""},set:function(b){return this.setAttribute("size",""+$APP.
|
|
10
|
-
c=document.createElement("style"),d=document.createElement("div"),e=document.createElement("div"),g=document.createElement("span"),h=document.createElement("span"),k=document.createElement("div"),m=document.createElement("div");c.textContent=":host{display:block;color-scheme:light dark;box-sizing:border-box;--x-progress-border-radius:9999px;--x-progress-track-color:rgba(0,0,0,0.10);--x-progress-fill-color
|
|
11
|
-
d.setAttribute("part","base");e.setAttribute("part","header");g.setAttribute("part","label-text");h.setAttribute("part","value-text");k.setAttribute("part","track");m.setAttribute("part","fill");e.appendChild(g);e.appendChild(h);k.appendChild(m);d.appendChild(e);d.appendChild(k);b.appendChild(c);b.appendChild(d);this.__xProgressBase=d;this.__xProgressHeader=e;this.__xProgressFill=m;this.__xProgressLabel=g;this.__xProgressValue=h;this.__xProgressInit=!0}
|
|
12
|
-
function(){return null};a.prototype.attributeChangedCallback=function(b,c,d){$APP.O(c,d)&&$APP.
|
|
2
|
+
var g_=function(a,b){return typeof a==="string"?(a=parseFloat(a),$APP.r(isNaN(a))?b:a):b},j_=function(a){var b=new $APP.P(null,7,[$APP.ri,a.getAttribute("value"),$APP.ak,a.getAttribute("max"),$APP.Fh,a.getAttribute("variant"),$APP.rh,a.getAttribute("size"),$APP.T,a.getAttribute("label"),$APP.yj,a.hasAttribute("show-value"),$APP.ol,a.hasAttribute("indeterminate")],null);var c=$APP.N(b),d=$APP.G(c,$APP.ak),e=$APP.G(c,$APP.ri),g=$APP.G(c,$APP.Fh),h=$APP.G(c,$APP.rh);b=$APP.G(c,$APP.T);var k=$APP.G(c,
|
|
3
|
+
$APP.yj);c=$APP.G(c,$APP.ol);d=g_(d,100);d=d>0?d:100;e=$APP.Zg.i($APP.Yg.i(g_(e,0),0),d);g=typeof g==="string"&&$APP.J(h_,g)?g:"default";h=typeof h==="string"&&$APP.J(i_,h)?h:"md";c=$APP.I(c);k=$APP.I(k);var m=c?50:$APP.Zg.i($APP.Yg.i(e/d*100,0),100);b=$APP.Q([$APP.Fh,$APP.yj,$APP.ri,$APP.rh,$APP.ol,$APP.Ol,$APP.ak,$APP.T,$APP.Rk],[g,k,e,h,c,c?"Loading…":""+$APP.S.g(Math.round(m))+"%",d,typeof b==="string"&&$APP.O("",b)?b:null,m]);var p=$APP.N(b);b=$APP.G(p,$APP.Rk);k=$APP.G(p,$APP.Fh);d=$APP.G(p,
|
|
4
|
+
$APP.yj);h=$APP.G(p,$APP.ri);c=$APP.G(p,$APP.rh);e=$APP.G(p,$APP.Ol);g=$APP.G(p,$APP.ol);m=$APP.G(p,$APP.T);p=$APP.G(p,$APP.ak);var q=$APP.l(a,"__xProgressBase"),w=$APP.l(a,"__xProgressHeader"),x=$APP.l(a,"__xProgressFill"),y=$APP.l(a,"__xProgressLabel"),A=$APP.l(a,"__xProgressValue");var B=(B=m!=null)?B:d;var E=$APP.l(a,"__xProgressCompleted"),H=$APP.t(g)&&h>=p;q.setAttribute("data-variant",k);q.setAttribute("data-size",c);q.setAttribute("data-indeterminate",$APP.r(g)?"true":"false");x.style.width=
|
|
5
|
+
$APP.r(g)?"40%":""+$APP.S.g(b.toFixed(2))+"%";w.style.display=$APP.r(B)?"flex":"none";y.textContent=$APP.r(m)?m:"";y.style.display=m!=null?"":"none";A.textContent=$APP.r($APP.r(d)?$APP.t(g):d)?""+$APP.S.g(Math.round(b))+"%":"";A.style.display=$APP.r(d)?"":"none";a.setAttribute("role","progressbar");a.setAttribute("aria-valuemin","0");$APP.r(g)?(a.removeAttribute("aria-valuenow"),a.setAttribute("aria-busy","true"),a.setAttribute("aria-valuetext",e)):(a.setAttribute("aria-valuenow",""+$APP.S.g(h)),
|
|
6
|
+
a.setAttribute("aria-valuemax",""+$APP.S.g(p)),a.setAttribute("aria-valuetext",e),a.removeAttribute("aria-busy"));m!=null?a.setAttribute("aria-label",m):a.removeAttribute("aria-label");H&&$APP.t(E)&&a.dispatchEvent(new CustomEvent("x-progress-complete",{bubbles:!0,composed:!0,detail:{value:h,max:p}}));a.__xProgressCompleted=$APP.I(H)},k_=function(a){Object.defineProperty(a,"value",{get:function(){var b=this.getAttribute("value");return $APP.r(b)?b:"0"},set:function(b){return this.setAttribute("value",
|
|
7
|
+
""+$APP.S.g(b))},enumerable:!0,configurable:!0});Object.defineProperty(a,"max",{get:function(){var b=this.getAttribute("max");return $APP.r(b)?b:"100"},set:function(b){return this.setAttribute("max",""+$APP.S.g(b))},enumerable:!0,configurable:!0});Object.defineProperty(a,"indeterminate",{get:function(){return this.hasAttribute("indeterminate")},set:function(b){return $APP.r(b)?this.setAttribute("indeterminate",""):this.removeAttribute("indeterminate")},enumerable:!0,configurable:!0});Object.defineProperty(a,
|
|
8
|
+
"showValue",{get:function(){return this.hasAttribute("show-value")},set:function(b){return $APP.r(b)?this.setAttribute("show-value",""):this.removeAttribute("show-value")},enumerable:!0,configurable:!0});Object.defineProperty(a,"variant",{get:function(){var b=this.getAttribute("variant");return $APP.r(b)?b:""},set:function(b){return this.setAttribute("variant",""+$APP.S.g(b))},enumerable:!0,configurable:!0});Object.defineProperty(a,"size",{get:function(){var b=this.getAttribute("size");return $APP.r(b)?
|
|
9
|
+
b:""},set:function(b){return this.setAttribute("size",""+$APP.S.g(b))},enumerable:!0,configurable:!0});Object.defineProperty(a,"label",{get:function(){return this.getAttribute("label")},set:function(b){return $APP.r(b)?this.setAttribute("label",""+$APP.S.g(b)):this.removeAttribute("label")},enumerable:!0,configurable:!0})},m_=function(){var a=class extends HTMLElement{};a.observedAttributes=l_;a.prototype.connectedCallback=function(){if(!$APP.r($APP.l(this,"__xProgressInit"))){var b=this.attachShadow({mode:"open"}),
|
|
10
|
+
c=document.createElement("style"),d=document.createElement("div"),e=document.createElement("div"),g=document.createElement("span"),h=document.createElement("span"),k=document.createElement("div"),m=document.createElement("div");c.textContent=":host{display:block;color-scheme:light dark;box-sizing:border-box;--x-progress-border-radius:var(--x-radius-full,9999px);--x-progress-track-color:rgba(0,0,0,0.10);--x-progress-fill-color:var(--x-color-primary,#3b82f6);--x-progress-label-color:rgba(0,0,0,0.60);--x-progress-value-color:rgba(0,0,0,0.50);}@media (prefers-color-scheme:dark){:host{--x-progress-track-color:rgba(255,255,255,0.12);--x-progress-label-color:rgba(255,255,255,0.60);--x-progress-value-color:rgba(255,255,255,0.50);}}[part\x3dbase][data-size\x3d'sm']{--x-progress-height:4px;}[part\x3dbase][data-size\x3d'md']{--x-progress-height:8px;}[part\x3dbase][data-size\x3d'lg']{--x-progress-height:12px;}[part\x3dbase][data-variant\x3d'success']{--x-progress-fill-color:var(--x-color-success,#22c55e);}[part\x3dbase][data-variant\x3d'warning']{--x-progress-fill-color:var(--x-color-warning,#f59e0b);}[part\x3dbase][data-variant\x3d'danger']{--x-progress-fill-color:var(--x-color-danger,#ef4444);}[part\x3dbase]{width:100%;box-sizing:border-box;}[part\x3dheader]{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px;}[part\x3dlabel-text]{font-size:var(--x-font-size-sm,0.875rem);color:var(--x-progress-label-color);font-weight:500;}[part\x3dvalue-text]{font-size:0.8125rem;color:var(--x-progress-value-color);}[part\x3dtrack]{height:var(--x-progress-height,8px);border-radius:var(--x-progress-border-radius,9999px);background:var(--x-progress-track-color);overflow:hidden;position:relative;}[part\x3dfill]{height:100%;background:var(--x-progress-fill-color);border-radius:var(--x-progress-border-radius,9999px);transition:width 0.3s ease;width:0%;}@keyframes x-progress-indeterminate{0%{transform:translateX(-100%) scaleX(0.5);}50%{transform:translateX(60%) scaleX(0.8);}100%{transform:translateX(200%) scaleX(0.5);}}[part\x3dbase][data-indeterminate\x3d'true'] [part\x3dfill]{animation:x-progress-indeterminate 1.5s ease infinite;width:40%;transform-origin:left center;}@media (prefers-reduced-motion:reduce){[part\x3dfill]{transition:none;}[part\x3dbase][data-indeterminate\x3d'true'] [part\x3dfill]{animation:none;width:50%;}}";
|
|
11
|
+
d.setAttribute("part","base");e.setAttribute("part","header");g.setAttribute("part","label-text");h.setAttribute("part","value-text");k.setAttribute("part","track");m.setAttribute("part","fill");e.appendChild(g);e.appendChild(h);k.appendChild(m);d.appendChild(e);d.appendChild(k);b.appendChild(c);b.appendChild(d);this.__xProgressBase=d;this.__xProgressHeader=e;this.__xProgressFill=m;this.__xProgressLabel=g;this.__xProgressValue=h;this.__xProgressInit=!0}j_(this);return null};a.prototype.disconnectedCallback=
|
|
12
|
+
function(){return null};a.prototype.attributeChangedCallback=function(b,c,d){$APP.O(c,d)&&$APP.r($APP.l(this,"__xProgressInit"))&&j_(this);return null};k_(a.prototype);return a},n_=function(){$APP.r(customElements.get("x-progress"))||customElements.define("x-progress",m_());return null};var h_=new $APP.R(null,new $APP.P(null,4,["success",null,"warning",null,"danger",null,"default",null],null),null),i_=new $APP.R(null,new $APP.P(null,3,["md",null,"lg",null,"sm",null],null),null),l_="value max variant size label show-value indeterminate".split(" ");$APP.Sd(["x-progress-complete",new $APP.P(null,1,[$APP.U,new $APP.P(null,2,[$APP.ri,$APP.V,$APP.ak,$APP.V],null)],null)]);$APP.ka("baredom.exports.x_progress.init",n_);export const init=n_;
|
package/dist/x-radio.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { $APP, shadow$provide } from "./base.js";
|
|
2
|
-
var
|
|
3
|
-
$APP.
|
|
4
|
-
e=$APP.
|
|
5
|
-
$APP.
|
|
6
|
-
function(a){a=
|
|
7
|
-
{detail:b,bubbles:!0,composed:!0,cancelable:!1}))},
|
|
8
|
-
$APP.l(a,"control").focus():null},
|
|
9
|
-
$APP.l(a,"__xRadioRefs");if($APP.
|
|
10
|
-
get:function(){var d=this.getAttribute(c);return $APP.
|
|
11
|
-
"__xRadioRefs"))){var c=this.attachShadow({mode:"open"}),d=document.createElement("style"),e=document.createElement("button"),g=document.createElement("span");d.textContent=":host{display:inline-block;vertical-align:middle;color-scheme:light dark;--x-radio-size:16px;--x-radio-border-width:2px;--x-radio-border-color
|
|
12
|
-
e.setAttribute("part","control");e.setAttribute("type","button");e.setAttribute("role","radio");g.setAttribute("part","dot");e.appendChild(g);c.appendChild(d);c.appendChild(e);this.__xRadioRefs={root:c,control:e,dot:g};$APP.
|
|
13
|
-
g);
|
|
2
|
+
var vr=function(a,b,c){return a.setAttribute(b,c)},wr=function(a,b,c){return $APP.r(c)?a.setAttribute(b,""):a.removeAttribute(b)},xr=function(a){a=$APP.Q([$APP.Fk,$APP.Sk,$APP.sh,$APP.Dh,$APP.Mi,$APP.cj,$APP.wl,$APP.kj,$APP.Ui],[a.getAttribute("name"),a.hasAttribute("disabled"),a.hasAttribute("required"),a.getAttribute("aria-labelledby"),a.hasAttribute("checked"),a.hasAttribute("readonly"),a.getAttribute("value"),a.getAttribute("aria-label"),a.getAttribute("aria-describedby")]);var b=$APP.N(a);a=
|
|
3
|
+
$APP.G(b,$APP.kj);var c=$APP.G(b,$APP.Ui),d=$APP.G(b,$APP.Fk),e=$APP.G(b,$APP.Sk),g=$APP.G(b,$APP.sh),h=$APP.G(b,$APP.Dh),k=$APP.G(b,$APP.Mi),m=$APP.G(b,$APP.cj);b=$APP.G(b,$APP.wl);k=$APP.I(k);g=$APP.I(g);return $APP.Q([$APP.Lh,$APP.Gh,$APP.Tl,$APP.Wi,$APP.xh,$APP.Si,$APP.ri,$APP.sj,$APP.Pl,$APP.Uk,$APP.W],[g,k?"true":"false",$APP.I(m),k,$APP.r(g)?k:!0,d,b!=null?b:"on",h,c,a,$APP.I(e)])},yr=function(a){var b=$APP.l(a,"__xRadioRefs");if($APP.r(b)){var c=$APP.l(b,"control");b=xr(a);var d=$APP.W.g(b),
|
|
4
|
+
e=$APP.Wi.g(b);vr(c,"aria-checked",$APP.Gh.g(b));c.setAttribute("aria-disabled",$APP.r(d)?"true":"false");vr(c,"aria-required",$APP.r($APP.Lh.g(b))?"true":"false");vr(c,"aria-readonly",$APP.r($APP.Tl.g(b))?"true":"false");var g=$APP.Uk.g(b);$APP.r(g)?c.setAttribute("aria-label",g):c.removeAttribute("aria-label");g=$APP.sj.g(b);$APP.r(g)?c.setAttribute("aria-labelledby",g):c.removeAttribute("aria-labelledby");g=$APP.Pl.g(b);$APP.r(g)?c.setAttribute("aria-describedby",g):c.removeAttribute("aria-describedby");
|
|
5
|
+
$APP.r(d)?c.setAttribute("disabled",""):c.removeAttribute("disabled");wr(a,"data-checked",e);wr(a,"data-disabled",d);a=$APP.l(a,"__xRadioInternals");return $APP.r(a)?a.setFormValue($APP.r(e)?$APP.ri.g(b):null):null}return null},zr=function(a){var b=a.getAttribute("name"),c=$APP.r(a.form)?a.form:null;c=$APP.r(c)?c:document;if($APP.r($APP.r(b)?$APP.O(b,""):b)){var d=[];c.querySelectorAll("x-radio").forEach(function(e){return $APP.D.i(e.getAttribute("name"),b)?d.push(e):null});return d}return[a]},Ar=
|
|
6
|
+
function(a){a=zr(a);var b=a.find(function(d){return d.hasAttribute("checked")}),c=a.length>0?a[0]:null;return a.forEach(function(d){var e=$APP.l(d,"__xRadioRefs");return $APP.r(e)?(e=$APP.l(e,"control"),d=$APP.r(b)?$APP.D.i(d,b)?0:-1:$APP.D.i(d,c)?0:-1,e.tabIndex=d):null})},Br=function(a,b){b=new CustomEvent("x-radio-change-request",{detail:b,bubbles:!0,composed:!0,cancelable:!0});a.dispatchEvent(b);return $APP.t(b.defaultPrevented)},Cr=function(a,b){return a.dispatchEvent(new CustomEvent("x-radio-change",
|
|
7
|
+
{detail:b,bubbles:!0,composed:!0,cancelable:!1}))},Dr=function(a){var b=xr(a),c=$APP.W.g(b),d=$APP.Tl.g(b),e=$APP.Wi.g(b);if($APP.r($APP.r(c)?c:$APP.r(d)?d:e))return null;b=$APP.ri.g(b);return Br(a,{value:b,previousChecked:!1,nextChecked:!0})?(a.setAttribute("checked",""),yr(a),zr(a).forEach(function(g){var h=$APP.O(g,a);return $APP.r(h?g.hasAttribute("checked"):h)?(g.removeAttribute("checked"),yr(g)):null}),Ar(a),Cr(a,{value:b,checked:!0})):null},Er=function(a){a=$APP.l(a,"__xRadioRefs");return $APP.r(a)?
|
|
8
|
+
$APP.l(a,"control").focus():null},Fr=function(a){return function(b){var c=b.key,d=zr(a),e=d.length,g=d.indexOf(a);if($APP.D.i(c," ")||$APP.D.i(c,"Enter"))return b.preventDefault(),Dr(a);if($APP.D.i(c,"ArrowDown")||$APP.D.i(c,"ArrowRight")){if(b.preventDefault(),e>0)return b=d[$APP.hd(g+1,e)],Dr(b),Er(b)}else if($APP.D.i(c,"ArrowUp")||$APP.D.i(c,"ArrowLeft"))if(b.preventDefault(),e>0)return b=d[$APP.hd(g-1,e)],Dr(b),Er(b);return null}},Gr=function(a){return function(){return Dr(a)}},Hr=function(a){var b=
|
|
9
|
+
$APP.l(a,"__xRadioRefs");if($APP.r(b)){var c=$APP.l(a,"__xRadioHandlers");if($APP.r(c)){b=$APP.l(b,"control");a.removeEventListener("click",$APP.l(c,"click"));b.removeEventListener("keydown",$APP.l(c,"keydown"));a.__xRadioHandlers=null;return}}return null},Ir=function(a,b,c){Object.defineProperty(a,b,{configurable:!0,enumerable:!0,get:function(){return this.hasAttribute(c)},set:function(d){return wr(this,c,$APP.I(d))}})},Jr=function(a,b,c){Object.defineProperty(a,b,{configurable:!0,enumerable:!0,
|
|
10
|
+
get:function(){var d=this.getAttribute(c);return $APP.r(d)?d:null},set:function(d){return d!=null&&$APP.O(d)?vr(this,c,""+$APP.S.g(d)):this.removeAttribute(c)}})},Zr=function(){var a=class extends HTMLElement{},b=a.prototype;a.formAssociated=!0;Object.defineProperty(a,"observedAttributes",{get:function(){return Kr}});Ir(b,"checked","checked");Ir(b,"disabled","disabled");Ir(b,"readOnly","readonly");Ir(b,"required","required");Jr(b,"name","name");Jr(b,"value","value");b.connectedCallback=function(){if(!$APP.r($APP.l(this,
|
|
11
|
+
"__xRadioRefs"))){var c=this.attachShadow({mode:"open"}),d=document.createElement("style"),e=document.createElement("button"),g=document.createElement("span");d.textContent=":host{display:inline-block;vertical-align:middle;color-scheme:light dark;--x-radio-size:16px;--x-radio-border-width:2px;--x-radio-border-color:var(--x-color-border,#6b7280);--x-radio-bg:var(--x-color-surface,#ffffff);--x-radio-checked-color:var(--x-color-primary,#2563eb);--x-radio-dot-size:6px;--x-radio-focus-ring:var(--x-color-focus-ring,#60a5fa);--x-radio-disabled-opacity:0.45;--x-radio-transition:background var(--x-transition-duration,120ms) var(--x-transition-easing,ease),border-color var(--x-transition-duration,120ms) var(--x-transition-easing,ease);}@media (prefers-color-scheme:dark){:host{--x-radio-border-color:var(--x-color-border,#9ca3af);--x-radio-bg:var(--x-color-surface,#1f2937);--x-radio-checked-color:var(--x-color-primary,#3b82f6);--x-radio-focus-ring:var(--x-color-focus-ring,#93c5fd);}}[part\x3dcontrol]{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;width:var(--x-radio-size);height:var(--x-radio-size);border:var(--x-radio-border-width) solid var(--x-radio-border-color);border-radius:50%;background:var(--x-radio-bg);transition:var(--x-radio-transition);cursor:pointer;flex-shrink:0;position:relative;}[part\x3dcontrol][disabled]{cursor:default;opacity:var(--x-radio-disabled-opacity);}[part\x3dcontrol]:focus-visible{outline:none;box-shadow:0 0 0 3px var(--x-radio-focus-ring);}:host([data-checked]) [part\x3dcontrol]{border-color:var(--x-radio-checked-color);}[part\x3ddot]{display:block;width:var(--x-radio-dot-size);height:var(--x-radio-dot-size);border-radius:50%;background:var(--x-radio-checked-color);opacity:0;transition:opacity 100ms ease;}:host([data-checked]) [part\x3ddot]{opacity:1;}@media (prefers-reduced-motion:reduce){[part\x3dcontrol]{transition:none;}[part\x3ddot]{transition:none;}}";
|
|
12
|
+
e.setAttribute("part","control");e.setAttribute("type","button");e.setAttribute("role","radio");g.setAttribute("part","dot");e.appendChild(g);c.appendChild(d);c.appendChild(e);this.__xRadioRefs={root:c,control:e,dot:g};$APP.r(this.attachInternals)&&(this.__xRadioInternals=this.attachInternals())}Hr(this);c=$APP.l(this,"__xRadioRefs");$APP.r(c)&&(c=$APP.l(c,"control"),d=Gr(this),e=Fr(this),g={click:d,keydown:e},this.addEventListener("click",d),c.addEventListener("keydown",e),this.__xRadioHandlers=
|
|
13
|
+
g);yr(this);return Ar(this)};b.disconnectedCallback=function(){return Hr(this)};b.attributeChangedCallback=function(){return yr(this)};b.formDisabledCallback=function(c){wr(this,"disabled",$APP.I(c));return yr(this)};b.formResetCallback=function(){this.removeAttribute("checked");return yr(this)};return a},$r=function(){return $APP.r(customElements.get("x-radio"))?null:customElements.define("x-radio",Zr())};var Kr="checked disabled readonly required name value aria-label aria-describedby aria-labelledby".split(" ");$APP.Sd(["x-radio-change-request",new $APP.P(null,2,[$APP.ll,!0,$APP.U,new $APP.P(null,3,[$APP.ri,$APP.X,$APP.Ej,$APP.qj,$APP.Yk,$APP.qj],null)],null),"x-radio-change",new $APP.P(null,2,[$APP.ll,!1,$APP.U,new $APP.P(null,2,[$APP.ri,$APP.X,$APP.Il,$APP.qj],null)],null)]);$APP.ka("baredom.exports.x_radio.init",$r);export const init=$r;
|
package/dist/x-ripple-effect.js
CHANGED
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
import { $APP, shadow$provide } from "./base.js";
|
|
2
|
-
var
|
|
3
|
-
"__xRippleRefs");if($APP.
|
|
4
|
-
g.style.width="0";g.style.height="0";g.style.overflow="hidden";b.appendChild(c);b.appendChild(d);b.appendChild(g);a.__xRippleRefs=new $APP.
|
|
5
|
-
|
|
6
|
-
e.setAttribute("baseFrequency",""+$APP.
|
|
7
|
-
$APP.N(c);var d=$APP.
|
|
8
|
-
{detail:{x,y},bubbles:!0,composed:!0}));b?(
|
|
9
|
-
1)return k.removeChild(p),k.childNodes.length===0&&(h.style.filter=""),a.dispatchEvent(new CustomEvent("x-ripple-effect-end",{detail:{x,y},bubbles:!0,composed:!0}));F=requestAnimationFrame(H);return
|
|
10
|
-
"__xRippleRefs");if($APP.
|
|
11
|
-
configurable:!0});Object.defineProperty(a,"duration",{get:function(){return
|
|
12
|
-
"disabled",{get:function(){return this.hasAttribute("disabled")},set:function(b){return $APP.
|
|
13
|
-
|
|
14
|
-
uI=new $APP.M(null,"frequency","frequency",-1408891382);var DI=["intensity","duration","frequency","disabled"];$APP.Ed(["x-ripple-effect-start",new $APP.R(null,2,[$APP.V,new $APP.R(null,2,[$APP.Zj,$APP.W,$APP.Yj,$APP.W],null),$APP.rk,!1],null),"x-ripple-effect-end",new $APP.R(null,2,[$APP.V,new $APP.R(null,2,[$APP.Zj,$APP.W,$APP.Yj,$APP.W],null),$APP.rk,!1],null)]);$APP.ja("baredom.exports.x_ripple_effect.init",FI);export const init=FI;
|
|
2
|
+
var LL=function(a){if(typeof a==="string"){a=parseFloat(a.trim());var b=isNaN(a);return $APP.r($APP.r(b)?b:!(a>0))?25:Math.min(100,Math.max(1,a))}return 25},ML=function(a){if(typeof a==="string"){a=parseInt(a.trim(),10);var b=isNaN(a);return $APP.r($APP.r(b)?b:!(a>0))?800:Math.min(5E3,Math.max(100,a))}return 800},NL=function(a){if(typeof a==="string"){a=parseFloat(a.trim());var b=isNaN(a);return $APP.r($APP.r(b)?b:!(a>0))?.04:Math.min(.2,Math.max(.005,a))}return.04},OL=function(a){var b=$APP.l(a,
|
|
3
|
+
"__xRippleRefs");if($APP.r(b))return b;b=a.attachShadow({mode:"open"});var c=document.createElement("style"),d=document.createElement("div"),e=document.createElement("slot"),g=document.createElementNS("http://www.w3.org/2000/svg","svg");c.textContent=":host{display:inline-block;position:relative;}:host([disabled]){cursor:default;}[part\x3dcontainer]{display:block;width:100%;height:100%;}";d.setAttribute("part","container");d.appendChild(e);g.setAttribute("part","filters");g.style.position="absolute";
|
|
4
|
+
g.style.width="0";g.style.height="0";g.style.overflow="hidden";b.appendChild(c);b.appendChild(d);b.appendChild(g);a.__xRippleRefs=new $APP.P(null,3,[$APP.bi,b,$APP.Zi,d,$APP.xj,g],null);a.__xRippleCounter=0;a.__xRippleFrames=[];return $APP.l(a,"__xRippleRefs")},RL=function(a){a=new $APP.P(null,4,[$APP.Nj,a.getAttribute("intensity"),$APP.oi,a.getAttribute("duration"),PL,a.getAttribute("frequency"),$APP.Sk,a.hasAttribute("disabled")],null);var b=$APP.N(a);a=$APP.G(b,$APP.Nj);var c=$APP.G(b,$APP.oi),
|
|
5
|
+
d=$APP.G(b,PL);b=$APP.G(b,$APP.Sk);return new $APP.P(null,4,[$APP.Gj,LL(a),$APP.hk,ML(c),QL,NL(d),$APP.W,$APP.I(b)],null)},UL=function(a,b,c){var d=document.createElementNS("http://www.w3.org/2000/svg","filter"),e=document.createElementNS("http://www.w3.org/2000/svg","feTurbulence"),g=document.createElementNS("http://www.w3.org/2000/svg","feDisplacementMap");d.setAttribute("id",b);d.setAttribute("x","-10%");d.setAttribute("y","-10%");d.setAttribute("width","120%");d.setAttribute("height","120%");
|
|
6
|
+
e.setAttribute("type","turbulence");e.setAttribute("baseFrequency",""+$APP.S.g(c));e.setAttribute("numOctaves","3");e.setAttribute("seed",""+$APP.S.g(Math.floor(Math.random()*1E3)));e.setAttribute("result","turbulence");g.setAttribute("in","SourceGraphic");g.setAttribute("in2","turbulence");g.setAttribute("scale","0");g.setAttribute("xChannelSelector","R");g.setAttribute("yChannelSelector","G");d.appendChild(e);d.appendChild(g);a.appendChild(d);return new $APP.P(null,3,[$APP.kk,d,SL,e,TL,g],null)},
|
|
7
|
+
VL=function(a,b){var c=RL(a);if(!$APP.r($APP.W.g(c))){c=$APP.N(c);var d=$APP.G(c,$APP.Gj),e=$APP.G(c,$APP.hk),g=$APP.G(c,QL);c=OL(a);c=$APP.N(c);var h=$APP.G(c,$APP.Zi),k=$APP.G(c,$APP.xj),m=$APP.l(a,"__xRippleCounter");c="xr-"+$APP.S.g(m);a.__xRippleCounter=m+1;m=UL(k,c,g);m=$APP.N(m);var p=$APP.G(m,$APP.kk),q=$APP.G(m,SL),w=$APP.G(m,TL),x=b.clientX,y=b.clientY,A=performance.now(),B=$APP.l(a,"__xRippleFrames");b=$APP.I(window.matchMedia("(prefers-reduced-motion:reduce)").matches);h.style.filter=
|
|
8
|
+
"url(#"+$APP.S.g(c)+")";a.dispatchEvent(new CustomEvent("x-ripple-effect-start",{detail:{x,y},bubbles:!0,composed:!0}));b?(w.setAttribute("scale",""+$APP.S.g(d/2)),b=requestAnimationFrame(function(){w.setAttribute("scale","0");k.removeChild(p);h.style.filter="";return a.dispatchEvent(new CustomEvent("x-ripple-effect-end",{detail:{x,y},bubbles:!0,composed:!0}))})):b=requestAnimationFrame(function H(){var F=performance.now()-A;F=Math.min(1,F/e);var M=1-F;M=1-M*M*M;var Y=g*(1-M*.7);w.setAttribute("scale",
|
|
9
|
+
""+$APP.S.g(d*(1-M)));q.setAttribute("baseFrequency",""+$APP.S.g(Y));if(F>=1)return k.removeChild(p),k.childNodes.length===0&&(h.style.filter=""),a.dispatchEvent(new CustomEvent("x-ripple-effect-end",{detail:{x,y},bubbles:!0,composed:!0}));F=requestAnimationFrame(H);return B.push(F)});B.push(b)}},WL=function(a){function b(c){c.button===0&&VL(a,c);return null}a.addEventListener("pointerdown",b);a.__xRippleHandler=b},XL=function(a){var b=$APP.l(a,"__xRippleFrames");if($APP.r(b)){for(var c=b.length,
|
|
10
|
+
d=0;;)if(d<c)cancelAnimationFrame(b[d]),d+=1;else break;b.length=0}b=$APP.l(a,"__xRippleRefs");if($APP.r(b)){c=$APP.N(b);b=$APP.G(c,$APP.xj);for(c=$APP.G(c,$APP.Zi);;)if(d=b.firstChild,$APP.r(d))b.removeChild(d);else break;c.style.filter=""}b=$APP.l(a,"__xRippleHandler");$APP.r(b)&&(a.removeEventListener("pointerdown",b),a.__xRippleHandler=null)},YL=function(a){Object.defineProperty(a,"intensity",{get:function(){return LL(this.getAttribute("intensity"))},set:function(b){return b==null?this.removeAttribute("intensity"):
|
|
11
|
+
this.setAttribute("intensity",""+$APP.S.g(b))},enumerable:!0,configurable:!0});Object.defineProperty(a,"duration",{get:function(){return ML(this.getAttribute("duration"))},set:function(b){return b==null?this.removeAttribute("duration"):this.setAttribute("duration",""+$APP.S.g(b|0))},enumerable:!0,configurable:!0});Object.defineProperty(a,"frequency",{get:function(){return NL(this.getAttribute("frequency"))},set:function(b){return b==null?this.removeAttribute("frequency"):this.setAttribute("frequency",
|
|
12
|
+
""+$APP.S.g(b))},enumerable:!0,configurable:!0});Object.defineProperty(a,"disabled",{get:function(){return this.hasAttribute("disabled")},set:function(b){return $APP.r(b)?this.setAttribute("disabled",""):this.removeAttribute("disabled")},enumerable:!0,configurable:!0})},$L=function(){var a=class extends HTMLElement{};a.observedAttributes=ZL;a.prototype.connectedCallback=function(){OL(this);XL(this);WL(this);return null};a.prototype.disconnectedCallback=function(){XL(this);return null};a.prototype.attributeChangedCallback=
|
|
13
|
+
function(){return null};YL(a.prototype);return a},aM=function(){$APP.r(customElements.get("x-ripple-effect"))||customElements.define("x-ripple-effect",$L());return null},SL=new $APP.K(null,"turb","turb",-804768361),PL=new $APP.K(null,"frequency-raw","frequency-raw",-1367383022),TL=new $APP.K(null,"disp","disp",-2047544334),QL=new $APP.K(null,"frequency","frequency",-1408891382);var ZL=["intensity","duration","frequency","disabled"];$APP.Sd(["x-ripple-effect-start",new $APP.P(null,2,[$APP.U,new $APP.P(null,2,[$APP.Pk,$APP.V,$APP.Ok,$APP.V],null),$APP.ll,!1],null),"x-ripple-effect-end",new $APP.P(null,2,[$APP.U,new $APP.P(null,2,[$APP.Pk,$APP.V,$APP.Ok,$APP.V],null),$APP.ll,!1],null)]);$APP.ka("baredom.exports.x_ripple_effect.init",aM);export const init=aM;
|
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import { $APP, shadow$provide } from "./base.js";
|
|
2
|
-
var
|
|
3
|
-
d.setAttribute("part","viewport");d.setAttribute("role","region");d.appendChild(e);g.setAttribute("part","live");g.setAttribute("aria-live","polite");g.setAttribute("aria-atomic","true");b.appendChild(c);b.appendChild(d);b.appendChild(g);a.__xScrollParallaxRefs=new $APP.
|
|
4
|
-
$APP.
|
|
5
|
-
b:""],null)},
|
|
6
|
-
$APP.l(a,"__xScrollParallaxChildCache");if($APP.
|
|
7
|
-
a=typeof a==="string"?parseFloat(a.trim()):null;var b=a==null;return $APP.
|
|
8
|
-
c.height)));c=$APP.l(a,"__xScrollParallaxLastProg");d=
|
|
9
|
-
k?g/k:g>1-k?(1-g)/k:1))}q+=1}else break;if(c==null||Math.abs(g-c)>.001)a.__xScrollParallaxLastProg=g,
|
|
10
|
-
null},
|
|
11
|
-
var c=$APP.N($APP.l(a,"__xScrollParallaxRefs"));c=$APP.
|
|
12
|
-
"__xScrollParallaxVisible"))?(
|
|
13
|
-
$APP.l(b,"slot");$APP.
|
|
14
|
-
"__xScrollParallaxModel"),b)){var c=$APP.N(b),d=$APP.
|
|
15
|
-
b:"vertical"},set:function(b){return $APP.
|
|
16
|
-
b:"none"},set:function(b){return $APP.
|
|
17
|
-
$APP.O(b,""):b)?this.setAttribute("label",""+$APP.
|
|
18
|
-
c=b.length,d=0;;)if(d<c){var e=b[d];e.style.transform="";e.style.opacity="";d+=1}else break;$APP.
|
|
19
|
-
return null};
|
|
20
|
-
var
|
|
2
|
+
var iS=function(a){return new $APP.P(null,1,[$APP.el,a],null)},jS=function(a){var b=$APP.l(a,"__xScrollParallaxRefs");if($APP.r(b))return b;b=a.attachShadow({mode:"open"});var c=document.createElement("style"),d=document.createElement("div"),e=document.createElement("slot"),g=document.createElement("div");c.textContent=":host{display:block;position:relative;color-scheme:light dark;--x-scroll-parallax-perspective:none;--x-scroll-parallax-overflow:hidden;--x-scroll-parallax-smooth-duration:80ms;--x-scroll-parallax-fade-range:20%;--x-scroll-parallax-scale-min:0.85;--x-scroll-parallax-disabled-opacity:0.55;}[part\x3dviewport]{position:relative;width:100%;height:100%;overflow:var(--x-scroll-parallax-overflow);perspective:var(--x-scroll-parallax-perspective);}::slotted(*){will-change:transform;}:host([disabled]){opacity:var(--x-scroll-parallax-disabled-opacity);}:host([easing\x3dsmooth]) ::slotted(*){transition:transform var(--x-scroll-parallax-smooth-duration) ease-out,opacity var(--x-scroll-parallax-smooth-duration) ease-out;}[part\x3dlive]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0;}@media (prefers-reduced-motion:reduce){::slotted(*){transform:none !important;opacity:1 !important;}}";
|
|
3
|
+
d.setAttribute("part","viewport");d.setAttribute("role","region");d.appendChild(e);g.setAttribute("part","live");g.setAttribute("aria-live","polite");g.setAttribute("aria-atomic","true");b.appendChild(c);b.appendChild(d);b.appendChild(g);a.__xScrollParallaxRefs=new $APP.P(null,4,[$APP.bi,b,$APP.Hi,d,$APP.Fi,e,$APP.$h,g],null);return $APP.l(a,"__xScrollParallaxRefs")},qS=function(a){a=new $APP.P(null,5,[$APP.si,a.getAttribute("direction"),kS,a.getAttribute("source"),lS,a.getAttribute("easing"),$APP.Ai,
|
|
4
|
+
$APP.r(a.hasAttribute("disabled"))?"":null,$APP.Oh,a.getAttribute("label")],null);var b=$APP.N(a),c=$APP.G(b,$APP.si),d=$APP.G(b,kS),e=$APP.G(b,lS);a=$APP.G(b,$APP.Ai);b=$APP.G(b,$APP.Oh);c=typeof c==="string"?c.trim().toLowerCase():null;c=$APP.J(mS,c)?c:"vertical";d=typeof d==="string"?d.trim().toLowerCase():null;d=$APP.J(nS,d)?d:"document";e=typeof e==="string"?e.trim().toLowerCase():null;e=$APP.J(oS,e)?e:"none";return new $APP.P(null,5,[$APP.Ni,c,$APP.zk,d,pS,e,$APP.W,a!=null,$APP.T,$APP.r(b)?
|
|
5
|
+
b:""],null)},rS=function(a){a=jS(a);a=$APP.N(a);return $APP.G(a,$APP.Fi).assignedElements()},sS=function(a){var b=a.getAttribute("data-speed");typeof b==="string"?(b=parseFloat(b.trim()),b=$APP.r(isNaN(b))?1:b):b=1;var c=a.getAttribute("data-offset");typeof c==="string"?(c=parseFloat(c.trim()),c=$APP.r(isNaN(c))?0:c):c=0;return new $APP.P(null,4,[$APP.Yi,b,$APP.Rh,c,$APP.Ph,$APP.D.i("fade",a.getAttribute("data-opacity")),$APP.ui,$APP.D.i("grow",a.getAttribute("data-scale"))],null)},tS=function(a){var b=
|
|
6
|
+
$APP.l(a,"__xScrollParallaxChildCache");if($APP.r(b))return b;b=rS(a);b=$APP.af.o($APP.ie,$APP.de.g(sS),$APP.wc(b));return a.__xScrollParallaxChildCache=b},uS=function(a){a.__xScrollParallaxChildCache=null},vS=function(a){a=window.getComputedStyle(a).getPropertyValue("--x-scroll-parallax-fade-range");a=typeof a==="string"?a.trim():null;return $APP.r($APP.r(a)?a.endsWith("%"):a)?(a=parseFloat(a.slice(0,-1)),$APP.r(isNaN(a))?.2:a/100):.2},wS=function(a){a=window.getComputedStyle(a).getPropertyValue("--x-scroll-parallax-scale-min");
|
|
7
|
+
a=typeof a==="string"?parseFloat(a.trim()):null;var b=a==null;return $APP.r(b?b:isNaN(a))?.85:a},xS=function(a,b,c){b=new CustomEvent(b,{detail:$APP.nh(c),bubbles:!0,composed:!0,cancelable:!1});return a.dispatchEvent(b)},yS=function(a){var b=function(){var H=$APP.l(a,"__xScrollParallaxModel");return $APP.r(H)?H:qS(a)}();if(!$APP.r($APP.W.g(b))){var c=a.getBoundingClientRect();b=$APP.D.i("vertical",$APP.Ni.g(b));var d=window.innerHeight,e=b?d:window.innerWidth,g=$APP.Yg.i(0,$APP.Zg.i(1,(d-c.top)/(d+
|
|
8
|
+
c.height)));c=$APP.l(a,"__xScrollParallaxLastProg");d=rS(a);for(var h=tS(a),k=vS(a),m=wS(a),p=d.length,q=0;;)if(q<p){if(q<$APP.C(h)){var w=d[q],x=$APP.rc(h,q),y=$APP.N(x),A=$APP.G(y,$APP.Yi),B=$APP.G(y,$APP.Rh);x=$APP.G(y,$APP.Ph);y=$APP.G(y,$APP.ui);A=(g-.5)*e*(A-1)+B;var E=b?"translateY("+$APP.S.g(A)+"px)":"translateX("+$APP.S.g(A)+"px)";A=$APP.r(y)?function(){var H=m+(1-m)*(1-Math.abs(g-.5)*2);return""+$APP.S.g(E)+" scale("+$APP.S.g(H)+")"}():E;w.style.transform=A;$APP.r(x)&&(w.style.opacity=""+
|
|
9
|
+
$APP.S.g(g<k?g/k:g>1-k?(1-g)/k:1))}q+=1}else break;if(c==null||Math.abs(g-c)>.001)a.__xScrollParallaxLastProg=g,xS(a,"x-scroll-parallax-progress",iS(g))}a.__xScrollParallaxRAF=null},zS=function(a){return $APP.r(function(){var b=a.isConnected;return $APP.r(b)?(b=$APP.l(a,"__xScrollParallaxVisible"),$APP.r(b)?!$APP.I(window.matchMedia("(prefers-reduced-motion:reduce)").matches):b):b}())?$APP.r($APP.l(a,"__xScrollParallaxRAF"))?null:$APP.n(a,"__xScrollParallaxRAF",requestAnimationFrame(function(){return yS(a)})):
|
|
10
|
+
null},AS=function(a){a=$APP.l(a,"__xScrollParallaxHandlers");$APP.r($APP.r(a)?$APP.t($APP.l(a,"scrollAttached")):a)&&(window.addEventListener("scroll",$APP.l(a,"scroll"),{passive:!0}),a.scrollAttached=!0)},BS=function(a){a=$APP.l(a,"__xScrollParallaxHandlers");$APP.r($APP.r(a)?$APP.l(a,"scrollAttached"):a)&&(window.removeEventListener("scroll",$APP.l(a,"scroll")),a.scrollAttached=!1)},CS=function(a,b){a.textContent=b;setTimeout(function(){return a.textContent=""},1E3)},DS=function(a,b){b=b[0].isIntersecting;
|
|
11
|
+
var c=$APP.N($APP.l(a,"__xScrollParallaxRefs"));c=$APP.G(c,$APP.$h);a.__xScrollParallaxVisible=b;if($APP.r(b))return AS(a),yS(a),CS(c,"Parallax section entered viewport"),xS(a,"x-scroll-parallax-enter",iS(function(){var d=$APP.l(a,"__xScrollParallaxLastProg");return $APP.r(d)?d:0}()));BS(a);CS(c,"Parallax section left viewport");return xS(a,"x-scroll-parallax-leave",iS(function(){var d=$APP.l(a,"__xScrollParallaxLastProg");return $APP.r(d)?d:0}()))},ES=function(a){function b(){return $APP.r($APP.l(a,
|
|
12
|
+
"__xScrollParallaxVisible"))?(uS(a),yS(a)):null}function c(){uS(a);return $APP.r($APP.l(a,"__xScrollParallaxVisible"))?yS(a):null}var d=jS(a);d=$APP.N(d);$APP.G(d,$APP.Fi).addEventListener("slotchange",c);window.addEventListener("resize",b);$APP.n(a,"__xScrollParallaxHandlers",{scroll:function(){return zS(a)},slot:c,resize:b,scrollAttached:!1})},FS=function(a){var b=$APP.l(a,"__xScrollParallaxHandlers");if($APP.r(b)){BS(a);var c=$APP.l(a,"__xScrollParallaxRefs");if($APP.r(c)){c=$APP.Fi.g(c);var d=
|
|
13
|
+
$APP.l(b,"slot");$APP.r(d)&&c.removeEventListener("slotchange",d)}b=$APP.l(b,"resize");$APP.r(b)&&window.removeEventListener("resize",b)}b=$APP.l(a,"__xScrollParallaxRAF");$APP.r(b)&&(cancelAnimationFrame(b),a.__xScrollParallaxRAF=null);a.__xScrollParallaxHandlers=null},GS=function(a){var b=$APP.l(a,"__xScrollParallaxIO");$APP.r(b)&&b.disconnect();b=new IntersectionObserver(function(c){return DS(a,c)},{threshold:[0]});b.observe(a);a.__xScrollParallaxIO=b},HS=function(a){var b=qS(a);if($APP.O($APP.l(a,
|
|
14
|
+
"__xScrollParallaxModel"),b)){var c=$APP.N(b),d=$APP.G(c,$APP.Ni);$APP.G(c,pS);b=$APP.G(c,$APP.W);var e=$APP.G(c,$APP.T),g=jS(a);g=$APP.N(g);var h=$APP.G(g,$APP.Hi);$APP.G(g,$APP.$h);a.setAttribute("data-direction",d);$APP.u(e)?h.setAttribute("aria-label",e):h.removeAttribute("aria-label");a.__xScrollParallaxModel=c;c=$APP.l(a,"__xScrollParallaxVisible");$APP.r($APP.r(c)?$APP.t(b):c)&&yS(a)}},IS=function(a){Object.defineProperty(a,"direction",{get:function(){var b=this.getAttribute("direction");return $APP.r(b)?
|
|
15
|
+
b:"vertical"},set:function(b){return $APP.r(b)?this.setAttribute("direction",""+$APP.S.g(b)):this.removeAttribute("direction")},enumerable:!0,configurable:!0});Object.defineProperty(a,"source",{get:function(){var b=this.getAttribute("source");return $APP.r(b)?b:"document"},set:function(b){return $APP.r(b)?this.setAttribute("source",""+$APP.S.g(b)):this.removeAttribute("source")},enumerable:!0,configurable:!0});Object.defineProperty(a,"easing",{get:function(){var b=this.getAttribute("easing");return $APP.r(b)?
|
|
16
|
+
b:"none"},set:function(b){return $APP.r(b)?this.setAttribute("easing",""+$APP.S.g(b)):this.removeAttribute("easing")},enumerable:!0,configurable:!0});Object.defineProperty(a,"disabled",{get:function(){return this.hasAttribute("disabled")},set:function(b){return $APP.r(b)?this.setAttribute("disabled",""):this.removeAttribute("disabled")},enumerable:!0,configurable:!0});Object.defineProperty(a,"label",{get:function(){var b=this.getAttribute("label");return $APP.r(b)?b:""},set:function(b){return $APP.r($APP.r(b)?
|
|
17
|
+
$APP.O(b,""):b)?this.setAttribute("label",""+$APP.S.g(b)):this.removeAttribute("label")},enumerable:!0,configurable:!0});Object.defineProperty(a,"progress",{get:function(){var b=$APP.l(this,"__xScrollParallaxLastProg");return $APP.r(b)?b:0},enumerable:!0,configurable:!0})},KS=function(){var a=class extends HTMLElement{};a.observedAttributes=JS;a.prototype.connectedCallback=function(){jS(this);FS(this);ES(this);GS(this);HS(this);return null};a.prototype.disconnectedCallback=function(){for(var b=rS(this),
|
|
18
|
+
c=b.length,d=0;;)if(d<c){var e=b[d];e.style.transform="";e.style.opacity="";d+=1}else break;$APP.r($APP.l(this,"__xScrollParallaxVisible"))&&(b=$APP.l(this,"__xScrollParallaxLastProg"),xS(this,"x-scroll-parallax-leave",iS($APP.r(b)?b:0)));FS(this);b=$APP.l(this,"__xScrollParallaxIO");$APP.r(b)&&(b.disconnect(),this.__xScrollParallaxIO=null);uS(this);this.__xScrollParallaxVisible=!1;return this.__xScrollParallaxLastProg=null};a.prototype.attributeChangedCallback=function(b,c,d){$APP.O(c,d)&&HS(this);
|
|
19
|
+
return null};IS(a.prototype);return a},LS=function(){$APP.r(customElements.get("x-scroll-parallax"))||customElements.define("x-scroll-parallax",KS());return null},kS=new $APP.K(null,"source-raw","source-raw",396083546),lS=new $APP.K(null,"easing-raw","easing-raw",440485546),pS=new $APP.K(null,"easing","easing",735372043);var JS=["direction","source","easing","disabled","label"];$APP.Sd(["x-scroll-parallax-enter",new $APP.P(null,2,[$APP.U,new $APP.P(null,1,[$APP.el,$APP.V],null),$APP.ll,!1],null),"x-scroll-parallax-leave",new $APP.P(null,2,[$APP.U,new $APP.P(null,1,[$APP.el,$APP.V],null),$APP.ll,!1],null),"x-scroll-parallax-progress",new $APP.P(null,2,[$APP.U,new $APP.P(null,1,[$APP.el,$APP.V],null),$APP.ll,!1],null)]);
|
|
20
|
+
var mS=new $APP.R(null,new $APP.P(null,2,["vertical",null,"horizontal",null],null),null),nS=new $APP.R(null,new $APP.P(null,1,["document",null],null),null),oS=new $APP.R(null,new $APP.P(null,2,["none",null,"smooth",null],null),null);$APP.ka("baredom.exports.x_scroll_parallax.init",LS);export const init=LS;
|
package/dist/x-scroll-stack.js
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import { $APP, shadow$provide } from "./base.js";
|
|
2
|
-
var
|
|
2
|
+
var $y=function(a,b){return typeof a==="string"?(a=parseFloat(a.trim()),typeof a==="number"&&$APP.t(isNaN(a))&&a>0?a:b):b},bz=function(a){return typeof a==="string"&&$APP.J(az,a.trim().toLowerCase())?a.trim().toLowerCase():"center"},cz=function(a,b,c){b*=c;c=b+c-b;return Math.max(0,Math.min(1,c<=0?0:(a-b)/c))},dz=function(a,b,c){b*=c;return b<=0?0:Math.max(0,Math.min(1,a/b))},ez=function(a){var b=$APP.l(a,"__xScrollStackRefs");if($APP.r(b))return b;b=a.attachShadow({mode:"open"});var c=document.createElement("style"),
|
|
3
3
|
d=document.createElement("div"),e=document.createElement("slot");c.textContent=":host{display:block;position:relative;color-scheme:light dark;--x-scroll-stack-peek:6px;--x-scroll-stack-rotation:3deg;--x-scroll-stack-gap:1rem;}[part\x3dcontainer]{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:var(--x-scroll-stack-padding-top,2rem);gap:var(--x-scroll-stack-gap);}::slotted(*){flex-shrink:0;will-change:transform;transition:transform 60ms linear;}:host([disabled]){opacity:0.55;}@media (prefers-reduced-motion:reduce){::slotted(*){transition:none !important;}}";
|
|
4
|
-
d.setAttribute("part","container");d.setAttribute("role","region");d.appendChild(e);b.appendChild(c);b.appendChild(d);a.__xScrollStackRefs=new $APP.
|
|
5
|
-
d=$APP.
|
|
6
|
-
"px"},
|
|
7
|
-
|
|
8
|
-
F=H*
|
|
9
|
-
null},
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
b=new IntersectionObserver(function(c){c=c[0].isIntersecting;a.__xScrollStackVisible=c;$APP.
|
|
13
|
-
|
|
14
|
-
"__xScrollStackRAF");$APP.
|
|
15
|
-
"peek",{get:function(){return
|
|
16
|
-
150)},set:function(b){return b!=null?this.setAttribute("scroll-distance",""+$APP.
|
|
17
|
-
this.setAttribute("disabled",""):this.removeAttribute("disabled")},enumerable:!0,configurable:!0});Object.defineProperty(a,"stackedCount",{get:function(){var b=$APP.l(this,"__xScrollStackStackedCount");return $APP.
|
|
18
|
-
|
|
19
|
-
this.__xScrollStackLastProg=null};a.prototype.attributeChangedCallback=function(b,c,d){$APP.O(c,d)&&(
|
|
20
|
-
"scroll-distance-raw","scroll-distance-raw",1537519796),
|
|
4
|
+
d.setAttribute("part","container");d.setAttribute("role","region");d.appendChild(e);b.appendChild(c);b.appendChild(d);a.__xScrollStackRefs=new $APP.P(null,3,[$APP.bi,b,$APP.Zi,d,$APP.Fi,e],null);return $APP.l(a,"__xScrollStackRefs")},kz=function(a){a=new $APP.P(null,5,[fz,a.getAttribute("peek"),gz,a.getAttribute("rotation"),hz,a.getAttribute("scroll-distance"),$APP.qi,a.getAttribute("align"),$APP.Ai,$APP.r(a.hasAttribute("disabled"))?"":null],null);var b=$APP.N(a);a=$APP.G(b,fz);var c=$APP.G(b,gz),
|
|
5
|
+
d=$APP.G(b,hz),e=$APP.G(b,$APP.qi);b=$APP.G(b,$APP.Ai);return new $APP.P(null,5,[iz,$y(a,6),$APP.dl,$y(c,3),jz,$y(d,150),$APP.Qi,bz(e),$APP.W,b!=null],null)},lz=function(a){a=ez(a);a=$APP.N(a);return $APP.G(a,$APP.Fi).assignedElements()},mz=function(a,b,c){b=new CustomEvent(b,{detail:$APP.nh(c),bubbles:!0,composed:!0,cancelable:!1});a.dispatchEvent(b)},nz=function(a){var b=$APP.l(a,"__xScrollStackModel");b=$APP.r(b)?b:kz(a);var c=lz(a).length;b=window.innerHeight+c*jz.g(b);a.style.height=""+$APP.S.g(b)+
|
|
6
|
+
"px"},tz=function(a){var b=function(){var ta=$APP.l(a,"__xScrollStackModel");return $APP.r(ta)?ta:kz(a)}(),c=a.getBoundingClientRect();c=Math.max(0,-c.top);var d=lz(a),e=d.length,g=$APP.l(a,"__xScrollStackNaturalOffsets"),h=$APP.l(a,"__xScrollStackChildHeights");if($APP.r(function(){var ta=e>0;return ta?$APP.r(g)?$APP.r(h)?$APP.D.i(g.length,e)&&$APP.D.i(h.length,e):h:g:ta}())){var k=jz.g(b),m=iz.g(b),p=$APP.dl.g(b),q=$APP.Qi.g(b),w=g[0],x=$APP.r(a.hasAttribute("align"))?function(){var ta=(e-1)*m+
|
|
7
|
+
h[e-1],Ha=$APP.N($APP.l(a,"__xScrollStackRefs"));Ha=$APP.G(Ha,$APP.Zi).clientHeight;a:switch(q){case "top":ta=32;break a;case "bottom":ta=Ha-ta-32;break a;default:ta=(Ha-ta)/2}return ta-w}():0;b=dz(c,e,k);for(var y=Math.max(0,Math.min(e,Math.floor(c/Math.max(1,k)))),A=function(){var ta=$APP.l(a,"__xScrollStackStackedCount");return $APP.r(ta)?ta:0}(),B=0;;)if(B<e){var E=d[B],H=cz(c,B,k),F=new $APP.P(null,3,[oz,B*m,pz,p*Math.sin(B*2.3),qz,2*Math.cos(B*3.7)],null),M=g[B];M=w+oz.g(F)-M;M=H*M+H*x;var Y=
|
|
8
|
+
H*pz.g(F);F=H*qz.g(F);var ea=H>0?""+$APP.S.g(B):"";E.style.transform=H===0?"":"translate("+$APP.S.g(F.toFixed(2))+"px,"+$APP.S.g(M.toFixed(2))+"px) rotate("+$APP.S.g(Y.toFixed(3))+"deg)";E.style.zIndex=ea;B+=1}else break;$APP.O(y,A)&&(a.__xScrollStackStackedCount=y,mz(a,"x-scroll-stack-change",new $APP.P(null,3,[rz,y,sz,e,$APP.el,b],null)));c=$APP.l(a,"__xScrollStackLastProg");if(c==null||Math.abs(b-c)>.001)a.__xScrollStackLastProg=b,mz(a,"x-scroll-stack-progress",new $APP.P(null,3,[$APP.el,b,rz,
|
|
9
|
+
y,sz,e],null))}a.__xScrollStackRAF=null},uz=function(a){a=$APP.l(a,"__xScrollStackModel");return $APP.r(a)?$APP.W.g(a):a},vz=function(a){return $APP.r(function(){var b=a.isConnected;return $APP.r(b)?(b=$APP.l(a,"__xScrollStackVisible"),$APP.r(b)?$APP.t(uz(a)):b):b}())?$APP.r($APP.l(a,"__xScrollStackRAF"))?null:$APP.n(a,"__xScrollStackRAF",requestAnimationFrame(function(){return tz(a)})):null},wz=function(a){a=$APP.l(a,"__xScrollStackHandlers");$APP.r($APP.r(a)?$APP.t($APP.l(a,"scrollAttached")):a)&&
|
|
10
|
+
(window.addEventListener("scroll",$APP.l(a,"scroll"),{passive:!0}),a.scrollAttached=!0)},xz=function(a){a=$APP.l(a,"__xScrollStackHandlers");if($APP.r($APP.r(a)?$APP.l(a,"scrollAttached"):a))window.removeEventListener("scroll",$APP.l(a,"scroll")),a.scrollAttached=!1;else return null},yz=function(a){var b=$APP.l(a,"__xScrollStackCacheRAF");$APP.r(b)&&(cancelAnimationFrame(b),a.__xScrollStackCacheRAF=null);return $APP.n(a,"__xScrollStackCacheRAF",requestAnimationFrame(function(){a.__xScrollStackCacheRAF=
|
|
11
|
+
null;if($APP.r(a.isConnected)){var c=lz(a),d=c.length;if(d>0){var e=$APP.N($APP.l(a,"__xScrollStackRefs")),g=$APP.G(e,$APP.Zi);e=Array(d);for(var h=Array(d),k=0;;)if(k<d){var m=c[k];m.style.transform="";m.style.zIndex="";k+=1}else break;g.offsetHeight;g=g.getBoundingClientRect();for(k=0;;)if(k<d)m=c[k].getBoundingClientRect(),e[k]=m.top-g.top,h[k]=m.height,k+=1;else break;a.__xScrollStackNaturalOffsets=e;a.__xScrollStackChildHeights=h}return tz(a)}return null}))},zz=function(a){var b=$APP.l(a,"__xScrollStackIO");
|
|
12
|
+
$APP.r(b)&&b.disconnect();b=new IntersectionObserver(function(c){c=c[0].isIntersecting;a.__xScrollStackVisible=c;$APP.r(c)?$APP.r(uz(a))?c=null:(wz(a),c=yz(a)):c=xz(a);return c},{threshold:[0]});b.observe(a);a.__xScrollStackIO=b},Az=function(a){a=lz(a);for(var b=a.length,c=0;;)if(c<b){var d=a[c];d.style.transform="";d.style.zIndex="";c+=1}else break},Bz=function(a){function b(){nz(a);return $APP.r($APP.l(a,"__xScrollStackVisible"))?yz(a):null}function c(){nz(a);return $APP.r($APP.l(a,"__xScrollStackVisible"))?
|
|
13
|
+
yz(a):null}var d=ez(a);d=$APP.N(d);$APP.G(d,$APP.Fi).addEventListener("slotchange",c);window.addEventListener("resize",b);$APP.n(a,"__xScrollStackHandlers",{scroll:function(){return vz(a)},slot:c,resize:b,scrollAttached:!1})},Cz=function(a){var b=$APP.l(a,"__xScrollStackHandlers");if($APP.r(b)){xz(a);var c=$APP.l(a,"__xScrollStackRefs");if($APP.r(c)){c=$APP.Fi.g(c);var d=$APP.l(b,"slot");$APP.r(d)&&c.removeEventListener("slotchange",d)}b=$APP.l(b,"resize");$APP.r(b)&&window.removeEventListener("resize",
|
|
14
|
+
b)}b=$APP.l(a,"__xScrollStackRAF");$APP.r(b)&&(cancelAnimationFrame(b),a.__xScrollStackRAF=null);b=$APP.l(a,"__xScrollStackCacheRAF");$APP.r(b)&&(cancelAnimationFrame(b),a.__xScrollStackCacheRAF=null);a.__xScrollStackHandlers=null},Dz=function(a){var b=kz(a);if($APP.O($APP.l(a,"__xScrollStackModel"),b)){b=$APP.N(b);var c=$APP.G(b,$APP.W);a.__xScrollStackModel=b;$APP.r(c)?(Az(a),a.__xScrollStackStackedCount=0,a.__xScrollStackLastProg=null,xz(a)):$APP.r($APP.l(a,"__xScrollStackVisible"))&&(wz(a),yz(a))}},
|
|
15
|
+
Ez=function(a){Object.defineProperty(a,"peek",{get:function(){return $y(this.getAttribute("peek"),6)},set:function(b){return b!=null?this.setAttribute("peek",""+$APP.S.g(b)):this.removeAttribute("peek")},enumerable:!0,configurable:!0});Object.defineProperty(a,"rotation",{get:function(){return $y(this.getAttribute("rotation"),3)},set:function(b){return b!=null?this.setAttribute("rotation",""+$APP.S.g(b)):this.removeAttribute("rotation")},enumerable:!0,configurable:!0});Object.defineProperty(a,"scrollDistance",
|
|
16
|
+
{get:function(){return $y(this.getAttribute("scroll-distance"),150)},set:function(b){return b!=null?this.setAttribute("scroll-distance",""+$APP.S.g(b)):this.removeAttribute("scroll-distance")},enumerable:!0,configurable:!0});Object.defineProperty(a,"align",{get:function(){return bz(this.getAttribute("align"))},set:function(b){return b!=null?this.setAttribute("align",""+$APP.S.g(b)):this.removeAttribute("align")},enumerable:!0,configurable:!0});Object.defineProperty(a,"disabled",{get:function(){return this.hasAttribute("disabled")},
|
|
17
|
+
set:function(b){return $APP.r(b)?this.setAttribute("disabled",""):this.removeAttribute("disabled")},enumerable:!0,configurable:!0});Object.defineProperty(a,"stackedCount",{get:function(){var b=$APP.l(this,"__xScrollStackStackedCount");return $APP.r(b)?b:0},enumerable:!0,configurable:!0});Object.defineProperty(a,"progress",{get:function(){var b=$APP.l(this,"__xScrollStackLastProg");return $APP.r(b)?b:0},enumerable:!0,configurable:!0});Object.defineProperty(a,"refresh",{value:function(){nz(this);return $APP.r($APP.l(this,
|
|
18
|
+
"__xScrollStackVisible"))?yz(this):null},enumerable:!0,configurable:!0})},Gz=function(){var a=class extends HTMLElement{};a.observedAttributes=Fz;a.prototype.connectedCallback=function(){ez(this);Cz(this);Bz(this);zz(this);Dz(this);nz(this);return null};a.prototype.disconnectedCallback=function(){Az(this);Cz(this);var b=$APP.l(this,"__xScrollStackIO");$APP.r(b)&&(b.disconnect(),this.__xScrollStackIO=null);this.__xScrollStackVisible=!1;this.__xScrollStackStackedCount=0;return this.__xScrollStackChildHeights=
|
|
19
|
+
this.__xScrollStackNaturalOffsets=this.__xScrollStackLastProg=null};a.prototype.attributeChangedCallback=function(b,c,d){$APP.O(c,d)&&(Dz(this),nz(this),$APP.r($APP.l(this,"__xScrollStackVisible"))&&yz(this));return null};Ez(a.prototype);return a},Hz=function(){$APP.r(customElements.get("x-scroll-stack"))||customElements.define("x-scroll-stack",Gz());return null},pz=new $APP.K(null,"stack-rot","stack-rot",-949440704),iz=new $APP.K(null,"peek","peek",-291396325),sz=new $APP.K(null,"totalCount","totalCount",
|
|
20
|
+
2101470328),hz=new $APP.K(null,"scroll-distance-raw","scroll-distance-raw",1537519796),qz=new $APP.K(null,"stack-x","stack-x",-1557848736),oz=new $APP.K(null,"stack-y","stack-y",146748620),gz=new $APP.K(null,"rotation-raw","rotation-raw",318004495),fz=new $APP.K(null,"peek-raw","peek-raw",361729174),rz=new $APP.K(null,"stackedCount","stackedCount",137366007),jz=new $APP.K(null,"scroll-distance","scroll-distance",-544947824);var Fz=["peek","rotation","scroll-distance","align","disabled"];$APP.Sd(["x-scroll-stack-change",new $APP.P(null,2,[$APP.U,new $APP.P(null,3,[rz,$APP.V,sz,$APP.V,$APP.el,$APP.V],null),$APP.ll,!1],null),"x-scroll-stack-progress",new $APP.P(null,2,[$APP.U,new $APP.P(null,3,[$APP.el,$APP.V,rz,$APP.V,sz,$APP.V],null),$APP.ll,!1],null)]);var az=new $APP.R(null,new $APP.P(null,3,["top",null,"center",null,"bottom",null],null),null);$APP.ka("baredom.exports.x_scroll_stack.init",Hz);export const init=Hz;
|