@rogieking/figui3 6.7.3 → 6.7.4
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/dist/fig.js +1 -1
- package/fig.js +1 -1
- package/package.json +1 -1
package/dist/fig.js
CHANGED
|
@@ -60,7 +60,7 @@ var A1=(Q,Z)=>()=>(Q&&(Z=Q(Q=0)),Z);var F1={};var L0=A1(()=>{/*! Vendored from @
|
|
|
60
60
|
value="${this.#Q?"":this.value}"
|
|
61
61
|
${this.units?`units="${this.units}"`:""}
|
|
62
62
|
${this.precision!==null?`precision="${this.precision}"`:""}>
|
|
63
|
-
</fig-input-number>`;else Q=Z;if(this.innerHTML=Q,this.input=this.querySelector("[type=range]"),this.inputContainer=this.querySelector(".fig-slider-input-container"),this
|
|
63
|
+
</fig-input-number>`;else Q=Z;if(this.innerHTML=Q,this.input=this.querySelector("[type=range]"),this.inputContainer=this.querySelector(".fig-slider-input-container"),this.figInputNumber=this.querySelector("fig-input-number"),this.#A(),this.datalist=this.querySelector("datalist"),this.datalist)this.inputContainer.append(this.datalist),this.datalist.setAttribute("id",this.datalist.getAttribute("id")||y()),this.input.setAttribute("list",this.datalist.getAttribute("id"));else if(this.type==="stepper"){this.datalist=document.createElement("datalist"),this.datalist.setAttribute("id",y());let $=(this.max-this.min)/this.step+1;for(let J=0;J<$;J++){let j=document.createElement("option");j.setAttribute("value",this.min+J*this.step),this.datalist.append(j)}this.inputContainer.append(this.datalist),this.input.setAttribute("list",this.datalist.getAttribute("id"))}else if(this.type==="delta"){this.datalist=document.createElement("datalist"),this.datalist.setAttribute("id",y());let $=document.createElement("option");$.setAttribute("value",this.default),this.datalist.append($),this.inputContainer.append(this.datalist),this.input.setAttribute("list",this.datalist.getAttribute("id"))}if(this.datalist){let $=this.datalist.querySelector(`option[value='${this.default}']`);if($)$.setAttribute("default","true")}this.#T()}connectedCallback(){if(this.#M()){this.#z(),this.#A(),this.#T();return}this.#D()}get value(){if(this.#$!=="")return this.#$;let Q=this.getAttribute("value");if(Q!==null)return String(this.#P(Q));return""}set value(Q){let Z=Q===null||Q===void 0?"":String(Q),J=this.min!==void 0||this.max!==void 0?String(this.#P(Z)):Z;if(this.#$=J,this.getAttribute("value")!==J)this.#J=!0,this.setAttribute("value",J),this.#J=!1;if(this.input&&this.input.value!==J)this.input.value=J,this.input.setAttribute("aria-valuenow",J);if(this.figInputNumber)this.figInputNumber.setAttribute("value",this.#Q?"":J);if(this.input)this.#E()}disconnectedCallback(){if(this.input)this.input.removeEventListener("input",this.#_),this.input.removeEventListener("change",this.#G),this.input.removeEventListener("keydown",this.#Y),this.input.removeEventListener("pointerdown",this.#K),this.input.removeEventListener("pointerup",this.#B);if(this.figInputNumber)this.figInputNumber.removeEventListener("input",this.#X),this.figInputNumber.removeEventListener("change",this.#W)}#H(){if(this.figInputNumber){let Q=this.figInputNumber.value;this.#Q=Q===null||Q===void 0||typeof Q==="string"&&Q.trim()==="";let Z=this.#P(Q);this.value=Z,this.input.value=String(Z),this.#T(),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0}))}}#R(Q){let{min:Z,max:$}=this.#S(),J=$-Z;if(J===0)return 0;return(Number(Q)-Z)/J}#F(Q){if(Q===null||Q===void 0)return null;if(typeof Q==="string"&&Q.trim()==="")return null;let Z=Number(Q);return Number.isFinite(Z)?Z:null}#S(){let Q=this.#F(this.min),Z=this.#F(this.max);if(Q===null)Q=0;if(Z===null)Z=Q;if(Q>Z)[Q,Z]=[Z,Q];return{min:Q,max:Z}}#k(Q){let{min:Z,max:$}=this.#S();return Math.min($,Math.max(Z,Q))}#f(){if(this.type==="delta"){let Z=this.#F(this.default);if(Z!==null)return this.#k(Z);return this.#k(0)}if(this.type==="range"){let{min:Z,max:$}=this.#S();return this.#k(Z+($-Z)/2)}let{min:Q}=this.#S();return Q}#P(Q){let Z=this.#F(Q);if(Z===null)return this.#f();return this.#k(Z)}#E(){let Q=this.#R(this.value),Z=this.#R(this.default),$=Q===Z?1:0;if(this.#N!==Q)this.style.setProperty("--slider-complete",Q),this.#N=Q;if(this.#U!==Z)this.style.setProperty("--default",Z),this.#U=Z;if(this.#O!==$)this.style.setProperty("--unchanged",$),this.#O=$}#T(){let Q=this.input.value;if(this.value=Q,this.#E(),this.input.setAttribute("aria-valuenow",Q),this.figInputNumber)this.figInputNumber.setAttribute("value",this.#Q?"":Q)}#C(){if(!this.input)return;if(this.text){this.input.setAttribute("aria-hidden","true"),["aria-label","aria-labelledby","aria-describedby","aria-valuetext"].forEach((Q)=>this.input.removeAttribute(Q)),this.#x();return}this.input.removeAttribute("aria-hidden"),this.#j.forEach((Q)=>{let Z=this.getAttribute(Q);if(Z===null)this.input.removeAttribute(Q);else this.input.setAttribute(Q,Z)})}#x(){if(!this.figInputNumber)return;["aria-label","aria-labelledby","aria-describedby","aria-invalid","aria-required"].forEach((Q)=>{let Z=this.getAttribute(Q);if(Z===null)this.figInputNumber.removeAttribute(Q);else this.figInputNumber.setAttribute(Q,Z)})}#g(){this.#Q=!1,this.#T(),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0}))}#V(){this.#Z=!1,this.#Q=!1,this.#T(),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#y(Q){if(this.disabled||!Q.shiftKey)return;if(!["ArrowLeft","ArrowRight","ArrowUp","ArrowDown"].includes(Q.key))return;Q.preventDefault(),this.#Q=!1;let Z=Q.key==="ArrowRight"||Q.key==="ArrowUp"?1:-1,$=this.#F(this.input.value)??this.#f(),J=this.#F(this.step)??1,j=this.#P($+J*10*Z);this.value=j,this.input.value=String(j),this.#T(),this.dispatchEvent(new CustomEvent("input",{detail:this.value,bubbles:!0})),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}#w(){if(this.figInputNumber){let Q=this.figInputNumber.value;this.#Q=Q===null||Q===void 0||typeof Q==="string"&&Q.trim()==="";let Z=this.#P(Q);this.value=Z,this.input.value=String(Z),this.#T(),this.dispatchEvent(new CustomEvent("change",{detail:this.value,bubbles:!0}))}}static get observedAttributes(){return["value","step","min","max","type","variant","disabled","color","units","transform","text","placeholder","default","precision","aria-label","aria-labelledby","aria-describedby","aria-invalid","aria-required","aria-valuetext"]}focus(){if(this.text&&this.figInputNumber){this.figInputNumber.focus();return}this.input.focus()}attributeChangedCallback(Q,Z,$){if(Q==="value"&&this.#J)return;if(this.input)switch(Q){case"color":this.color=$,this.style.setProperty("--color",this.color);break;case"disabled":if(this.disabled=this.input.disabled=$!==null&&$!=="false",this.figInputNumber)this.figInputNumber.disabled=this.disabled,this.figInputNumber.setAttribute("disabled",this.disabled);break;case"value":if(this.#Z)break;if(this.#Q=$===null||typeof $==="string"&&$.trim()==="",this.value=this.#P($),this.input.value=String(this.value),this.#T(),this.figInputNumber)this.figInputNumber.setAttribute("value",this.#Q?"":this.value);break;case"transform":if(this.transform=Number($)||1,this.figInputNumber)this.figInputNumber.setAttribute("transform",this.transform);break;case"precision":if(this.precision=$!==null?Number($):null,this.figInputNumber)if(this.precision!==null)this.figInputNumber.setAttribute("precision",this.precision);else this.figInputNumber.removeAttribute("precision");break;case"placeholder":if(this.placeholder=$!==null?$:"##",this.figInputNumber)this.figInputNumber.setAttribute("placeholder",this.placeholder);break;case"default":this.default=$!==null?$:this.type==="delta"?0:this.min,this.#E();break;case"min":case"max":case"step":case"type":case"variant":case"units":this[Q]=$,this.#D();break;case"text":this.text=$!=="false",this.#D();break;case"aria-label":case"aria-labelledby":case"aria-describedby":case"aria-invalid":case"aria-required":case"aria-valuetext":this.#C();break;default:this[Q]=this.input[Q]=$,this.#T();break}}}customElements.define("fig-slider",x0);class V0 extends HTMLElement{#Z=!1;#Q=!1;#J;#$;#j;#q;#_;#G;#X;#W=["aria-label","aria-labelledby","aria-describedby","aria-invalid","aria-required"];constructor(){super();this.#J=this.#A.bind(this),this.#$=this.#H.bind(this),this.#j=this.#H.bind(this),this.#q=this.#D.bind(this),this.#_=(Q)=>{Q.stopPropagation(),this.#z(Q)},this.#G=()=>{this.#U()},this.#X=this.focus.bind(this)}connectedCallback(){if(this.multiline=this.hasAttribute("multiline")||!1,this.value=this.getAttribute("value")||"",this.type=this.getAttribute("type")||"text",this.placeholder=this.getAttribute("placeholder")||"",this.name=this.getAttribute("name")||null,this.readonly=this.hasAttribute("readonly")&&this.getAttribute("readonly")!=="false",this.type==="number"){if(this.getAttribute("step"))this.step=Number(this.getAttribute("step"));if(this.getAttribute("min"))this.min=Number(this.getAttribute("min"));if(this.getAttribute("max"))this.max=Number(this.getAttribute("max"));if(this.transform=Number(this.getAttribute("transform")||1),this.getAttribute("value"))this.value=Number(this.value)}if(this.input=this.#Y(),this.input.readOnly=this.readonly,this.#K(),this.#B(),this.#N(),this.#U(),this.#O(),this.type==="number"){if(this.getAttribute("min"))this.input.setAttribute("min",this.#M(this.min));if(this.getAttribute("max"))this.input.setAttribute("max",this.#M(this.max));if(this.getAttribute("step"))this.input.setAttribute("step",this.#M(this.step));this.addEventListener("pointerdown",this.#q)}this.input.removeEventListener("change",this.#_),this.input.addEventListener("change",this.#_),this.input.removeEventListener("input",this.#G),this.input.addEventListener("input",this.#G)}disconnectedCallback(){if(this.input)this.input.removeEventListener("change",this.#_),this.input.removeEventListener("input",this.#G);this.removeEventListener("pointerdown",this.#q),window.removeEventListener("pointermove",this.#J),window.removeEventListener("pointerup",this.#$),window.removeEventListener("blur",this.#j)}focus(){this.input.focus()}#Y(){let Q=this.multiline,Z=this.querySelector("input,textarea");if(Z){if(Q?Z.tagName==="TEXTAREA":Z.tagName==="INPUT")return Z}let $=`<input
|
|
64
64
|
type="${this.type}"
|
|
65
65
|
${this.name?`name="${this.name}"`:""}
|
|
66
66
|
placeholder="${this.placeholder}"
|
package/fig.js
CHANGED
|
@@ -4989,10 +4989,10 @@ class FigSlider extends HTMLElement {
|
|
|
4989
4989
|
|
|
4990
4990
|
this.input = this.querySelector("[type=range]");
|
|
4991
4991
|
this.inputContainer = this.querySelector(".fig-slider-input-container");
|
|
4992
|
+
this.figInputNumber = this.querySelector("fig-input-number");
|
|
4992
4993
|
this.#bindControlListeners();
|
|
4993
4994
|
|
|
4994
4995
|
this.datalist = this.querySelector("datalist");
|
|
4995
|
-
this.figInputNumber = this.querySelector("fig-input-number");
|
|
4996
4996
|
if (this.datalist) {
|
|
4997
4997
|
this.inputContainer.append(this.datalist);
|
|
4998
4998
|
this.datalist.setAttribute(
|
package/package.json
CHANGED