@bobbykim/mcl-container 0.9.6 → 0.9.7
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/mcl-container.js
CHANGED
|
@@ -46,6 +46,7 @@ const H = { class: "relative min-h-9 md:min-h-12 lg:min-h-15" }, N = ["points"],
|
|
|
46
46
|
}, [
|
|
47
47
|
r("div", H, [
|
|
48
48
|
(g(), w("svg", {
|
|
49
|
+
focusable: "false",
|
|
49
50
|
class: d(["absolute inset-x-0 left-0 block h-full w-full", v(u).svgFillColorVariant({ color: e.containerBg })]),
|
|
50
51
|
viewBox: "0 0 100 100",
|
|
51
52
|
preserveAspectRatio: "none",
|
|
@@ -75,6 +76,7 @@ const H = { class: "relative min-h-9 md:min-h-12 lg:min-h-15" }, N = ["points"],
|
|
|
75
76
|
], 2),
|
|
76
77
|
r("div", j, [
|
|
77
78
|
(g(), w("svg", {
|
|
79
|
+
focusable: "false",
|
|
78
80
|
class: d(["absolute inset-x-0 left-0 block h-full w-full", v(u).svgFillColorVariant({ color: e.containerBg })]),
|
|
79
81
|
viewBox: "0 0 100 100",
|
|
80
82
|
preserveAspectRatio: "none",
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".space-hts[data-v-c077deeb]{height:calc(var(--space-height) + 36px)}@media screen and (min-width:768px){.space-hts[data-v-c077deeb]{height:calc(var(--space-height) + 48px)}}@media screen and (min-width:1024px){.space-hts[data-v-c077deeb]{height:calc(var(--space-height) + 64px)}}.bg-image[data-v-c077deeb]{background-image:var(--bg-image)}")),document.head.appendChild(e)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
|
|
2
|
-
(function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@bobbykim/manguito-theme")):typeof define=="function"&&define.amd?define(["exports","vue","@bobbykim/manguito-theme"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f.MclContainer={},f.Vue,f.ManguitoTheme))})(this,(function(f,e,c){"use strict";const y={class:"relative min-h-9 md:min-h-12 lg:min-h-15"},B=["points"],V={class:"container grid gap-4 md:grid-cols-4"},E={class:"relative min-h-9 md:min-h-12 lg:min-h-15"},k=["points"],z=e.defineComponent({__name:"MclContainerA",props:{sectionBg:{default:"light-1"},containerBg:{default:"primary"},topDirection:{default:"left"},bottomDirection:{default:"left"},twoColumns:{type:Boolean,default:!0},leftColumnWidth:{default:50}},setup(t){const n=(s,r)=>s==="top"?r==="left"?"0,0 100,100 0,100":"100,0 100,100 0,100":r==="left"?"0,0 100,0 0,100":"0,0 100,0 100,100",l=(s,r)=>{if(!s)return"md:col-span-4";switch(r){case 25:return"md:col-span-1";case 50:return"md:col-span-2";case 75:return"md:col-span-3";case 100:return"md:col-span-4";default:return""}},d=(s,r)=>{if(!s)return"";switch(r){case 25:return"md:col-span-3";case 50:return"md:col-span-2";case 75:return"md:col-span-1";default:return""}};return(s,r)=>(e.openBlock(),e.createElementBlock("section",{class:e.normalizeClass(["py-lg lg:py-xl",e.unref(c.generateClass).bgColorVariant({color:t.sectionBg})])},[e.createElementVNode("div",y,[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(["absolute inset-x-0 left-0 block h-full w-full",e.unref(c.generateClass).svgFillColorVariant({color:t.containerBg})]),viewBox:"0 0 100 100",preserveAspectRatio:"none","aria-hidden":"true"},[e.createElementVNode("polygon",{points:n("top",t.topDirection)},null,8,B)],2))]),e.createElementVNode("div",{class:e.normalizeClass(["px-sm py-md md:px-md md:py-lg lg:px-lg lg:py-xl",e.unref(c.generateClass).bgColorVariant({color:t.containerBg})])},[e.createElementVNode("div",V,[e.createElementVNode("div",{class:e.normalizeClass(l(t.twoColumns,t.leftColumnWidth))},[e.renderSlot(s.$slots,"left-column")],2),t.twoColumns&&t.leftColumnWidth!==100?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(d(t.twoColumns,t.leftColumnWidth))},[e.renderSlot(s.$slots,"right-column")],2)):e.createCommentVNode("",!0)])],2),e.createElementVNode("div",E,[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(["absolute inset-x-0 left-0 block h-full w-full",e.unref(c.generateClass).svgFillColorVariant({color:t.containerBg})]),viewBox:"0 0 100 100",preserveAspectRatio:"none","aria-hidden":"true"},[e.createElementVNode("polygon",{points:n("bottom",t.bottomDirection)},null,8,k)],2))])],2))}});function S(t,n){return e.getCurrentScope()?(e.onScopeDispose(t,n),!0):!1}const N=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;function $(t){return Array.isArray(t)?t:[t]}function M(t){return e.getCurrentInstance()}function A(t,n=!0,l){M()?e.onMounted(t,l):n?t():e.nextTick(t)}const w=N?window:void 0;function u(t){var n;const l=e.toValue(t);return(n=l?.$el)!==null&&n!==void 0?n:l}function R(){const t=e.shallowRef(!1),n=e.getCurrentInstance();return n&&e.onMounted(()=>{t.value=!0},n),t}function W(t){const n=R();return e.computed(()=>(n.value,!!t()))}function _(t,n,l={}){const{window:d=w,...s}=l;let r;const i=W(()=>d&&"ResizeObserver"in d),a=()=>{r&&(r.disconnect(),r=void 0)},p=e.watch(e.computed(()=>{const m=e.toValue(t);return Array.isArray(m)?m.map(o=>u(o)):[u(m)]}),m=>{if(a(),i.value&&d){r=new ResizeObserver(n);for(const o of m)o&&r.observe(o,s)}},{immediate:!0,flush:"post"}),g=()=>{a(),p()};return S(g),{isSupported:i,stop:g}}function O(t,n={width:0,height:0},l={}){const{window:d=w,box:s="content-box"}=l,r=e.computed(()=>{var o;return(o=u(t))===null||o===void 0||(o=o.namespaceURI)===null||o===void 0?void 0:o.includes("svg")}),i=e.shallowRef(n.width),a=e.shallowRef(n.height),{stop:p}=_(t,([o])=>{const x=s==="border-box"?o.borderBoxSize:s==="content-box"?o.contentBoxSize:o.devicePixelContentBoxSize;if(d&&r.value){const C=u(t);if(C){const h=C.getBoundingClientRect();i.value=h.width,a.value=h.height}}else if(x){const C=$(x);i.value=C.reduce((h,{inlineSize:b})=>h+b,0),a.value=C.reduce((h,{blockSize:b})=>h+b,0)}else i.value=o.contentRect.width,a.value=o.contentRect.height},l);A(()=>{const o=u(t);o&&(i.value="offsetWidth"in o?o.offsetWidth:n.width,a.value="offsetHeight"in o?o.offsetHeight:n.height)});const g=e.watch(()=>u(t),o=>{i.value=o?n.width:0,a.value=o?n.height:0});function m(){p(),g()}return{width:i,height:a,stop:m}}const D={class:"relative"},I=["aria-label"],L={class:"w-full"},j={class:"mt-sm"},G=((t,n)=>{const l=t.__vccOpts||t;for(const[d,s]of n)l[d]=s;return l})(e.defineComponent({__name:"MclContainerB",props:{sectionBgColor:{default:"transparent"},containerBgColor:{default:"light-2"},imageSource:{},imageAlt:{},title:{},titleLevel:{default:"h2"},titleSize:{default:"md"},titleColor:{default:"dark-3"}},setup(t){const n=t,l=e.ref(),{height:d}=O(l),s=e.computed(()=>{const{titleLevel:i,titleSize:a,titleColor:p}=n,g={h1:c.generateClass.h1Variant({size:a}),h2:c.generateClass.h2Variant({size:a}),h3:c.generateClass.h3Variant({size:a}),h4:c.generateClass.h4Variant({size:a})};return[c.generateClass.textColorVariant({color:p}),g[i]].join(" ")}),r=e.computed(()=>({"--bg-image":`url('${n.imageSource}')`,"--space-height":`${d.value/2}px`}));return(i,a)=>(e.openBlock(),e.createElementBlock("section",{class:"relative",style:e.normalizeStyle(r.value)},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(c.generateClass).bgColorVariant({color:t.sectionBgColor}),"space-hts"])},null,2),e.createElementVNode("div",D,[e.createElementVNode("div",{class:"bg-image absolute inset-0 bg-cover bg-fixed bg-top bg-no-repeat",role:"img","aria-label":t.imageAlt},null,8,I),e.createElementVNode("div",{class:"relative z-10 container max-w-285 -translate-y-1/2 px-xs",ref_key:"mainContentElem",ref:l},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(c.generateClass).bgColorVariant({color:t.containerBgColor}),"px-xs py-md md:px-md md:py-lg lg:p-xl"])},[e.createElementVNode("div",L,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.titleLevel),null,{default:e.withCtx(()=>[e.createElementVNode("span",{class:e.normalizeClass(s.value)},e.toDisplayString(t.title),3)]),_:1})),e.createElementVNode("div",j,[e.renderSlot(i.$slots,"content",{},void 0,!0)])])],2)],512)])],4))}}),[["__scopeId","data-v-c077deeb"]]);f.MclContainerA=z,f.MclContainerB=G,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})}));
|
|
2
|
+
(function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@bobbykim/manguito-theme")):typeof define=="function"&&define.amd?define(["exports","vue","@bobbykim/manguito-theme"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f.MclContainer={},f.Vue,f.ManguitoTheme))})(this,(function(f,e,c){"use strict";const y={class:"relative min-h-9 md:min-h-12 lg:min-h-15"},B=["points"],V={class:"container grid gap-4 md:grid-cols-4"},E={class:"relative min-h-9 md:min-h-12 lg:min-h-15"},k=["points"],z=e.defineComponent({__name:"MclContainerA",props:{sectionBg:{default:"light-1"},containerBg:{default:"primary"},topDirection:{default:"left"},bottomDirection:{default:"left"},twoColumns:{type:Boolean,default:!0},leftColumnWidth:{default:50}},setup(t){const n=(s,r)=>s==="top"?r==="left"?"0,0 100,100 0,100":"100,0 100,100 0,100":r==="left"?"0,0 100,0 0,100":"0,0 100,0 100,100",l=(s,r)=>{if(!s)return"md:col-span-4";switch(r){case 25:return"md:col-span-1";case 50:return"md:col-span-2";case 75:return"md:col-span-3";case 100:return"md:col-span-4";default:return""}},d=(s,r)=>{if(!s)return"";switch(r){case 25:return"md:col-span-3";case 50:return"md:col-span-2";case 75:return"md:col-span-1";default:return""}};return(s,r)=>(e.openBlock(),e.createElementBlock("section",{class:e.normalizeClass(["py-lg lg:py-xl",e.unref(c.generateClass).bgColorVariant({color:t.sectionBg})])},[e.createElementVNode("div",y,[(e.openBlock(),e.createElementBlock("svg",{focusable:"false",class:e.normalizeClass(["absolute inset-x-0 left-0 block h-full w-full",e.unref(c.generateClass).svgFillColorVariant({color:t.containerBg})]),viewBox:"0 0 100 100",preserveAspectRatio:"none","aria-hidden":"true"},[e.createElementVNode("polygon",{points:n("top",t.topDirection)},null,8,B)],2))]),e.createElementVNode("div",{class:e.normalizeClass(["px-sm py-md md:px-md md:py-lg lg:px-lg lg:py-xl",e.unref(c.generateClass).bgColorVariant({color:t.containerBg})])},[e.createElementVNode("div",V,[e.createElementVNode("div",{class:e.normalizeClass(l(t.twoColumns,t.leftColumnWidth))},[e.renderSlot(s.$slots,"left-column")],2),t.twoColumns&&t.leftColumnWidth!==100?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(d(t.twoColumns,t.leftColumnWidth))},[e.renderSlot(s.$slots,"right-column")],2)):e.createCommentVNode("",!0)])],2),e.createElementVNode("div",E,[(e.openBlock(),e.createElementBlock("svg",{focusable:"false",class:e.normalizeClass(["absolute inset-x-0 left-0 block h-full w-full",e.unref(c.generateClass).svgFillColorVariant({color:t.containerBg})]),viewBox:"0 0 100 100",preserveAspectRatio:"none","aria-hidden":"true"},[e.createElementVNode("polygon",{points:n("bottom",t.bottomDirection)},null,8,k)],2))])],2))}});function S(t,n){return e.getCurrentScope()?(e.onScopeDispose(t,n),!0):!1}const N=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;function $(t){return Array.isArray(t)?t:[t]}function M(t){return e.getCurrentInstance()}function A(t,n=!0,l){M()?e.onMounted(t,l):n?t():e.nextTick(t)}const w=N?window:void 0;function u(t){var n;const l=e.toValue(t);return(n=l?.$el)!==null&&n!==void 0?n:l}function R(){const t=e.shallowRef(!1),n=e.getCurrentInstance();return n&&e.onMounted(()=>{t.value=!0},n),t}function W(t){const n=R();return e.computed(()=>(n.value,!!t()))}function _(t,n,l={}){const{window:d=w,...s}=l;let r;const i=W(()=>d&&"ResizeObserver"in d),a=()=>{r&&(r.disconnect(),r=void 0)},p=e.watch(e.computed(()=>{const m=e.toValue(t);return Array.isArray(m)?m.map(o=>u(o)):[u(m)]}),m=>{if(a(),i.value&&d){r=new ResizeObserver(n);for(const o of m)o&&r.observe(o,s)}},{immediate:!0,flush:"post"}),g=()=>{a(),p()};return S(g),{isSupported:i,stop:g}}function O(t,n={width:0,height:0},l={}){const{window:d=w,box:s="content-box"}=l,r=e.computed(()=>{var o;return(o=u(t))===null||o===void 0||(o=o.namespaceURI)===null||o===void 0?void 0:o.includes("svg")}),i=e.shallowRef(n.width),a=e.shallowRef(n.height),{stop:p}=_(t,([o])=>{const x=s==="border-box"?o.borderBoxSize:s==="content-box"?o.contentBoxSize:o.devicePixelContentBoxSize;if(d&&r.value){const C=u(t);if(C){const h=C.getBoundingClientRect();i.value=h.width,a.value=h.height}}else if(x){const C=$(x);i.value=C.reduce((h,{inlineSize:b})=>h+b,0),a.value=C.reduce((h,{blockSize:b})=>h+b,0)}else i.value=o.contentRect.width,a.value=o.contentRect.height},l);A(()=>{const o=u(t);o&&(i.value="offsetWidth"in o?o.offsetWidth:n.width,a.value="offsetHeight"in o?o.offsetHeight:n.height)});const g=e.watch(()=>u(t),o=>{i.value=o?n.width:0,a.value=o?n.height:0});function m(){p(),g()}return{width:i,height:a,stop:m}}const D={class:"relative"},I=["aria-label"],L={class:"w-full"},j={class:"mt-sm"},G=((t,n)=>{const l=t.__vccOpts||t;for(const[d,s]of n)l[d]=s;return l})(e.defineComponent({__name:"MclContainerB",props:{sectionBgColor:{default:"transparent"},containerBgColor:{default:"light-2"},imageSource:{},imageAlt:{},title:{},titleLevel:{default:"h2"},titleSize:{default:"md"},titleColor:{default:"dark-3"}},setup(t){const n=t,l=e.ref(),{height:d}=O(l),s=e.computed(()=>{const{titleLevel:i,titleSize:a,titleColor:p}=n,g={h1:c.generateClass.h1Variant({size:a}),h2:c.generateClass.h2Variant({size:a}),h3:c.generateClass.h3Variant({size:a}),h4:c.generateClass.h4Variant({size:a})};return[c.generateClass.textColorVariant({color:p}),g[i]].join(" ")}),r=e.computed(()=>({"--bg-image":`url('${n.imageSource}')`,"--space-height":`${d.value/2}px`}));return(i,a)=>(e.openBlock(),e.createElementBlock("section",{class:"relative",style:e.normalizeStyle(r.value)},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(c.generateClass).bgColorVariant({color:t.sectionBgColor}),"space-hts"])},null,2),e.createElementVNode("div",D,[e.createElementVNode("div",{class:"bg-image absolute inset-0 bg-cover bg-fixed bg-top bg-no-repeat",role:"img","aria-label":t.imageAlt},null,8,I),e.createElementVNode("div",{class:"relative z-10 container max-w-285 -translate-y-1/2 px-xs",ref_key:"mainContentElem",ref:l},[e.createElementVNode("div",{class:e.normalizeClass([e.unref(c.generateClass).bgColorVariant({color:t.containerBgColor}),"px-xs py-md md:px-md md:py-lg lg:p-xl"])},[e.createElementVNode("div",L,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.titleLevel),null,{default:e.withCtx(()=>[e.createElementVNode("span",{class:e.normalizeClass(s.value)},e.toDisplayString(t.title),3)]),_:1})),e.createElementVNode("div",j,[e.renderSlot(i.$slots,"content",{},void 0,!0)])])],2)],512)])],4))}}),[["__scopeId","data-v-c077deeb"]]);f.MclContainerA=z,f.MclContainerB=G,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bobbykim/mcl-container",
|
|
3
|
-
"version": "0.9.
|
|
3
|
+
"version": "0.9.7",
|
|
4
4
|
"description": "basic container components based on manguito-theme",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"files": [
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"dependencies": {
|
|
33
33
|
"@vueuse/core": "^12.0.0",
|
|
34
34
|
"vue": "^3.5.13",
|
|
35
|
-
"@bobbykim/manguito-theme": "1.
|
|
35
|
+
"@bobbykim/manguito-theme": "1.5.0"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
38
|
"@vitejs/plugin-vue": "^5.2.1",
|