@inc2734/unitone-css 0.81.0 → 0.82.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/dist/app.css +1 -1
- package/dist/app.js +1 -1
- package/dist/library.js +1 -1
- package/package.json +1 -1
- package/src/app.js +0 -23
- package/src/foundation/_foundation.scss +4 -6
- package/src/helper/_helper.scss +0 -2
- package/src/helper/_typography.scss +4 -0
- package/src/layout-primitives/text/_text.scss +10 -1
- package/src/library.js +0 -26
- package/src/settings/_body.scss +6 -3
- package/src/settings/_root.scss +270 -203
- package/src/variables/_variables.scss +18 -15
- package/src/helper/_fluid-typography.scss +0 -15
package/dist/app.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var t,e={};var n=function(){if(t)return e;function n(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i}function i(t){return function(t){if(Array.isArray(t))return n(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||function(t,e){if(t){if("string"==typeof t)return n(t,e);var i=Object.prototype.toString.call(t).slice(8,-1);return"Object"===i&&t.constructor&&(i=t.constructor.name),"Map"===i||"Set"===i?Array.from(t):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?n(t,e):void 0}}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function r(t,e){var n="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!n){if(Array.isArray(t)||(n=function(t,e){if(t){if("string"==typeof t)return o(t,e);var n={}.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?o(t,e):void 0}}(t))||e){n&&(t=n);var i=0,r=function(){};return{s:r,n:function(){return i>=t.length?{done:!0}:{done:!1,value:t[i++]}},e:function(t){throw t},f:r}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,u=!0,l=!1;return{s:function(){n=n.call(t)},n:function(){var t=n.next();return u=t.done,t},e:function(t){l=!0,a=t},f:function(){try{u||null==n.return||n.return()}finally{if(l)throw a}}}}function o(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=Array(e);n<e;n++)i[n]=t[n];return i}function a(t,e){var n,i=this;return function(){for(var r=arguments.length,o=new Array(r),a=0;a<r;a++)o[a]=arguments[a];clearTimeout(n),n=setTimeout((function(){t.apply(i,o)}),e)}}t=1;var u=function(t){var e=parseFloat(window.getComputedStyle(document.documentElement).getPropertyValue("font-size")),n=parseFloat(window.getComputedStyle(t).getPropertyValue("font-size"));t.style.setProperty("--unitone--fluid-font-size-magnification",n/e)},l=function(t){var e,n,i=null===(e=[].slice.call(null!==(n=null==t?void 0:t.children)&&void 0!==n?n:[]))||void 0===e?void 0:e[0];if(i){var r,o=i.getBoundingClientRect();t.setAttribute("data-unitone-layout",t.getAttribute("data-unitone-layout").split(" ").filter((function(t){return!["divider:initialized","-stack"].includes(t)})).join(" "));var a=[].slice.call(t.children).filter((function(t){var e=window.getComputedStyle(t).getPropertyValue("position"),n=window.getComputedStyle(t).getPropertyValue("display");return"absolute"!==e&&"fixed"!==e&&"none"!==n}));a.forEach((function(t){var e=t.getAttribute("data-unitone-layout")||"",n=e.split(" ").filter((function(t){return!["-bol","-linewrap"].includes(t)})).join(" ");n!==e&&t.setAttribute("data-unitone-layout",n)})),a.forEach((function(t,e){var n,i=null===(n=r)||void 0===n?void 0:n.getBoundingClientRect(),a=t.getBoundingClientRect(),u=t.getAttribute("data-unitone-layout")||"",l=u.split(" ");(0===e||(null==i?void 0:i.top)<a.top&&(null==i?void 0:i.left)>=a.left)&&(l.includes("-bol")||l.push("-bol")),0<e&&o.top<a.top&&(l.includes("-linewrap")||l.push("-linewrap")),l!==u&&t.setAttribute("data-unitone-layout",l.filter(Boolean).join(" ")||""),r=t})),[].slice.call(a).every((function(t){return t.getBoundingClientRect().left===o.left}))&&t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," -stack")),t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," divider:initialized"))}},d=function(t){var e,n=[].slice.call(t.children),i=null==n?void 0:n[0];if(i){t.style.removeProperty("--unitone--stairs-step-overflow-volume"),t.style.removeProperty("--unitone--max-stairs-step"),[].slice.call(null!==(e=null==t?void 0:t.children)&&void 0!==e?e:[]).forEach((function(t){t.style.removeProperty("--unitone--stairs-step")}));var r,o=[],a=0,u=a,l=window.getComputedStyle(t).getPropertyValue("flex-direction");n.forEach((function(t){var e,n,d=window.getComputedStyle(t).getPropertyValue("position"),c=window.getComputedStyle(t).getPropertyValue("display");if("absolute"!==d&&"fixed"!==d&&"none"!==c){o.push(t);var s="row-reverse"===l?(null===(e=r)||void 0===e||null===(e=e.getBoundingClientRect())||void 0===e?void 0:e.left)<=t.getBoundingClientRect().left:(null===(n=r)||void 0===n||null===(n=n.getBoundingClientRect())||void 0===n?void 0:n.left)>=t.getBoundingClientRect().left;i===t||s?(a=0,t.style.setProperty("--unitone--stairs-step",a)):(a++,t.style.setProperty("--unitone--stairs-step",a)),r=t,a>u&&(u=a)}})),t.style.setProperty("--unitone--max-stairs-step",u);var d=t.getBoundingClientRect().bottom,c=o.reduce((function(t,e){var n=e.getBoundingClientRect().bottom-d;return t>n?t:n}),0);t.style.setProperty("--unitone--stairs-step-overflow-volume",c)}},c=function(t){t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout").replaceAll("vertical-writing:initialized","").trim())),t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout").replaceAll("vertical-writing:safari","").trim())),t.setAttribute("data-unitone-layout",t.getAttribute("data-unitone-layout").replace(" -force-switch",""));var e,n=getComputedStyle(t);if(String(n.getPropertyValue("--unitone--threshold")).trim()){var i=document.createElement("div");i.setAttribute("data-unitone-layout","vertical-writing__thresholder"),t.appendChild(i);var r=i.offsetWidth>=t.offsetWidth;if(t.removeChild(i),r)return void t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," -force-switch"))}[].slice.call(t.children).reverse().some((function(t){if(!["absolute","fixed"].includes(getComputedStyle(t).position)&&"none"!==getComputedStyle(t).display)return e=t,!0})),e&&(t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," vertical-writing:initialized")),t.getBoundingClientRect().left>e.getBoundingClientRect().left&&t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," vertical-writing:safari")),requestAnimationFrame((function(){var n=t.getBoundingClientRect().top+t.getBoundingClientRect().height,i=e.getBoundingClientRect().top+e.getBoundingClientRect().height;n!==i&&(t.parentNode.style.height="".concat(Math.ceil(i-t.getBoundingClientRect().top),"px"))})))};return e.debounce=a,e.dividersResizeObserver=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=0,o=new ResizeObserver(a((function(t){var e,i=r(t);try{for(i.s();!(e=i.n()).done;){var o,a=e.value,u=null===(o=a.borderBoxSize)||void 0===o?void 0:o[0].inlineSize;u!==n&&(l(a.target),n=u)}}catch(t){i.e(t)}finally{i.f()}}),250)),u=new MutationObserver((function(n){requestAnimationFrame((function(){var o,a=r(n);try{var u=function(){var n=o.value;if("attributes"===n.type&&"data-unitone-layout"===n.attributeName){var r,a,u,d,c=[].concat(i(null!==(r=null==e||null===(a=e.ignore)||void 0===a?void 0:a.layout)&&void 0!==r?r:[]),["divider:initialized","-bol","-linewrap","-stack"]);(null!==(u=n.target.getAttribute(n.attributeName))&&void 0!==u?u:"").split(" ").filter((function(t){return!c.includes(t)})).join(" ")!==(null!==(d=n.oldValue)&&void 0!==d?d:"").split(" ").filter((function(t){return!c.includes(t)})).join(" ")&&l(t)}else if("attributes"===n.type&&"class"===n.attributeName){var s,f,v,y,b=i(null!==(s=null==e||null===(f=e.ignore)||void 0===f?void 0:f.className)&&void 0!==s?s:[]);(null!==(v=n.target.getAttribute(n.attributeName))&&void 0!==v?v:"").split(" ").filter((function(t){return!b.includes(t)})).join(" ")!==(null!==(y=n.oldValue)&&void 0!==y?y:"").split(" ").filter((function(t){return!b.includes(t)})).join(" ")&&l(t)}else"attributes"===n.type&&"style"===n.attributeName&&l(t)};for(a.s();!(o=a.n()).done;)u()}catch(t){a.e(t)}finally{a.f()}}))}));return o.observe(t),u.observe(t,{attributes:!0,attributeFilter:["style","data-unitone-layout","class"],attributeOldValue:!0,subtree:!0,characterData:!0}),{resizeObserver:o,mutationObserver:u}},e.fluidFontSizeResizeObserver=function(t){var e=0;new ResizeObserver(a((function(t){var n,i=r(t);try{for(i.s();!(n=i.n()).done;){var o,a=n.value,l=null===(o=a.borderBoxSize)||void 0===o?void 0:o[0].inlineSize;l!==e&&(u(a.target),e=l)}}catch(t){i.e(t)}finally{i.f()}}),250)).observe(t)},e.setDividerLinewrap=l,e.setStairsStep=d,e.stairsResizeObserver=function(t){var e=new ResizeObserver(a((function(t){var e,n=r(t);try{for(n.s();!(e=n.n()).done;){var i=e.value;d(i.target)}}catch(t){n.e(t)}finally{n.f()}}),250));return e.observe(t),e},e.verticalsResizeObserver=function(t){var e=0,n=new ResizeObserver(a((function(t){var n,i=r(t);try{for(i.s();!(n=i.n()).done;){var o,a=n.value,u=null===(o=a.contentRect)||void 0===o?void 0:o.width;parseInt(u)!==parseInt(e)&&(e=u,a.target.parentNode.style.height="",c(a.target))}}catch(t){i.e(t)}finally{i.f()}}),250));n.observe(t);var i=new MutationObserver((function(e){requestAnimationFrame((function(){if(0<e.length){var n,i,r=e[0],o=null===(n=r.addedNodes)||void 0===n?void 0:n[0],a=null===(i=r.removedNodes)||void 0===i?void 0:i[0];if((null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing__thresholder"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing__thresholder"===a.getAttribute("data-unitone-layout")||(null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:initialized"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:initialized"===a.getAttribute("data-unitone-layout")||(null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:safari"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:safari"===a.getAttribute("data-unitone-layout"))return;c(t)}}))}));return i.observe(t,{attributes:!0,attributeFilter:["style"],childList:!0,subtree:!0}),{resizeObserver:n,mutationObserver:i}},e}();function i(t,e){var n="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!n){if(Array.isArray(t)||(n=function(t,e){if(t){if("string"==typeof t)return r(t,e);var n={}.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(t,e):void 0}}(t))||e){n&&(t=n);var i=0,o=function(){};return{s:o,n:function(){return i>=t.length?{done:!0}:{done:!1,value:t[i++]}},e:function(t){throw t},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,u=!0,l=!1;return{s:function(){n=n.call(t)},n:function(){var t=n.next();return u=t.done,t},e:function(t){l=!0,a=t},f:function(){try{u||null==n.return||n.return()}finally{if(l)throw a}}}}function r(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=Array(e);n<e;n++)i[n]=t[n];return i}document.addEventListener("DOMContentLoaded",(function(){new MutationObserver((function(t){requestAnimationFrame((function(){var e,r=i(t);try{for(r.s();!(e=r.n()).done;){e.value.addedNodes.forEach((function(t){var e,i=null===(e=t.parentNode)||void 0===e?void 0:e.querySelectorAll('[data-unitone-layout~="-fluid-typography"]');null==i||i.forEach((function(t){n.fluidFontSizeResizeObserver(t)}))}))}}catch(t){r.e(t)}finally{r.f()}}))})).observe(document.body,{childList:!0,subtree:!0})})),document.addEventListener("DOMContentLoaded",(function(){new MutationObserver((function(t){requestAnimationFrame((function(){var e,r=i(t);try{for(r.s();!(e=r.n()).done;){e.value.addedNodes.forEach((function(t){var e,i=null===(e=t.parentNode)||void 0===e?void 0:e.querySelectorAll('[data-unitone-layout*="-divider:"]');null==i||i.forEach((function(t){n.dividersResizeObserver(t)}))}))}}catch(t){r.e(t)}finally{r.f()}}))})).observe(document.body,{childList:!0,subtree:!0})})),document.addEventListener("DOMContentLoaded",(function(){new MutationObserver((function(t){requestAnimationFrame((function(){var e,r=i(t);try{for(r.s();!(e=r.n()).done;){e.value.addedNodes.forEach((function(t){var e,i=null===(e=t.parentNode)||void 0===e?void 0:e.querySelectorAll('[data-unitone-layout*="-stairs:"]');null==i||i.forEach((function(t){n.stairsResizeObserver(t)}))}))}}catch(t){r.e(t)}finally{r.f()}}))})).observe(document.body,{childList:!0,subtree:!0})})),document.addEventListener("DOMContentLoaded",(function(){new MutationObserver((function(t){requestAnimationFrame((function(){var e,r=i(t);try{for(r.s();!(e=r.n()).done;){e.value.addedNodes.forEach((function(t){var e,i=null===(e=t.parentNode)||void 0===e?void 0:e.querySelectorAll('[data-unitone-layout~="vertical-writing"]');null==i||i.forEach((function(t){n.verticalsResizeObserver(t)}))}))}}catch(t){r.e(t)}finally{r.f()}}))})).observe(document.body,{childList:!0,subtree:!0})}));
|
|
1
|
+
"use strict";var t,e={};var n=function(){if(t)return e;function n(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i}function i(t){return function(t){if(Array.isArray(t))return n(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||function(t,e){if(t){if("string"==typeof t)return n(t,e);var i=Object.prototype.toString.call(t).slice(8,-1);return"Object"===i&&t.constructor&&(i=t.constructor.name),"Map"===i||"Set"===i?Array.from(t):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?n(t,e):void 0}}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function r(t,e){var n="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!n){if(Array.isArray(t)||(n=function(t,e){if(t){if("string"==typeof t)return o(t,e);var n={}.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?o(t,e):void 0}}(t))||e){n&&(t=n);var i=0,r=function(){};return{s:r,n:function(){return i>=t.length?{done:!0}:{done:!1,value:t[i++]}},e:function(t){throw t},f:r}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,u=!0,l=!1;return{s:function(){n=n.call(t)},n:function(){var t=n.next();return u=t.done,t},e:function(t){l=!0,a=t},f:function(){try{u||null==n.return||n.return()}finally{if(l)throw a}}}}function o(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=Array(e);n<e;n++)i[n]=t[n];return i}function a(t,e){var n,i=this;return function(){for(var r=arguments.length,o=new Array(r),a=0;a<r;a++)o[a]=arguments[a];clearTimeout(n),n=setTimeout((function(){t.apply(i,o)}),e)}}t=1;var u=function(t){var e,n,i=null===(e=[].slice.call(null!==(n=null==t?void 0:t.children)&&void 0!==n?n:[]))||void 0===e?void 0:e[0];if(i){var r,o=i.getBoundingClientRect();t.setAttribute("data-unitone-layout",t.getAttribute("data-unitone-layout").split(" ").filter((function(t){return!["divider:initialized","-stack"].includes(t)})).join(" "));var a=[].slice.call(t.children).filter((function(t){var e=window.getComputedStyle(t).getPropertyValue("position"),n=window.getComputedStyle(t).getPropertyValue("display");return"absolute"!==e&&"fixed"!==e&&"none"!==n}));a.forEach((function(t){var e=t.getAttribute("data-unitone-layout")||"",n=e.split(" ").filter((function(t){return!["-bol","-linewrap"].includes(t)})).join(" ");n!==e&&t.setAttribute("data-unitone-layout",n)})),a.forEach((function(t,e){var n,i=null===(n=r)||void 0===n?void 0:n.getBoundingClientRect(),a=t.getBoundingClientRect(),u=t.getAttribute("data-unitone-layout")||"",l=u.split(" ");(0===e||(null==i?void 0:i.top)<a.top&&(null==i?void 0:i.left)>=a.left)&&(l.includes("-bol")||l.push("-bol")),0<e&&o.top<a.top&&(l.includes("-linewrap")||l.push("-linewrap")),l!==u&&t.setAttribute("data-unitone-layout",l.filter(Boolean).join(" ")||""),r=t})),[].slice.call(a).every((function(t){return t.getBoundingClientRect().left===o.left}))&&t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," -stack")),t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," divider:initialized"))}},l=function(t){var e,n=[].slice.call(t.children),i=null==n?void 0:n[0];if(i){t.style.removeProperty("--unitone--stairs-step-overflow-volume"),t.style.removeProperty("--unitone--max-stairs-step"),[].slice.call(null!==(e=null==t?void 0:t.children)&&void 0!==e?e:[]).forEach((function(t){t.style.removeProperty("--unitone--stairs-step")}));var r,o=[],a=0,u=a,l=window.getComputedStyle(t).getPropertyValue("flex-direction");n.forEach((function(t){var e,n,d=window.getComputedStyle(t).getPropertyValue("position"),c=window.getComputedStyle(t).getPropertyValue("display");if("absolute"!==d&&"fixed"!==d&&"none"!==c){o.push(t);var s="row-reverse"===l?(null===(e=r)||void 0===e||null===(e=e.getBoundingClientRect())||void 0===e?void 0:e.left)<=t.getBoundingClientRect().left:(null===(n=r)||void 0===n||null===(n=n.getBoundingClientRect())||void 0===n?void 0:n.left)>=t.getBoundingClientRect().left;i===t||s?(a=0,t.style.setProperty("--unitone--stairs-step",a)):(a++,t.style.setProperty("--unitone--stairs-step",a)),r=t,a>u&&(u=a)}})),t.style.setProperty("--unitone--max-stairs-step",u);var d=t.getBoundingClientRect().bottom,c=o.reduce((function(t,e){var n=e.getBoundingClientRect().bottom-d;return t>n?t:n}),0);t.style.setProperty("--unitone--stairs-step-overflow-volume",c)}},d=function(t){t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout").replaceAll("vertical-writing:initialized","").trim())),t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout").replaceAll("vertical-writing:safari","").trim())),t.setAttribute("data-unitone-layout",t.getAttribute("data-unitone-layout").replace(" -force-switch",""));var e,n=getComputedStyle(t);if(String(n.getPropertyValue("--unitone--threshold")).trim()){var i=document.createElement("div");i.setAttribute("data-unitone-layout","vertical-writing__thresholder"),t.appendChild(i);var r=i.offsetWidth>=t.offsetWidth;if(t.removeChild(i),r)return void t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," -force-switch"))}[].slice.call(t.children).reverse().some((function(t){if(!["absolute","fixed"].includes(getComputedStyle(t).position)&&"none"!==getComputedStyle(t).display)return e=t,!0})),e&&(t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," vertical-writing:initialized")),t.getBoundingClientRect().left>e.getBoundingClientRect().left&&t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," vertical-writing:safari")),requestAnimationFrame((function(){var n=t.getBoundingClientRect().top+t.getBoundingClientRect().height,i=e.getBoundingClientRect().top+e.getBoundingClientRect().height;n!==i&&(t.parentNode.style.height="".concat(Math.ceil(i-t.getBoundingClientRect().top),"px"))})))};return e.debounce=a,e.dividersResizeObserver=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=0,o=new ResizeObserver(a((function(t){var e,i=r(t);try{for(i.s();!(e=i.n()).done;){var o,a=e.value,l=null===(o=a.borderBoxSize)||void 0===o?void 0:o[0].inlineSize;l!==n&&(u(a.target),n=l)}}catch(t){i.e(t)}finally{i.f()}}),250)),l=new MutationObserver((function(n){requestAnimationFrame((function(){var o,a=r(n);try{var l=function(){var n=o.value;if("attributes"===n.type&&"data-unitone-layout"===n.attributeName){var r,a,l,d,c=[].concat(i(null!==(r=null==e||null===(a=e.ignore)||void 0===a?void 0:a.layout)&&void 0!==r?r:[]),["divider:initialized","-bol","-linewrap","-stack"]);(null!==(l=n.target.getAttribute(n.attributeName))&&void 0!==l?l:"").split(" ").filter((function(t){return!c.includes(t)})).join(" ")!==(null!==(d=n.oldValue)&&void 0!==d?d:"").split(" ").filter((function(t){return!c.includes(t)})).join(" ")&&u(t)}else if("attributes"===n.type&&"class"===n.attributeName){var s,f,v,y,b=i(null!==(s=null==e||null===(f=e.ignore)||void 0===f?void 0:f.className)&&void 0!==s?s:[]);(null!==(v=n.target.getAttribute(n.attributeName))&&void 0!==v?v:"").split(" ").filter((function(t){return!b.includes(t)})).join(" ")!==(null!==(y=n.oldValue)&&void 0!==y?y:"").split(" ").filter((function(t){return!b.includes(t)})).join(" ")&&u(t)}else"attributes"===n.type&&"style"===n.attributeName&&u(t)};for(a.s();!(o=a.n()).done;)l()}catch(t){a.e(t)}finally{a.f()}}))}));return o.observe(t),l.observe(t,{attributes:!0,attributeFilter:["style","data-unitone-layout","class"],attributeOldValue:!0,subtree:!0,characterData:!0}),{resizeObserver:o,mutationObserver:l}},e.setDividerLinewrap=u,e.setStairsStep=l,e.stairsResizeObserver=function(t){var e=new ResizeObserver(a((function(t){var e,n=r(t);try{for(n.s();!(e=n.n()).done;){var i=e.value;l(i.target)}}catch(t){n.e(t)}finally{n.f()}}),250));return e.observe(t),e},e.verticalsResizeObserver=function(t){var e=0,n=new ResizeObserver(a((function(t){var n,i=r(t);try{for(i.s();!(n=i.n()).done;){var o,a=n.value,u=null===(o=a.contentRect)||void 0===o?void 0:o.width;parseInt(u)!==parseInt(e)&&(e=u,a.target.parentNode.style.height="",d(a.target))}}catch(t){i.e(t)}finally{i.f()}}),250));n.observe(t);var i=new MutationObserver((function(e){requestAnimationFrame((function(){if(0<e.length){var n,i,r=e[0],o=null===(n=r.addedNodes)||void 0===n?void 0:n[0],a=null===(i=r.removedNodes)||void 0===i?void 0:i[0];if((null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing__thresholder"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing__thresholder"===a.getAttribute("data-unitone-layout")||(null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:initialized"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:initialized"===a.getAttribute("data-unitone-layout")||(null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:safari"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:safari"===a.getAttribute("data-unitone-layout"))return;d(t)}}))}));return i.observe(t,{attributes:!0,attributeFilter:["style"],childList:!0,subtree:!0}),{resizeObserver:n,mutationObserver:i}},e}();function i(t,e){var n="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!n){if(Array.isArray(t)||(n=function(t,e){if(t){if("string"==typeof t)return r(t,e);var n={}.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?r(t,e):void 0}}(t))||e){n&&(t=n);var i=0,o=function(){};return{s:o,n:function(){return i>=t.length?{done:!0}:{done:!1,value:t[i++]}},e:function(t){throw t},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,u=!0,l=!1;return{s:function(){n=n.call(t)},n:function(){var t=n.next();return u=t.done,t},e:function(t){l=!0,a=t},f:function(){try{u||null==n.return||n.return()}finally{if(l)throw a}}}}function r(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=Array(e);n<e;n++)i[n]=t[n];return i}document.addEventListener("DOMContentLoaded",(function(){new MutationObserver((function(t){requestAnimationFrame((function(){var e,r=i(t);try{for(r.s();!(e=r.n()).done;){e.value.addedNodes.forEach((function(t){var e,i=null===(e=t.parentNode)||void 0===e?void 0:e.querySelectorAll('[data-unitone-layout*="-divider:"]');null==i||i.forEach((function(t){n.dividersResizeObserver(t)}))}))}}catch(t){r.e(t)}finally{r.f()}}))})).observe(document.body,{childList:!0,subtree:!0})})),document.addEventListener("DOMContentLoaded",(function(){new MutationObserver((function(t){requestAnimationFrame((function(){var e,r=i(t);try{for(r.s();!(e=r.n()).done;){e.value.addedNodes.forEach((function(t){var e,i=null===(e=t.parentNode)||void 0===e?void 0:e.querySelectorAll('[data-unitone-layout*="-stairs:"]');null==i||i.forEach((function(t){n.stairsResizeObserver(t)}))}))}}catch(t){r.e(t)}finally{r.f()}}))})).observe(document.body,{childList:!0,subtree:!0})})),document.addEventListener("DOMContentLoaded",(function(){new MutationObserver((function(t){requestAnimationFrame((function(){var e,r=i(t);try{for(r.s();!(e=r.n()).done;){e.value.addedNodes.forEach((function(t){var e,i=null===(e=t.parentNode)||void 0===e?void 0:e.querySelectorAll('[data-unitone-layout~="vertical-writing"]');null==i||i.forEach((function(t){n.verticalsResizeObserver(t)}))}))}}catch(t){r.e(t)}finally{r.f()}}))})).observe(document.body,{childList:!0,subtree:!0})}));
|
package/dist/library.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";function t(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i}function e(e){return function(e){if(Array.isArray(e))return t(e)}(e)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(e)||function(e,n){if(e){if("string"==typeof e)return t(e,n);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?t(e,n):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function n(t,e){var n="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!n){if(Array.isArray(t)||(n=function(t,e){if(t){if("string"==typeof t)return i(t,e);var n={}.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?i(t,e):void 0}}(t))||e){n&&(t=n);var r=0,o=function(){};return{s:o,n:function(){return r>=t.length?{done:!0}:{done:!1,value:t[r++]}},e:function(t){throw t},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,l=!0,u=!1;return{s:function(){n=n.call(t)},n:function(){var t=n.next();return l=t.done,t},e:function(t){u=!0,a=t},f:function(){try{l||null==n.return||n.return()}finally{if(u)throw a}}}}function i(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=Array(e);n<e;n++)i[n]=t[n];return i}function r(t,e){var n,i=this;return function(){for(var r=arguments.length,o=new Array(r),a=0;a<r;a++)o[a]=arguments[a];clearTimeout(n),n=setTimeout((function(){t.apply(i,o)}),e)}}var o=function(t){var e=parseFloat(window.getComputedStyle(document.documentElement).getPropertyValue("font-size")),n=parseFloat(window.getComputedStyle(t).getPropertyValue("font-size"));t.style.setProperty("--unitone--fluid-font-size-magnification",n/e)},a=function(t){var e,n,i=null===(e=[].slice.call(null!==(n=null==t?void 0:t.children)&&void 0!==n?n:[]))||void 0===e?void 0:e[0];if(i){var r,o=i.getBoundingClientRect();t.setAttribute("data-unitone-layout",t.getAttribute("data-unitone-layout").split(" ").filter((function(t){return!["divider:initialized","-stack"].includes(t)})).join(" "));var a=[].slice.call(t.children).filter((function(t){var e=window.getComputedStyle(t).getPropertyValue("position"),n=window.getComputedStyle(t).getPropertyValue("display");return"absolute"!==e&&"fixed"!==e&&"none"!==n}));a.forEach((function(t){var e=t.getAttribute("data-unitone-layout")||"",n=e.split(" ").filter((function(t){return!["-bol","-linewrap"].includes(t)})).join(" ");n!==e&&t.setAttribute("data-unitone-layout",n)})),a.forEach((function(t,e){var n,i=null===(n=r)||void 0===n?void 0:n.getBoundingClientRect(),a=t.getBoundingClientRect(),l=t.getAttribute("data-unitone-layout")||"",u=l.split(" ");(0===e||(null==i?void 0:i.top)<a.top&&(null==i?void 0:i.left)>=a.left)&&(u.includes("-bol")||u.push("-bol")),0<e&&o.top<a.top&&(u.includes("-linewrap")||u.push("-linewrap")),u!==l&&t.setAttribute("data-unitone-layout",u.filter(Boolean).join(" ")||""),r=t})),[].slice.call(a).every((function(t){return t.getBoundingClientRect().left===o.left}))&&t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," -stack")),t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," divider:initialized"))}},l=function(t){var e,n=[].slice.call(t.children),i=null==n?void 0:n[0];if(i){t.style.removeProperty("--unitone--stairs-step-overflow-volume"),t.style.removeProperty("--unitone--max-stairs-step"),[].slice.call(null!==(e=null==t?void 0:t.children)&&void 0!==e?e:[]).forEach((function(t){t.style.removeProperty("--unitone--stairs-step")}));var r,o=[],a=0,l=a,u=window.getComputedStyle(t).getPropertyValue("flex-direction");n.forEach((function(t){var e,n,d=window.getComputedStyle(t).getPropertyValue("position"),s=window.getComputedStyle(t).getPropertyValue("display");if("absolute"!==d&&"fixed"!==d&&"none"!==s){o.push(t);var c="row-reverse"===u?(null===(e=r)||void 0===e||null===(e=e.getBoundingClientRect())||void 0===e?void 0:e.left)<=t.getBoundingClientRect().left:(null===(n=r)||void 0===n||null===(n=n.getBoundingClientRect())||void 0===n?void 0:n.left)>=t.getBoundingClientRect().left;i===t||c?(a=0,t.style.setProperty("--unitone--stairs-step",a)):(a++,t.style.setProperty("--unitone--stairs-step",a)),r=t,a>l&&(l=a)}})),t.style.setProperty("--unitone--max-stairs-step",l);var d=t.getBoundingClientRect().bottom,s=o.reduce((function(t,e){var n=e.getBoundingClientRect().bottom-d;return t>n?t:n}),0);t.style.setProperty("--unitone--stairs-step-overflow-volume",s)}},u=function(t){t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout").replaceAll("vertical-writing:initialized","").trim())),t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout").replaceAll("vertical-writing:safari","").trim())),t.setAttribute("data-unitone-layout",t.getAttribute("data-unitone-layout").replace(" -force-switch",""));var e,n=getComputedStyle(t);if(String(n.getPropertyValue("--unitone--threshold")).trim()){var i=document.createElement("div");i.setAttribute("data-unitone-layout","vertical-writing__thresholder"),t.appendChild(i);var r=i.offsetWidth>=t.offsetWidth;if(t.removeChild(i),r)return void t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," -force-switch"))}([].slice.call(t.children).reverse().some((function(t){if(!["absolute","fixed"].includes(getComputedStyle(t).position)&&"none"!==getComputedStyle(t).display)return e=t,!0})),e)&&(t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," vertical-writing:initialized")),t.getBoundingClientRect().left>e.getBoundingClientRect().left&&t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," vertical-writing:safari")),requestAnimationFrame((function(){var n=t.getBoundingClientRect().top+t.getBoundingClientRect().height,i=e.getBoundingClientRect().top+e.getBoundingClientRect().height;n!==i&&(t.parentNode.style.height="".concat(Math.ceil(i-t.getBoundingClientRect().top),"px"))})))};exports.debounce=r,exports.dividersResizeObserver=function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=0,l=new ResizeObserver(r((function(t){var e,i=n(t);try{for(i.s();!(e=i.n()).done;){var r,l=e.value,u=null===(r=l.borderBoxSize)||void 0===r?void 0:r[0].inlineSize;u!==o&&(a(l.target),o=u)}}catch(t){i.e(t)}finally{i.f()}}),250)),u=new MutationObserver((function(r){requestAnimationFrame((function(){var o,l=n(r);try{var u=function(){var n=o.value;if("attributes"===n.type&&"data-unitone-layout"===n.attributeName){var r,l,u,d,s=[].concat(e(null!==(r=null==i||null===(l=i.ignore)||void 0===l?void 0:l.layout)&&void 0!==r?r:[]),["divider:initialized","-bol","-linewrap","-stack"]);(null!==(u=n.target.getAttribute(n.attributeName))&&void 0!==u?u:"").split(" ").filter((function(t){return!s.includes(t)})).join(" ")!==(null!==(d=n.oldValue)&&void 0!==d?d:"").split(" ").filter((function(t){return!s.includes(t)})).join(" ")&&a(t)}else if("attributes"===n.type&&"class"===n.attributeName){var c,v,f,y,g=e(null!==(c=null==i||null===(v=i.ignore)||void 0===v?void 0:v.className)&&void 0!==c?c:[]);(null!==(f=n.target.getAttribute(n.attributeName))&&void 0!==f?f:"").split(" ").filter((function(t){return!g.includes(t)})).join(" ")!==(null!==(y=n.oldValue)&&void 0!==y?y:"").split(" ").filter((function(t){return!g.includes(t)})).join(" ")&&a(t)}else"attributes"===n.type&&"style"===n.attributeName&&a(t)};for(l.s();!(o=l.n()).done;)u()}catch(t){l.e(t)}finally{l.f()}}))}));return l.observe(t),u.observe(t,{attributes:!0,attributeFilter:["style","data-unitone-layout","class"],attributeOldValue:!0,subtree:!0,characterData:!0}),{resizeObserver:l,mutationObserver:u}},exports.fluidFontSizeResizeObserver=function(t){var e=0;new ResizeObserver(r((function(t){var i,r=n(t);try{for(r.s();!(i=r.n()).done;){var a,l=i.value,u=null===(a=l.borderBoxSize)||void 0===a?void 0:a[0].inlineSize;u!==e&&(o(l.target),e=u)}}catch(t){r.e(t)}finally{r.f()}}),250)).observe(t)},exports.setDividerLinewrap=a,exports.setStairsStep=l,exports.stairsResizeObserver=function(t){var e=new ResizeObserver(r((function(t){var e,i=n(t);try{for(i.s();!(e=i.n()).done;){var r=e.value;l(r.target)}}catch(t){i.e(t)}finally{i.f()}}),250));return e.observe(t),e},exports.verticalsResizeObserver=function(t){var e=0,i=new ResizeObserver(r((function(t){var i,r=n(t);try{for(r.s();!(i=r.n()).done;){var o,a=i.value,l=null===(o=a.contentRect)||void 0===o?void 0:o.width;parseInt(l)!==parseInt(e)&&(e=l,a.target.parentNode.style.height="",u(a.target))}}catch(t){r.e(t)}finally{r.f()}}),250));i.observe(t);var o=new MutationObserver((function(e){requestAnimationFrame((function(){if(0<e.length){var n,i,r=e[0],o=null===(n=r.addedNodes)||void 0===n?void 0:n[0],a=null===(i=r.removedNodes)||void 0===i?void 0:i[0];if((null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing__thresholder"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing__thresholder"===a.getAttribute("data-unitone-layout")||(null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:initialized"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:initialized"===a.getAttribute("data-unitone-layout")||(null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:safari"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:safari"===a.getAttribute("data-unitone-layout"))return;u(t)}}))}));return o.observe(t,{attributes:!0,attributeFilter:["style"],childList:!0,subtree:!0}),{resizeObserver:i,mutationObserver:o}};
|
|
1
|
+
"use strict";function t(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i}function e(e){return function(e){if(Array.isArray(e))return t(e)}(e)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(e)||function(e,n){if(e){if("string"==typeof e)return t(e,n);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?t(e,n):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function n(t,e){var n="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!n){if(Array.isArray(t)||(n=function(t,e){if(t){if("string"==typeof t)return i(t,e);var n={}.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?i(t,e):void 0}}(t))||e){n&&(t=n);var r=0,o=function(){};return{s:o,n:function(){return r>=t.length?{done:!0}:{done:!1,value:t[r++]}},e:function(t){throw t},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,l=!0,u=!1;return{s:function(){n=n.call(t)},n:function(){var t=n.next();return l=t.done,t},e:function(t){u=!0,a=t},f:function(){try{l||null==n.return||n.return()}finally{if(u)throw a}}}}function i(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=Array(e);n<e;n++)i[n]=t[n];return i}function r(t,e){var n,i=this;return function(){for(var r=arguments.length,o=new Array(r),a=0;a<r;a++)o[a]=arguments[a];clearTimeout(n),n=setTimeout((function(){t.apply(i,o)}),e)}}var o=function(t){var e,n,i=null===(e=[].slice.call(null!==(n=null==t?void 0:t.children)&&void 0!==n?n:[]))||void 0===e?void 0:e[0];if(i){var r,o=i.getBoundingClientRect();t.setAttribute("data-unitone-layout",t.getAttribute("data-unitone-layout").split(" ").filter((function(t){return!["divider:initialized","-stack"].includes(t)})).join(" "));var a=[].slice.call(t.children).filter((function(t){var e=window.getComputedStyle(t).getPropertyValue("position"),n=window.getComputedStyle(t).getPropertyValue("display");return"absolute"!==e&&"fixed"!==e&&"none"!==n}));a.forEach((function(t){var e=t.getAttribute("data-unitone-layout")||"",n=e.split(" ").filter((function(t){return!["-bol","-linewrap"].includes(t)})).join(" ");n!==e&&t.setAttribute("data-unitone-layout",n)})),a.forEach((function(t,e){var n,i=null===(n=r)||void 0===n?void 0:n.getBoundingClientRect(),a=t.getBoundingClientRect(),l=t.getAttribute("data-unitone-layout")||"",u=l.split(" ");(0===e||(null==i?void 0:i.top)<a.top&&(null==i?void 0:i.left)>=a.left)&&(u.includes("-bol")||u.push("-bol")),0<e&&o.top<a.top&&(u.includes("-linewrap")||u.push("-linewrap")),u!==l&&t.setAttribute("data-unitone-layout",u.filter(Boolean).join(" ")||""),r=t})),[].slice.call(a).every((function(t){return t.getBoundingClientRect().left===o.left}))&&t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," -stack")),t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," divider:initialized"))}},a=function(t){var e,n=[].slice.call(t.children),i=null==n?void 0:n[0];if(i){t.style.removeProperty("--unitone--stairs-step-overflow-volume"),t.style.removeProperty("--unitone--max-stairs-step"),[].slice.call(null!==(e=null==t?void 0:t.children)&&void 0!==e?e:[]).forEach((function(t){t.style.removeProperty("--unitone--stairs-step")}));var r,o=[],a=0,l=a,u=window.getComputedStyle(t).getPropertyValue("flex-direction");n.forEach((function(t){var e,n,d=window.getComputedStyle(t).getPropertyValue("position"),s=window.getComputedStyle(t).getPropertyValue("display");if("absolute"!==d&&"fixed"!==d&&"none"!==s){o.push(t);var c="row-reverse"===u?(null===(e=r)||void 0===e||null===(e=e.getBoundingClientRect())||void 0===e?void 0:e.left)<=t.getBoundingClientRect().left:(null===(n=r)||void 0===n||null===(n=n.getBoundingClientRect())||void 0===n?void 0:n.left)>=t.getBoundingClientRect().left;i===t||c?(a=0,t.style.setProperty("--unitone--stairs-step",a)):(a++,t.style.setProperty("--unitone--stairs-step",a)),r=t,a>l&&(l=a)}})),t.style.setProperty("--unitone--max-stairs-step",l);var d=t.getBoundingClientRect().bottom,s=o.reduce((function(t,e){var n=e.getBoundingClientRect().bottom-d;return t>n?t:n}),0);t.style.setProperty("--unitone--stairs-step-overflow-volume",s)}},l=function(t){t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout").replaceAll("vertical-writing:initialized","").trim())),t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout").replaceAll("vertical-writing:safari","").trim())),t.setAttribute("data-unitone-layout",t.getAttribute("data-unitone-layout").replace(" -force-switch",""));var e,n=getComputedStyle(t);if(String(n.getPropertyValue("--unitone--threshold")).trim()){var i=document.createElement("div");i.setAttribute("data-unitone-layout","vertical-writing__thresholder"),t.appendChild(i);var r=i.offsetWidth>=t.offsetWidth;if(t.removeChild(i),r)return void t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," -force-switch"))}([].slice.call(t.children).reverse().some((function(t){if(!["absolute","fixed"].includes(getComputedStyle(t).position)&&"none"!==getComputedStyle(t).display)return e=t,!0})),e)&&(t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," vertical-writing:initialized")),t.getBoundingClientRect().left>e.getBoundingClientRect().left&&t.setAttribute("data-unitone-layout","".concat(t.getAttribute("data-unitone-layout")," vertical-writing:safari")),requestAnimationFrame((function(){var n=t.getBoundingClientRect().top+t.getBoundingClientRect().height,i=e.getBoundingClientRect().top+e.getBoundingClientRect().height;n!==i&&(t.parentNode.style.height="".concat(Math.ceil(i-t.getBoundingClientRect().top),"px"))})))};exports.debounce=r,exports.dividersResizeObserver=function(t){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},a=0,l=new ResizeObserver(r((function(t){var e,i=n(t);try{for(i.s();!(e=i.n()).done;){var r,l=e.value,u=null===(r=l.borderBoxSize)||void 0===r?void 0:r[0].inlineSize;u!==a&&(o(l.target),a=u)}}catch(t){i.e(t)}finally{i.f()}}),250)),u=new MutationObserver((function(r){requestAnimationFrame((function(){var a,l=n(r);try{var u=function(){var n=a.value;if("attributes"===n.type&&"data-unitone-layout"===n.attributeName){var r,l,u,d,s=[].concat(e(null!==(r=null==i||null===(l=i.ignore)||void 0===l?void 0:l.layout)&&void 0!==r?r:[]),["divider:initialized","-bol","-linewrap","-stack"]);(null!==(u=n.target.getAttribute(n.attributeName))&&void 0!==u?u:"").split(" ").filter((function(t){return!s.includes(t)})).join(" ")!==(null!==(d=n.oldValue)&&void 0!==d?d:"").split(" ").filter((function(t){return!s.includes(t)})).join(" ")&&o(t)}else if("attributes"===n.type&&"class"===n.attributeName){var c,v,f,y,g=e(null!==(c=null==i||null===(v=i.ignore)||void 0===v?void 0:v.className)&&void 0!==c?c:[]);(null!==(f=n.target.getAttribute(n.attributeName))&&void 0!==f?f:"").split(" ").filter((function(t){return!g.includes(t)})).join(" ")!==(null!==(y=n.oldValue)&&void 0!==y?y:"").split(" ").filter((function(t){return!g.includes(t)})).join(" ")&&o(t)}else"attributes"===n.type&&"style"===n.attributeName&&o(t)};for(l.s();!(a=l.n()).done;)u()}catch(t){l.e(t)}finally{l.f()}}))}));return l.observe(t),u.observe(t,{attributes:!0,attributeFilter:["style","data-unitone-layout","class"],attributeOldValue:!0,subtree:!0,characterData:!0}),{resizeObserver:l,mutationObserver:u}},exports.setDividerLinewrap=o,exports.setStairsStep=a,exports.stairsResizeObserver=function(t){var e=new ResizeObserver(r((function(t){var e,i=n(t);try{for(i.s();!(e=i.n()).done;){var r=e.value;a(r.target)}}catch(t){i.e(t)}finally{i.f()}}),250));return e.observe(t),e},exports.verticalsResizeObserver=function(t){var e=0,i=new ResizeObserver(r((function(t){var i,r=n(t);try{for(r.s();!(i=r.n()).done;){var o,a=i.value,u=null===(o=a.contentRect)||void 0===o?void 0:o.width;parseInt(u)!==parseInt(e)&&(e=u,a.target.parentNode.style.height="",l(a.target))}}catch(t){r.e(t)}finally{r.f()}}),250));i.observe(t);var o=new MutationObserver((function(e){requestAnimationFrame((function(){if(0<e.length){var n,i,r=e[0],o=null===(n=r.addedNodes)||void 0===n?void 0:n[0],a=null===(i=r.removedNodes)||void 0===i?void 0:i[0];if((null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing__thresholder"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing__thresholder"===a.getAttribute("data-unitone-layout")||(null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:initialized"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:initialized"===a.getAttribute("data-unitone-layout")||(null==o?void 0:o.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:safari"===o.getAttribute("data-unitone-layout")||(null==a?void 0:a.nodeType)===Node.ELEMENT_NODE&&"vertical-writing:safari"===a.getAttribute("data-unitone-layout"))return;l(t)}}))}));return o.observe(t,{attributes:!0,attributeFilter:["style"],childList:!0,subtree:!0}),{resizeObserver:i,mutationObserver:o}};
|
package/package.json
CHANGED
package/src/app.js
CHANGED
|
@@ -1,32 +1,9 @@
|
|
|
1
1
|
import {
|
|
2
|
-
fluidFontSizeResizeObserver,
|
|
3
2
|
dividersResizeObserver,
|
|
4
3
|
stairsResizeObserver,
|
|
5
4
|
verticalsResizeObserver,
|
|
6
5
|
} from '@inc2734/unitone-css/library';
|
|
7
6
|
|
|
8
|
-
document.addEventListener('DOMContentLoaded', () => {
|
|
9
|
-
const observer = new MutationObserver((entries) => {
|
|
10
|
-
requestAnimationFrame(() => {
|
|
11
|
-
for (const entry of entries) {
|
|
12
|
-
entry.addedNodes.forEach((addedNode) => {
|
|
13
|
-
const targets = addedNode.parentNode?.querySelectorAll(
|
|
14
|
-
'[data-unitone-layout~="-fluid-typography"]',
|
|
15
|
-
);
|
|
16
|
-
targets?.forEach((target) => {
|
|
17
|
-
fluidFontSizeResizeObserver(target);
|
|
18
|
-
});
|
|
19
|
-
});
|
|
20
|
-
}
|
|
21
|
-
});
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
observer.observe(document.body, {
|
|
25
|
-
childList: true,
|
|
26
|
-
subtree: true,
|
|
27
|
-
});
|
|
28
|
-
});
|
|
29
|
-
|
|
30
7
|
document.addEventListener('DOMContentLoaded', () => {
|
|
31
8
|
const observer = new MutationObserver((entries) => {
|
|
32
9
|
requestAnimationFrame(() => {
|
|
@@ -10,12 +10,6 @@
|
|
|
10
10
|
box-sizing: border-box;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
html {
|
|
14
|
-
-webkit-text-size-adjust: 100%;
|
|
15
|
-
line-break: normal;
|
|
16
|
-
hanging-punctuation: allow-end;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
13
|
a {
|
|
20
14
|
text-underline-offset: 0.1em;
|
|
21
15
|
text-decoration-thickness: 1px;
|
|
@@ -109,3 +103,7 @@ figcaption {
|
|
|
109
103
|
min-width: fit-content !important;
|
|
110
104
|
text-align: start;
|
|
111
105
|
}
|
|
106
|
+
|
|
107
|
+
pre {
|
|
108
|
+
text-spacing-trim: space-all;
|
|
109
|
+
}
|
package/src/helper/_helper.scss
CHANGED
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
@use 'auto-repeat';
|
|
6
6
|
@use 'auto-phrase';
|
|
7
7
|
@use 'background-clip';
|
|
8
|
-
@use 'fluid-typography';
|
|
9
8
|
@use 'gap';
|
|
10
9
|
@use 'gutters';
|
|
11
10
|
@use 'justify-content';
|
|
@@ -26,7 +25,6 @@
|
|
|
26
25
|
@include auto-repeat.auto-repeat();
|
|
27
26
|
@include auto-phrase.auto-phrase();
|
|
28
27
|
@include background-clip.background-clip();
|
|
29
|
-
@include fluid-typography.fluid-typography();
|
|
30
28
|
@include gap.gap();
|
|
31
29
|
@include gutters.gutters();
|
|
32
30
|
@include justify-content.justify-content();
|
|
@@ -79,6 +79,10 @@
|
|
|
79
79
|
--unitone--font-size: 0;
|
|
80
80
|
}
|
|
81
81
|
|
|
82
|
+
:where(h1, h2, h3, h4, h5, h6) {
|
|
83
|
+
text-wrap: pretty;
|
|
84
|
+
}
|
|
85
|
+
|
|
82
86
|
&:lang(ja) {
|
|
83
87
|
font-feature-settings: "palt" 0;
|
|
84
88
|
font-kerning: none;
|
|
@@ -104,7 +108,12 @@
|
|
|
104
108
|
margin-left: auto;
|
|
105
109
|
}
|
|
106
110
|
|
|
107
|
-
|
|
111
|
+
// We want to put a larger space than usual before and after paragraphs with large font sizes.
|
|
112
|
+
> * + *:where(:not(:last-child)) {
|
|
113
|
+
margin-block: var(--unitone--margin-block);
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
> * + *:where(:last-child) {
|
|
108
117
|
margin-block-start: var(--unitone--margin-block);
|
|
109
118
|
}
|
|
110
119
|
|
package/src/library.js
CHANGED
|
@@ -9,32 +9,6 @@ export function debounce(fn, delay) {
|
|
|
9
9
|
};
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
-
const setFluidFontSizeMagnification = (target) => {
|
|
13
|
-
const baseFontSize = parseFloat(
|
|
14
|
-
window.getComputedStyle(document.documentElement).getPropertyValue('font-size'),
|
|
15
|
-
);
|
|
16
|
-
const fontSize = parseFloat(window.getComputedStyle(target).getPropertyValue('font-size'));
|
|
17
|
-
target.style.setProperty('--unitone--fluid-font-size-magnification', fontSize / baseFontSize);
|
|
18
|
-
};
|
|
19
|
-
|
|
20
|
-
export const fluidFontSizeResizeObserver = (target) => {
|
|
21
|
-
let prevWidth = 0;
|
|
22
|
-
|
|
23
|
-
const observer = new ResizeObserver(
|
|
24
|
-
debounce((entries) => {
|
|
25
|
-
for (const entry of entries) {
|
|
26
|
-
const width = entry.borderBoxSize?.[0].inlineSize;
|
|
27
|
-
if (width !== prevWidth) {
|
|
28
|
-
setFluidFontSizeMagnification(entry.target);
|
|
29
|
-
prevWidth = width;
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
}, 250),
|
|
33
|
-
);
|
|
34
|
-
|
|
35
|
-
observer.observe(target);
|
|
36
|
-
};
|
|
37
|
-
|
|
38
12
|
export const setDividerLinewrap = (target) => {
|
|
39
13
|
const firstChild = [].slice.call(target?.children ?? [])?.[0];
|
|
40
14
|
if (!firstChild) {
|
package/src/settings/_body.scss
CHANGED
|
@@ -2,10 +2,13 @@
|
|
|
2
2
|
background-color: var(--unitone--color--background);
|
|
3
3
|
color: var(--unitone--color--text);
|
|
4
4
|
font-family: var(--unitone--font-family);
|
|
5
|
-
}
|
|
6
5
|
|
|
7
|
-
body {
|
|
8
6
|
-webkit-font-smoothing: antialiased;
|
|
9
7
|
// -moz-osx-font-smooting: grayscale; // White out elements will activate this.
|
|
10
|
-
|
|
8
|
+
-webkit-text-size-adjust: 100%;
|
|
9
|
+
text-size-adjust: 100%;
|
|
10
|
+
hanging-punctuation: allow-end;
|
|
11
|
+
line-break: strict;
|
|
12
|
+
overflow-wrap: anywhere;
|
|
13
|
+
text-spacing-trim: trim-start;
|
|
11
14
|
}
|