aptechka 0.87.1 → 0.87.3

package/lib/{notched.cjs → notched/index.cjs}

@@ -1,4 +1,4 @@
-"use strict";var __defProp=Object.defineProperty;var __typeError=msg=>{throw TypeError(msg)};var __name=(target,value)=>__defProp(target,"name",{value,configurable:!0});var __accessCheck=(obj,member,msg)=>member.has(obj)||__typeError("Cannot "+msg);var __privateGet=(obj,member,getter)=>(__accessCheck(obj,member,"read from private field"),getter?getter.call(obj):member.get(obj)),__privateAdd=(obj,member,value)=>member.has(obj)?__typeError("Cannot add the same private member more than once"):member instanceof WeakSet?member.add(obj):member.set(obj,value),__privateSet=(obj,member,value,setter)=>(__accessCheck(obj,member,"write to private field"),setter?setter.call(obj,value):member.set(obj,value),value),__privateMethod=(obj,member,method)=>(__accessCheck(obj,member,"access private method"),method);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const cssUnitParser_index=require("./css-unit-parser/index.cjs"),elementResizer_index=require("./element-resizer/index.cjs"),intersector_index=require("./index-DZ44osDT.cjs"),string=require("./string-CbRNzmd9.cjs");require("construct-style-sheets-polyfill");function distributeAndNormalize({topLeftCornerRadius,topRightCornerRadius,bottomRightCornerRadius,bottomLeftCornerRadius,width,height}){const roundingAndSmoothingBudgetMap={topLeft:-1,topRight:-1,bottomLeft:-1,bottomRight:-1},cornerRadiusMap={topLeft:topLeftCornerRadius,topRight:topRightCornerRadius,bottomLeft:bottomLeftCornerRadius,bottomRight:bottomRightCornerRadius};return Object.entries(cornerRadiusMap).sort(([,radius1],[,radius2])=>radius2-radius1).forEach(([cornerName,radius])=>{const corner=cornerName,adjacents=adjacentsByCorner[corner],budget=Math.min(...adjacents.map(adjacent=>{const adjacentCornerRadius=cornerRadiusMap[adjacent.corner];if(radius===0&&adjacentCornerRadius===0)return 0;const adjacentCornerBudget=roundingAndSmoothingBudgetMap[adjacent.corner],sideLength=adjacent.side==="top"||adjacent.side==="bottom"?width:height;return adjacentCornerBudget>=0?sideLength-roundingAndSmoothingBudgetMap[adjacent.corner]:radius/(radius+adjacentCornerRadius)*sideLength}));roundingAndSmoothingBudgetMap[corner]=budget,cornerRadiusMap[corner]=Math.min(radius,budget)}),{topLeft:{radius:cornerRadiusMap.topLeft,roundingAndSmoothingBudget:roundingAndSmoothingBudgetMap.topLeft},topRight:{radius:cornerRadiusMap.topRight,roundingAndSmoothingBudget:roundingAndSmoothingBudgetMap.topRight},bottomLeft:{radius:cornerRadiusMap.bottomLeft,roundingAndSmoothingBudget:roundingAndSmoothingBudgetMap.bottomLeft},bottomRight:{radius:cornerRadiusMap.bottomRight,roundingAndSmoothingBudget:roundingAndSmoothingBudgetMap.bottomRight}}}__name(distributeAndNormalize,"distributeAndNormalize");const adjacentsByCorner={topLeft:[{corner:"topRight",side:"top"},{corner:"bottomLeft",side:"left"}],topRight:[{corner:"topLeft",side:"top"},{corner:"bottomRight",side:"right"}],bottomLeft:[{corner:"bottomRight",side:"bottom"},{corner:"topLeft",side:"left"}],bottomRight:[{corner:"bottomLeft",side:"bottom"},{corner:"topRight",side:"right"}]};function getPathParamsForCorner({cornerRadius,cornerSmoothing,preserveSmoothing,roundingAndSmoothingBudget,cornerAngleAlpha=90}){let p=(1+cornerSmoothing)*cornerRadius;if(!preserveSmoothing){const maxCornerSmoothing=roundingAndSmoothingBudget/cornerRadius-1;cornerSmoothing=Math.min(cornerSmoothing,maxCornerSmoothing),p=Math.min(p,roundingAndSmoothingBudget)}const arcMeasure=90*(1-cornerSmoothing),arcSectionLength=Math.sin(toRadians(arcMeasure/2))*cornerRadius*Math.sqrt(2),angleAlpha=(cornerAngleAlpha-arcMeasure)/2,p3ToP4Distance=cornerRadius*Math.tan(toRadians(angleAlpha/2)),angleBeta=45*cornerSmoothing,c=p3ToP4Distance*Math.cos(toRadians(angleBeta)),d=c*Math.tan(toRadians(angleBeta));let b=(p-arcSectionLength-c-d)/3,a=2*b;if(preserveSmoothing&&p>roundingAndSmoothingBudget){const p1ToP3MaxDistance=roundingAndSmoothingBudget-d-arcSectionLength-c,minA=p1ToP3MaxDistance/6,maxB=p1ToP3MaxDistance-minA;b=Math.min(b,maxB),a=p1ToP3MaxDistance-b,p=Math.min(p,roundingAndSmoothingBudget)}return{a,b,c,d,p,arcSectionLength,cornerRadius}}__name(getPathParamsForCorner,"getPathParamsForCorner");function getSVGPathFromPathParams({width,height,topLeftPathParams,topRightPathParams,bottomLeftPathParams,bottomRightPathParams,topNotches=[],rightNotches=[],bottomNotches=[],leftNotches=[]}){let d=`M ${topLeftPathParams.p} 0`;return topNotches.forEach(n=>{d+=drawTopNotch(n)}),d+=`L ${width-topRightPathParams.p} 0`,d+=drawTopRightPath(topRightPathParams),rightNotches.forEach(n=>{d+=drawRightNotch(n,width)}),d+=`L ${width} ${height-bottomRightPathParams.p}`,d+=drawBottomRightPath(bottomRightPathParams),bottomNotches.forEach(n=>{d+=drawBottomNotch(n,height)}),d+=`L ${bottomLeftPathParams.p} ${height}`,d+=drawBottomLeftPath(bottomLeftPathParams),leftNotches.forEach(n=>{d+=drawLeftNotch(n)}),d+=`L 0 ${topLeftPathParams.p}`,d+=drawTopLeftPath(topLeftPathParams),d+="Z",d.replace(/[\t\s\n]+/g," ").trim()}__name(getSVGPathFromPathParams,"getSVGPathFromPathParams");function drawTopNotch({start,length,slope,depth}){const end=start+length;return`
+"use strict";var __defProp=Object.defineProperty;var __typeError=msg=>{throw TypeError(msg)};var __name=(target,value)=>__defProp(target,"name",{value,configurable:!0});var __accessCheck=(obj,member,msg)=>member.has(obj)||__typeError("Cannot "+msg);var __privateGet=(obj,member,getter)=>(__accessCheck(obj,member,"read from private field"),getter?getter.call(obj):member.get(obj)),__privateAdd=(obj,member,value)=>member.has(obj)?__typeError("Cannot add the same private member more than once"):member instanceof WeakSet?member.add(obj):member.set(obj,value),__privateSet=(obj,member,value,setter)=>(__accessCheck(obj,member,"write to private field"),setter?setter.call(obj,value):member.set(obj,value),value),__privateMethod=(obj,member,method)=>(__accessCheck(obj,member,"access private method"),method);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const cssUnitParser_index=require("../css-unit-parser/index.cjs"),elementResizer_index=require("../element-resizer/index.cjs"),intersector_index=require("../index-DZ44osDT.cjs"),string=require("../string-CbRNzmd9.cjs");require("construct-style-sheets-polyfill");function distributeAndNormalize({topLeftCornerRadius,topRightCornerRadius,bottomRightCornerRadius,bottomLeftCornerRadius,width,height}){const roundingAndSmoothingBudgetMap={topLeft:-1,topRight:-1,bottomLeft:-1,bottomRight:-1},cornerRadiusMap={topLeft:topLeftCornerRadius,topRight:topRightCornerRadius,bottomLeft:bottomLeftCornerRadius,bottomRight:bottomRightCornerRadius};return Object.entries(cornerRadiusMap).sort(([,radius1],[,radius2])=>radius2-radius1).forEach(([cornerName,radius])=>{const corner=cornerName,adjacents=adjacentsByCorner[corner],budget=Math.min(...adjacents.map(adjacent=>{const adjacentCornerRadius=cornerRadiusMap[adjacent.corner];if(radius===0&&adjacentCornerRadius===0)return 0;const adjacentCornerBudget=roundingAndSmoothingBudgetMap[adjacent.corner],sideLength=adjacent.side==="top"||adjacent.side==="bottom"?width:height;return adjacentCornerBudget>=0?sideLength-roundingAndSmoothingBudgetMap[adjacent.corner]:radius/(radius+adjacentCornerRadius)*sideLength}));roundingAndSmoothingBudgetMap[corner]=budget,cornerRadiusMap[corner]=Math.min(radius,budget)}),{topLeft:{radius:cornerRadiusMap.topLeft,roundingAndSmoothingBudget:roundingAndSmoothingBudgetMap.topLeft},topRight:{radius:cornerRadiusMap.topRight,roundingAndSmoothingBudget:roundingAndSmoothingBudgetMap.topRight},bottomLeft:{radius:cornerRadiusMap.bottomLeft,roundingAndSmoothingBudget:roundingAndSmoothingBudgetMap.bottomLeft},bottomRight:{radius:cornerRadiusMap.bottomRight,roundingAndSmoothingBudget:roundingAndSmoothingBudgetMap.bottomRight}}}__name(distributeAndNormalize,"distributeAndNormalize");const adjacentsByCorner={topLeft:[{corner:"topRight",side:"top"},{corner:"bottomLeft",side:"left"}],topRight:[{corner:"topLeft",side:"top"},{corner:"bottomRight",side:"right"}],bottomLeft:[{corner:"bottomRight",side:"bottom"},{corner:"topLeft",side:"left"}],bottomRight:[{corner:"bottomLeft",side:"bottom"},{corner:"topRight",side:"right"}]};function getPathParamsForCorner({cornerRadius,cornerSmoothing,preserveSmoothing,roundingAndSmoothingBudget,cornerAngleAlpha=90}){let p=(1+cornerSmoothing)*cornerRadius;if(!preserveSmoothing){const maxCornerSmoothing=roundingAndSmoothingBudget/cornerRadius-1;cornerSmoothing=Math.min(cornerSmoothing,maxCornerSmoothing),p=Math.min(p,roundingAndSmoothingBudget)}const arcMeasure=90*(1-cornerSmoothing),arcSectionLength=Math.sin(toRadians(arcMeasure/2))*cornerRadius*Math.sqrt(2),angleAlpha=(cornerAngleAlpha-arcMeasure)/2,p3ToP4Distance=cornerRadius*Math.tan(toRadians(angleAlpha/2)),angleBeta=45*cornerSmoothing,c=p3ToP4Distance*Math.cos(toRadians(angleBeta)),d=c*Math.tan(toRadians(angleBeta));let b=(p-arcSectionLength-c-d)/3,a=2*b;if(preserveSmoothing&&p>roundingAndSmoothingBudget){const p1ToP3MaxDistance=roundingAndSmoothingBudget-d-arcSectionLength-c,minA=p1ToP3MaxDistance/6,maxB=p1ToP3MaxDistance-minA;b=Math.min(b,maxB),a=p1ToP3MaxDistance-b,p=Math.min(p,roundingAndSmoothingBudget)}return{a,b,c,d,p,arcSectionLength,cornerRadius}}__name(getPathParamsForCorner,"getPathParamsForCorner");function getSVGPathFromPathParams({width,height,topLeftPathParams,topRightPathParams,bottomLeftPathParams,bottomRightPathParams,topNotches=[],rightNotches=[],bottomNotches=[],leftNotches=[]}){let d=`M ${topLeftPathParams.p} 0`;return topNotches.forEach(n=>{d+=drawTopNotch(n)}),d+=`L ${width-topRightPathParams.p} 0`,d+=drawTopRightPath(topRightPathParams),rightNotches.forEach(n=>{d+=drawRightNotch(n,width)}),d+=`L ${width} ${height-bottomRightPathParams.p}`,d+=drawBottomRightPath(bottomRightPathParams),bottomNotches.forEach(n=>{d+=drawBottomNotch(n,height)}),d+=`L ${bottomLeftPathParams.p} ${height}`,d+=drawBottomLeftPath(bottomLeftPathParams),leftNotches.forEach(n=>{d+=drawLeftNotch(n)}),d+=`L 0 ${topLeftPathParams.p}`,d+=drawTopLeftPath(topLeftPathParams),d+="Z",d.replace(/[\t\s\n]+/g," ").trim()}__name(getSVGPathFromPathParams,"getSVGPathFromPathParams");function drawTopNotch({start,length,slope,depth}){const end=start+length;return`
     L${start} 0
     C ${start+slope*.5},0 ${start+slope*.5},${depth} ${start+slope},${depth}
     L${end-slope},${depth}
@@ -44,14 +44,14 @@
     a ${cornerRadius} ${cornerRadius} 0 0 1 ${arcSectionLength} -${arcSectionLength}
     c ${c} ${-d}
       ${b+c} ${-d}
-      ${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")),color=computed.getPropertyValue("--notched-color"),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),color&&__privateGet(this,_pathElement).setAttribute("fill",color)},"#resizeListener"));const clipId=this.hasAttribute("clip")?"clip-"+string.generateId(10):null,tmpElement=document.createElement("div");tmpElement.innerHTML=`
+      ${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=`
       <svg xmlns="http://www.w3.org/2000/svg">
         ${clipId?`<clipPath id="${clipId}">`:""}
           <path></path>
         ${clipId?"</clipPath>":""}
       </svg>
       <slot></slot>
-    `,clipId&&(this.style.clipPath=`url(#${clipId})`),this.style.position="relative",__privateSet(this,_svgElement,tmpElement.querySelector("svg")),__privateGet(this,_svgElement).style.cssText=`
+    `,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=`
       position: absolute;
       top: 0;
       left: 0;

package/lib/{notched.js → notched/index.js}

@@ -5,10 +5,10 @@ var __typeError = (msg) => {
 var __name = (target, value) => __defProp(target, "name", { value, configurable: !0 });
 var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj)), __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value), __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value), __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-import { cssUnitParser } from "./css-unit-parser/index.js";
-import { elementResizer } from "./element-resizer/index.js";
-import { t as ticker } from "./index-ClTMVKJp.js";
-import { g as generateId } from "./string-B3lm2b7v.js";
+import { cssUnitParser } from "../css-unit-parser/index.js";
+import { elementResizer } from "../element-resizer/index.js";
+import { t as ticker } from "../index-ClTMVKJp.js";
+import { g as generateId } from "../string-B3lm2b7v.js";
 import "construct-style-sheets-polyfill";
 function distributeAndNormalize({
   topLeftCornerRadius,
@@ -404,7 +404,7 @@ const _NotchedElement = class _NotchedElement extends HTMLElement {
         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")), color = computed.getPropertyValue("--notched-color"), path = getSvgPath({
+      ) || 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,
@@ -424,9 +424,9 @@ const _NotchedElement = class _NotchedElement extends HTMLElement {
         width,
         height
       });
-      __privateGet(this, _pathElement).setAttribute("d", path), color && __privateGet(this, _pathElement).setAttribute("fill", color);
+      __privateGet(this, _pathElement).setAttribute("d", path), fill && __privateGet(this, _pathElement).setAttribute("fill", fill);
     }, "#resizeListener"));
-    const clipId = this.hasAttribute("clip") ? "clip-" + generateId(10) : null, tmpElement = document.createElement("div");
+    const clipContent = this.hasAttribute("clip-content"), clipId = this.hasAttribute("clip") || clipContent ? "clip-" + generateId(10) : null, tmpElement = document.createElement("div");
     tmpElement.innerHTML = `
       <svg xmlns="http://www.w3.org/2000/svg">
         ${clipId ? `<clipPath id="${clipId}">` : ""}
@@ -434,7 +434,7 @@ const _NotchedElement = class _NotchedElement extends HTMLElement {
         ${clipId ? "</clipPath>" : ""}
       </svg>
       <slot></slot>
-    `, clipId && (this.style.clipPath = `url(#${clipId})`), this.style.position = "relative", __privateSet(this, _svgElement, tmpElement.querySelector("svg")), __privateGet(this, _svgElement).style.cssText = `
+    `, 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 = `
       position: absolute;
       top: 0;
       left: 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aptechka",
-  "version": "0.87.1",
+  "version": "0.87.3",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/denisavitski/aptechka.git"