@stories-js/core
Version:
Stories web components to build stories
5 lines • 6.35 kB
JavaScript
/*!
* (C) StoriesJS https://storiesjs.org - GPL-2.0 License
*/
import{r as i,f as d,h as r,c as n}from"./p-dea5a230.js";import{m as t}from"./p-56a7b20e.js";const s=":host{padding-left:var(--stories-grid-column-padding-xs, var(--stories-grid-column-padding, 5px));padding-right:var(--stories-grid-column-padding-xs, var(--stories-grid-column-padding, 5px));padding-top:var(--stories-grid-column-padding-xs, var(--stories-grid-column-padding, 5px));padding-bottom:var(--stories-grid-column-padding-xs, var(--stories-grid-column-padding, 5px));margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;width:100%;max-width:100%;min-height:1px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--stories-grid-column-padding-xs, var(--stories-grid-column-padding, 5px));padding-inline-start:var(--stories-grid-column-padding-xs, var(--stories-grid-column-padding, 5px));-webkit-padding-end:var(--stories-grid-column-padding-xs, var(--stories-grid-column-padding, 5px));padding-inline-end:var(--stories-grid-column-padding-xs, var(--stories-grid-column-padding, 5px))}}@media (min-width: 576px){:host{padding-left:var(--stories-grid-column-padding-sm, var(--stories-grid-column-padding, 5px));padding-right:var(--stories-grid-column-padding-sm, var(--stories-grid-column-padding, 5px));padding-top:var(--stories-grid-column-padding-sm, var(--stories-grid-column-padding, 5px));padding-bottom:var(--stories-grid-column-padding-sm, var(--stories-grid-column-padding, 5px))}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--stories-grid-column-padding-sm, var(--stories-grid-column-padding, 5px));padding-inline-start:var(--stories-grid-column-padding-sm, var(--stories-grid-column-padding, 5px));-webkit-padding-end:var(--stories-grid-column-padding-sm, var(--stories-grid-column-padding, 5px));padding-inline-end:var(--stories-grid-column-padding-sm, var(--stories-grid-column-padding, 5px))}}}@media (min-width: 768px){:host{padding-left:var(--stories-grid-column-padding-md, var(--stories-grid-column-padding, 5px));padding-right:var(--stories-grid-column-padding-md, var(--stories-grid-column-padding, 5px));padding-top:var(--stories-grid-column-padding-md, var(--stories-grid-column-padding, 5px));padding-bottom:var(--stories-grid-column-padding-md, var(--stories-grid-column-padding, 5px))}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--stories-grid-column-padding-md, var(--stories-grid-column-padding, 5px));padding-inline-start:var(--stories-grid-column-padding-md, var(--stories-grid-column-padding, 5px));-webkit-padding-end:var(--stories-grid-column-padding-md, var(--stories-grid-column-padding, 5px));padding-inline-end:var(--stories-grid-column-padding-md, var(--stories-grid-column-padding, 5px))}}}@media (min-width: 992px){:host{padding-left:var(--stories-grid-column-padding-lg, var(--stories-grid-column-padding, 5px));padding-right:var(--stories-grid-column-padding-lg, var(--stories-grid-column-padding, 5px));padding-top:var(--stories-grid-column-padding-lg, var(--stories-grid-column-padding, 5px));padding-bottom:var(--stories-grid-column-padding-lg, var(--stories-grid-column-padding, 5px))}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--stories-grid-column-padding-lg, var(--stories-grid-column-padding, 5px));padding-inline-start:var(--stories-grid-column-padding-lg, var(--stories-grid-column-padding, 5px));-webkit-padding-end:var(--stories-grid-column-padding-lg, var(--stories-grid-column-padding, 5px));padding-inline-end:var(--stories-grid-column-padding-lg, var(--stories-grid-column-padding, 5px))}}}@media (min-width: 1200px){:host{padding-left:var(--stories-grid-column-padding-xl, var(--stories-grid-column-padding, 5px));padding-right:var(--stories-grid-column-padding-xl, var(--stories-grid-column-padding, 5px));padding-top:var(--stories-grid-column-padding-xl, var(--stories-grid-column-padding, 5px));padding-bottom:var(--stories-grid-column-padding-xl, var(--stories-grid-column-padding, 5px))}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--stories-grid-column-padding-xl, var(--stories-grid-column-padding, 5px));padding-inline-start:var(--stories-grid-column-padding-xl, var(--stories-grid-column-padding, 5px));-webkit-padding-end:var(--stories-grid-column-padding-xl, var(--stories-grid-column-padding, 5px));padding-inline-end:var(--stories-grid-column-padding-xl, var(--stories-grid-column-padding, 5px))}}}";const a=window;const g=!!(a.CSS&&a.CSS.supports&&a.CSS.supports("--a: 0"));const o=["","xs","sm","md","lg","xl"];const e=class{constructor(d){i(this,d)}onResize(){d(this)}getColumns(i){let d;for(const r of o){const n=t(r);const s=this[i+r.charAt(0).toUpperCase()+r.slice(1)];if(n&&s!==undefined){d=s}}return d}calculateSize(){const i=this.getColumns("size");if(!i||i===""){return}const d=i==="auto"?"auto":g?`calc(calc(${i} / var(--stories-grid-columns, 12)) * 100%)`:i/12*100+"%";return{flex:`0 0 ${d}`,width:`${d}`,"max-width":`${d}`}}calculatePosition(i,d){const r=this.getColumns(i);if(!r){return}const n=g?`calc(calc(${r} / var(--stories-grid-columns, 12)) * 100%)`:r>0&&r<12?r/12*100+"%":"auto";return{[d]:n}}calculateOffset(i){return this.calculatePosition("offset",i?"margin-right":"margin-left")}calculatePull(i){return this.calculatePosition("pull",i?"left":"right")}calculatePush(i){return this.calculatePosition("push",i?"right":"left")}render(){const i=document.dir==="rtl";return r(n,{style:Object.assign(Object.assign(Object.assign(Object.assign({},this.calculateOffset(i)),this.calculatePull(i)),this.calculatePush(i)),this.calculateSize())},r("slot",null))}};e.style=s;export{e as stories_col};
//# sourceMappingURL=p-575b507c.entry.js.map