aptechka 0.87.2 → 0.87.3
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/lib/notched/index.cjs +2 -2
- package/lib/notched/index.js +4 -4
- package/package.json +1 -1
package/lib/notched/index.cjs
CHANGED
|
@@ -44,14 +44,14 @@
|
|
|
44
44
|
a ${cornerRadius} ${cornerRadius} 0 0 1 ${arcSectionLength} -${arcSectionLength}
|
|
45
45
|
c ${c} ${-d}
|
|
46
46
|
${b+c} ${-d}
|
|
47
|
-
${a+b+c} ${-d}`:rounded`l 0 ${-p}`}__name(drawTopLeftPath,"drawTopLeftPath");function toRadians(degrees){return degrees*Math.PI/180}__name(toRadians,"toRadians");function rounded(strings,...values){return strings.reduce((acc,str,i)=>{const value=values[i];return typeof value=="number"?acc+str+value.toFixed(4):acc+str+(value!=null?value:"")},"")}__name(rounded,"rounded");function getSvgPath({cornerRadius=0,topLeftCornerRadius,topRightCornerRadius,bottomRightCornerRadius,bottomLeftCornerRadius,cornerAngleAlpha=90,topLeftCornerAngleAlpha,topRightCornerAngleAlpha,bottomRightCornerAngleAlpha,bottomLeftCornerAngleAlpha,cornerSmoothing,preserveSmoothing=!1,topNotches,rightNotches,bottomNotches,leftNotches,width,height}){if(topLeftCornerRadius=topLeftCornerRadius!=null?topLeftCornerRadius:cornerRadius,topRightCornerRadius=topRightCornerRadius!=null?topRightCornerRadius:cornerRadius,bottomLeftCornerRadius=bottomLeftCornerRadius!=null?bottomLeftCornerRadius:cornerRadius,bottomRightCornerRadius=bottomRightCornerRadius!=null?bottomRightCornerRadius:cornerRadius,topLeftCornerAngleAlpha=topLeftCornerAngleAlpha!=null?topLeftCornerAngleAlpha:cornerAngleAlpha,topRightCornerAngleAlpha=topRightCornerAngleAlpha!=null?topRightCornerAngleAlpha:cornerAngleAlpha,bottomLeftCornerAngleAlpha=bottomLeftCornerAngleAlpha!=null?bottomLeftCornerAngleAlpha:cornerAngleAlpha,bottomRightCornerAngleAlpha=bottomRightCornerAngleAlpha!=null?bottomRightCornerAngleAlpha:cornerAngleAlpha,topLeftCornerRadius===topRightCornerRadius&&topRightCornerRadius===bottomRightCornerRadius&&bottomRightCornerRadius===bottomLeftCornerRadius&&bottomLeftCornerRadius===topLeftCornerRadius&&topLeftCornerAngleAlpha===topRightCornerAngleAlpha&&topRightCornerAngleAlpha===bottomRightCornerAngleAlpha&&bottomRightCornerAngleAlpha===bottomLeftCornerAngleAlpha&&bottomLeftCornerAngleAlpha===topLeftCornerAngleAlpha){const roundingAndSmoothingBudget=Math.min(width,height)/2,cornerRadius2=Math.min(topLeftCornerRadius,roundingAndSmoothingBudget),pathParams=getPathParamsForCorner({cornerRadius:cornerRadius2,cornerSmoothing,cornerAngleAlpha,preserveSmoothing,roundingAndSmoothingBudget});return getSVGPathFromPathParams({width,height,topLeftPathParams:pathParams,topRightPathParams:pathParams,bottomLeftPathParams:pathParams,bottomRightPathParams:pathParams,topNotches,rightNotches,bottomNotches,leftNotches})}const{topLeft,topRight,bottomLeft,bottomRight}=distributeAndNormalize({topLeftCornerRadius,topRightCornerRadius,bottomRightCornerRadius,bottomLeftCornerRadius,width,height});return getSVGPathFromPathParams({width,height,topLeftPathParams:getPathParamsForCorner({cornerSmoothing,preserveSmoothing,cornerRadius:topLeft.radius,roundingAndSmoothingBudget:topLeft.roundingAndSmoothingBudget,cornerAngleAlpha:topLeftCornerAngleAlpha}),topRightPathParams:getPathParamsForCorner({cornerSmoothing,preserveSmoothing,cornerRadius:topRight.radius,roundingAndSmoothingBudget:topRight.roundingAndSmoothingBudget,cornerAngleAlpha:topRightCornerAngleAlpha}),bottomRightPathParams:getPathParamsForCorner({cornerSmoothing,preserveSmoothing,cornerRadius:bottomRight.radius,roundingAndSmoothingBudget:bottomRight.roundingAndSmoothingBudget,cornerAngleAlpha:bottomRightCornerAngleAlpha}),bottomLeftPathParams:getPathParamsForCorner({cornerSmoothing,preserveSmoothing,cornerRadius:bottomLeft.radius,roundingAndSmoothingBudget:bottomLeft.roundingAndSmoothingBudget,cornerAngleAlpha:bottomLeftCornerAngleAlpha}),topNotches,rightNotches,bottomNotches,leftNotches})}__name(getSvgPath,"getSvgPath");var _svgElement,_pathElement,_resizeListener,_NotchedElement_instances,parseCSSNotchValue_fn;const _NotchedElement=class _NotchedElement extends HTMLElement{constructor(){super();__privateAdd(this,_NotchedElement_instances);__privateAdd(this,_svgElement);__privateAdd(this,_pathElement);__privateAdd(this,_resizeListener,__name(()=>{const width=this.offsetWidth,height=this.offsetHeight,computed=getComputedStyle(this);__privateGet(this,_svgElement).setAttributeNS("http://www.w3.org/2000/svg","viewBox",`0 0 ${width} ${height}`);const cornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-corner-radius")),topLeftCornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-top-left-corner-radius")),topRightCornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-top-right-corner-radius")),bottomRightCornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-bottom-right-corner-radius")),bottomLeftCornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-bottom-left-corner-radius")),cornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-corner-angle-alpha"))||void 0,topLeftCornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-top-left-corner-angle-alpha"))||void 0,topRightCornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-top-right-corner-angle-alpha"))||void 0,bottomRightCornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-bottom-right-corner-angle-alpha"))||void 0,bottomLeftCornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-bottom-left-corner-angle-alpha"))||void 0,cornerSmoothing=parseFloat(computed.getPropertyValue("--notched-corner-smoothing"))||0,preserveSmoothing=computed.getPropertyValue("--notched-preserve-smoothing")!=="false",topNotches=__privateMethod(this,_NotchedElement_instances,parseCSSNotchValue_fn).call(this,computed.getPropertyValue("--notched-top-notches")),rightNotches=__privateMethod(this,_NotchedElement_instances,parseCSSNotchValue_fn).call(this,computed.getPropertyValue("--notched-right-notches")),bottomNotches=__privateMethod(this,_NotchedElement_instances,parseCSSNotchValue_fn).call(this,computed.getPropertyValue("--notched-bottom-notches")),leftNotches=__privateMethod(this,_NotchedElement_instances,parseCSSNotchValue_fn).call(this,computed.getPropertyValue("--notched-left-notches")),
|
|
47
|
+
${a+b+c} ${-d}`:rounded`l 0 ${-p}`}__name(drawTopLeftPath,"drawTopLeftPath");function toRadians(degrees){return degrees*Math.PI/180}__name(toRadians,"toRadians");function rounded(strings,...values){return strings.reduce((acc,str,i)=>{const value=values[i];return typeof value=="number"?acc+str+value.toFixed(4):acc+str+(value!=null?value:"")},"")}__name(rounded,"rounded");function getSvgPath({cornerRadius=0,topLeftCornerRadius,topRightCornerRadius,bottomRightCornerRadius,bottomLeftCornerRadius,cornerAngleAlpha=90,topLeftCornerAngleAlpha,topRightCornerAngleAlpha,bottomRightCornerAngleAlpha,bottomLeftCornerAngleAlpha,cornerSmoothing,preserveSmoothing=!1,topNotches,rightNotches,bottomNotches,leftNotches,width,height}){if(topLeftCornerRadius=topLeftCornerRadius!=null?topLeftCornerRadius:cornerRadius,topRightCornerRadius=topRightCornerRadius!=null?topRightCornerRadius:cornerRadius,bottomLeftCornerRadius=bottomLeftCornerRadius!=null?bottomLeftCornerRadius:cornerRadius,bottomRightCornerRadius=bottomRightCornerRadius!=null?bottomRightCornerRadius:cornerRadius,topLeftCornerAngleAlpha=topLeftCornerAngleAlpha!=null?topLeftCornerAngleAlpha:cornerAngleAlpha,topRightCornerAngleAlpha=topRightCornerAngleAlpha!=null?topRightCornerAngleAlpha:cornerAngleAlpha,bottomLeftCornerAngleAlpha=bottomLeftCornerAngleAlpha!=null?bottomLeftCornerAngleAlpha:cornerAngleAlpha,bottomRightCornerAngleAlpha=bottomRightCornerAngleAlpha!=null?bottomRightCornerAngleAlpha:cornerAngleAlpha,topLeftCornerRadius===topRightCornerRadius&&topRightCornerRadius===bottomRightCornerRadius&&bottomRightCornerRadius===bottomLeftCornerRadius&&bottomLeftCornerRadius===topLeftCornerRadius&&topLeftCornerAngleAlpha===topRightCornerAngleAlpha&&topRightCornerAngleAlpha===bottomRightCornerAngleAlpha&&bottomRightCornerAngleAlpha===bottomLeftCornerAngleAlpha&&bottomLeftCornerAngleAlpha===topLeftCornerAngleAlpha){const roundingAndSmoothingBudget=Math.min(width,height)/2,cornerRadius2=Math.min(topLeftCornerRadius,roundingAndSmoothingBudget),pathParams=getPathParamsForCorner({cornerRadius:cornerRadius2,cornerSmoothing,cornerAngleAlpha,preserveSmoothing,roundingAndSmoothingBudget});return getSVGPathFromPathParams({width,height,topLeftPathParams:pathParams,topRightPathParams:pathParams,bottomLeftPathParams:pathParams,bottomRightPathParams:pathParams,topNotches,rightNotches,bottomNotches,leftNotches})}const{topLeft,topRight,bottomLeft,bottomRight}=distributeAndNormalize({topLeftCornerRadius,topRightCornerRadius,bottomRightCornerRadius,bottomLeftCornerRadius,width,height});return getSVGPathFromPathParams({width,height,topLeftPathParams:getPathParamsForCorner({cornerSmoothing,preserveSmoothing,cornerRadius:topLeft.radius,roundingAndSmoothingBudget:topLeft.roundingAndSmoothingBudget,cornerAngleAlpha:topLeftCornerAngleAlpha}),topRightPathParams:getPathParamsForCorner({cornerSmoothing,preserveSmoothing,cornerRadius:topRight.radius,roundingAndSmoothingBudget:topRight.roundingAndSmoothingBudget,cornerAngleAlpha:topRightCornerAngleAlpha}),bottomRightPathParams:getPathParamsForCorner({cornerSmoothing,preserveSmoothing,cornerRadius:bottomRight.radius,roundingAndSmoothingBudget:bottomRight.roundingAndSmoothingBudget,cornerAngleAlpha:bottomRightCornerAngleAlpha}),bottomLeftPathParams:getPathParamsForCorner({cornerSmoothing,preserveSmoothing,cornerRadius:bottomLeft.radius,roundingAndSmoothingBudget:bottomLeft.roundingAndSmoothingBudget,cornerAngleAlpha:bottomLeftCornerAngleAlpha}),topNotches,rightNotches,bottomNotches,leftNotches})}__name(getSvgPath,"getSvgPath");var _svgElement,_pathElement,_resizeListener,_NotchedElement_instances,parseCSSNotchValue_fn;const _NotchedElement=class _NotchedElement extends HTMLElement{constructor(){super();__privateAdd(this,_NotchedElement_instances);__privateAdd(this,_svgElement);__privateAdd(this,_pathElement);__privateAdd(this,_resizeListener,__name(()=>{const width=this.offsetWidth,height=this.offsetHeight,computed=getComputedStyle(this);__privateGet(this,_svgElement).setAttributeNS("http://www.w3.org/2000/svg","viewBox",`0 0 ${width} ${height}`);const cornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-corner-radius")),topLeftCornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-top-left-corner-radius")),topRightCornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-top-right-corner-radius")),bottomRightCornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-bottom-right-corner-radius")),bottomLeftCornerRadius=cssUnitParser_index.cssUnitParser.parse(computed.getPropertyValue("--notched-bottom-left-corner-radius")),cornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-corner-angle-alpha"))||void 0,topLeftCornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-top-left-corner-angle-alpha"))||void 0,topRightCornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-top-right-corner-angle-alpha"))||void 0,bottomRightCornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-bottom-right-corner-angle-alpha"))||void 0,bottomLeftCornerAngleAlpha=parseFloat(computed.getPropertyValue("--notched-bottom-left-corner-angle-alpha"))||void 0,cornerSmoothing=parseFloat(computed.getPropertyValue("--notched-corner-smoothing"))||0,preserveSmoothing=computed.getPropertyValue("--notched-preserve-smoothing")!=="false",topNotches=__privateMethod(this,_NotchedElement_instances,parseCSSNotchValue_fn).call(this,computed.getPropertyValue("--notched-top-notches")),rightNotches=__privateMethod(this,_NotchedElement_instances,parseCSSNotchValue_fn).call(this,computed.getPropertyValue("--notched-right-notches")),bottomNotches=__privateMethod(this,_NotchedElement_instances,parseCSSNotchValue_fn).call(this,computed.getPropertyValue("--notched-bottom-notches")),leftNotches=__privateMethod(this,_NotchedElement_instances,parseCSSNotchValue_fn).call(this,computed.getPropertyValue("--notched-left-notches")),fill=computed.getPropertyValue("--notched-fill"),path=getSvgPath({cornerRadius,topLeftCornerRadius,topRightCornerRadius,bottomRightCornerRadius,bottomLeftCornerRadius,cornerAngleAlpha,topLeftCornerAngleAlpha,topRightCornerAngleAlpha,bottomRightCornerAngleAlpha,bottomLeftCornerAngleAlpha,cornerSmoothing,preserveSmoothing,topNotches,rightNotches,bottomNotches,leftNotches,width,height});__privateGet(this,_pathElement).setAttribute("d",path),fill&&__privateGet(this,_pathElement).setAttribute("fill",fill)},"#resizeListener"));const clipContent=this.hasAttribute("clip-content"),clipId=this.hasAttribute("clip")||clipContent?"clip-"+string.generateId(10):null,tmpElement=document.createElement("div");tmpElement.innerHTML=`
|
|
48
48
|
<svg xmlns="http://www.w3.org/2000/svg">
|
|
49
49
|
${clipId?`<clipPath id="${clipId}">`:""}
|
|
50
50
|
<path></path>
|
|
51
51
|
${clipId?"</clipPath>":""}
|
|
52
52
|
</svg>
|
|
53
53
|
<slot></slot>
|
|
54
|
-
`,clipId&&(this.style.clipPath=`url(#${clipId})`),this.style.position="relative",__privateSet(this,_svgElement,tmpElement.querySelector("svg")),__privateGet(this,_svgElement).style.cssText=`
|
|
54
|
+
`,clipId&&(clipContent&&this.firstElementChild instanceof HTMLElement?this.firstElementChild.style.clipPath=`url(#${clipId})`:this.style.clipPath=`url(#${clipId})`),this.style.position="relative",__privateSet(this,_svgElement,tmpElement.querySelector("svg")),__privateGet(this,_svgElement).style.cssText=`
|
|
55
55
|
position: absolute;
|
|
56
56
|
top: 0;
|
|
57
57
|
left: 0;
|
package/lib/notched/index.js
CHANGED
|
@@ -404,7 +404,7 @@ const _NotchedElement = class _NotchedElement extends HTMLElement {
|
|
|
404
404
|
computed.getPropertyValue("--notched-bottom-right-corner-angle-alpha")
|
|
405
405
|
) || void 0, bottomLeftCornerAngleAlpha = parseFloat(
|
|
406
406
|
computed.getPropertyValue("--notched-bottom-left-corner-angle-alpha")
|
|
407
|
-
) || void 0, cornerSmoothing = parseFloat(computed.getPropertyValue("--notched-corner-smoothing")) || 0, preserveSmoothing = computed.getPropertyValue("--notched-preserve-smoothing") !== "false", topNotches = __privateMethod(this, _NotchedElement_instances, parseCSSNotchValue_fn).call(this, computed.getPropertyValue("--notched-top-notches")), rightNotches = __privateMethod(this, _NotchedElement_instances, parseCSSNotchValue_fn).call(this, computed.getPropertyValue("--notched-right-notches")), bottomNotches = __privateMethod(this, _NotchedElement_instances, parseCSSNotchValue_fn).call(this, computed.getPropertyValue("--notched-bottom-notches")), leftNotches = __privateMethod(this, _NotchedElement_instances, parseCSSNotchValue_fn).call(this, computed.getPropertyValue("--notched-left-notches")),
|
|
407
|
+
) || void 0, cornerSmoothing = parseFloat(computed.getPropertyValue("--notched-corner-smoothing")) || 0, preserveSmoothing = computed.getPropertyValue("--notched-preserve-smoothing") !== "false", topNotches = __privateMethod(this, _NotchedElement_instances, parseCSSNotchValue_fn).call(this, computed.getPropertyValue("--notched-top-notches")), rightNotches = __privateMethod(this, _NotchedElement_instances, parseCSSNotchValue_fn).call(this, computed.getPropertyValue("--notched-right-notches")), bottomNotches = __privateMethod(this, _NotchedElement_instances, parseCSSNotchValue_fn).call(this, computed.getPropertyValue("--notched-bottom-notches")), leftNotches = __privateMethod(this, _NotchedElement_instances, parseCSSNotchValue_fn).call(this, computed.getPropertyValue("--notched-left-notches")), fill = computed.getPropertyValue("--notched-fill"), path = getSvgPath({
|
|
408
408
|
cornerRadius,
|
|
409
409
|
topLeftCornerRadius,
|
|
410
410
|
topRightCornerRadius,
|
|
@@ -424,9 +424,9 @@ const _NotchedElement = class _NotchedElement extends HTMLElement {
|
|
|
424
424
|
width,
|
|
425
425
|
height
|
|
426
426
|
});
|
|
427
|
-
__privateGet(this, _pathElement).setAttribute("d", path),
|
|
427
|
+
__privateGet(this, _pathElement).setAttribute("d", path), fill && __privateGet(this, _pathElement).setAttribute("fill", fill);
|
|
428
428
|
}, "#resizeListener"));
|
|
429
|
-
const clipId = this.hasAttribute("clip") ? "clip-" + generateId(10) : null, tmpElement = document.createElement("div");
|
|
429
|
+
const clipContent = this.hasAttribute("clip-content"), clipId = this.hasAttribute("clip") || clipContent ? "clip-" + generateId(10) : null, tmpElement = document.createElement("div");
|
|
430
430
|
tmpElement.innerHTML = `
|
|
431
431
|
<svg xmlns="http://www.w3.org/2000/svg">
|
|
432
432
|
${clipId ? `<clipPath id="${clipId}">` : ""}
|
|
@@ -434,7 +434,7 @@ const _NotchedElement = class _NotchedElement extends HTMLElement {
|
|
|
434
434
|
${clipId ? "</clipPath>" : ""}
|
|
435
435
|
</svg>
|
|
436
436
|
<slot></slot>
|
|
437
|
-
`, clipId && (this.style.clipPath = `url(#${clipId})`), this.style.position = "relative", __privateSet(this, _svgElement, tmpElement.querySelector("svg")), __privateGet(this, _svgElement).style.cssText = `
|
|
437
|
+
`, clipId && (clipContent && this.firstElementChild instanceof HTMLElement ? this.firstElementChild.style.clipPath = `url(#${clipId})` : this.style.clipPath = `url(#${clipId})`), this.style.position = "relative", __privateSet(this, _svgElement, tmpElement.querySelector("svg")), __privateGet(this, _svgElement).style.cssText = `
|
|
438
438
|
position: absolute;
|
|
439
439
|
top: 0;
|
|
440
440
|
left: 0;
|