@bobbykim/mcl-footer 0.5.0 → 0.6.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.
@@ -0,0 +1,159 @@
1
+ import { BodyText } from '@bobbykim/manguito-theme';
2
+ import { ColorPalette } from '@bobbykim/manguito-theme';
3
+ import { ComponentOptionsMixin } from 'vue';
4
+ import { CtaTarget } from '@bobbykim/manguito-theme';
5
+ import { DefineComponent } from 'vue';
6
+ import { ExtractPropTypes } from 'vue';
7
+ import { HeadingSize } from '@bobbykim/manguito-theme';
8
+ import { PropType } from 'vue';
9
+ import { PublicProps } from 'vue';
10
+
11
+ declare type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
12
+
13
+ declare type __VLS_Prettify<T> = {
14
+ [K in keyof T]: T[K];
15
+ } & {};
16
+
17
+ declare type __VLS_TypePropsToRuntimeProps<T> = {
18
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
19
+ type: PropType<__VLS_NonUndefinedable<T[K]>>;
20
+ } : {
21
+ type: PropType<T[K]>;
22
+ required: true;
23
+ };
24
+ };
25
+
26
+ declare type __VLS_WithDefaults<P, D> = {
27
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
28
+ default: D[K];
29
+ }> : P[K];
30
+ };
31
+
32
+ declare type __VLS_WithTemplateSlots<T, S> = T & {
33
+ new (): {
34
+ $slots: S;
35
+ };
36
+ };
37
+
38
+ export declare const MclFooterA: __VLS_WithTemplateSlots<DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
39
+ title: string;
40
+ titleSize?: HeadingSize | undefined;
41
+ titleColor?: ColorPalette | undefined;
42
+ copyText?: string | undefined;
43
+ logo: string;
44
+ logoAlt?: string | undefined;
45
+ logoAsLink?: boolean | undefined;
46
+ logoLink: string;
47
+ logoLinkTarget?: CtaTarget | undefined;
48
+ displaySocialIcons?: boolean | undefined;
49
+ socialIconColor: ColorPalette;
50
+ socialLinks?: SocialUrl | undefined;
51
+ menuItems: MenuItemType[];
52
+ secondaryMenuItems?: MenuItemType[] | undefined;
53
+ menuItemAsLink?: boolean | undefined;
54
+ menuTextSize?: BodyText | undefined;
55
+ menuTextColor?: ColorPalette | undefined;
56
+ menuTextBold?: boolean | undefined;
57
+ displayHighlight?: boolean | undefined;
58
+ highlightColor?: ColorPalette | undefined;
59
+ bgColor?: ColorPalette | undefined;
60
+ borderTopColor?: ColorPalette | undefined;
61
+ headlineColor?: ColorPalette | undefined;
62
+ }>, {
63
+ titleSize: string;
64
+ titleColor: string;
65
+ logoAsLink: boolean;
66
+ logoLinkTarget: string;
67
+ displaySocialIcons: boolean;
68
+ socialIconColor: string;
69
+ menuItemAsLink: boolean;
70
+ menuTextSize: string;
71
+ menuTextColor: string;
72
+ menuTextBold: boolean;
73
+ displayHighlight: boolean;
74
+ highlightColor: string;
75
+ bgColor: string;
76
+ borderTopColor: string;
77
+ headlineColor: string;
78
+ }>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
79
+ "logo-click": (event: Event, link: string, target: CtaTarget) => void;
80
+ "menu-click": (event: Event, item: MenuItemType) => void;
81
+ }, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
82
+ title: string;
83
+ titleSize?: HeadingSize | undefined;
84
+ titleColor?: ColorPalette | undefined;
85
+ copyText?: string | undefined;
86
+ logo: string;
87
+ logoAlt?: string | undefined;
88
+ logoAsLink?: boolean | undefined;
89
+ logoLink: string;
90
+ logoLinkTarget?: CtaTarget | undefined;
91
+ displaySocialIcons?: boolean | undefined;
92
+ socialIconColor: ColorPalette;
93
+ socialLinks?: SocialUrl | undefined;
94
+ menuItems: MenuItemType[];
95
+ secondaryMenuItems?: MenuItemType[] | undefined;
96
+ menuItemAsLink?: boolean | undefined;
97
+ menuTextSize?: BodyText | undefined;
98
+ menuTextColor?: ColorPalette | undefined;
99
+ menuTextBold?: boolean | undefined;
100
+ displayHighlight?: boolean | undefined;
101
+ highlightColor?: ColorPalette | undefined;
102
+ bgColor?: ColorPalette | undefined;
103
+ borderTopColor?: ColorPalette | undefined;
104
+ headlineColor?: ColorPalette | undefined;
105
+ }>, {
106
+ titleSize: string;
107
+ titleColor: string;
108
+ logoAsLink: boolean;
109
+ logoLinkTarget: string;
110
+ displaySocialIcons: boolean;
111
+ socialIconColor: string;
112
+ menuItemAsLink: boolean;
113
+ menuTextSize: string;
114
+ menuTextColor: string;
115
+ menuTextBold: boolean;
116
+ displayHighlight: boolean;
117
+ highlightColor: string;
118
+ bgColor: string;
119
+ borderTopColor: string;
120
+ headlineColor: string;
121
+ }>>> & {
122
+ "onLogo-click"?: ((event: Event, link: string, target: CtaTarget) => any) | undefined;
123
+ "onMenu-click"?: ((event: Event, item: MenuItemType) => any) | undefined;
124
+ }, {
125
+ titleSize: HeadingSize;
126
+ titleColor: ColorPalette;
127
+ logoAsLink: boolean;
128
+ logoLinkTarget: CtaTarget;
129
+ displaySocialIcons: boolean;
130
+ socialIconColor: ColorPalette;
131
+ menuItemAsLink: boolean;
132
+ menuTextSize: BodyText;
133
+ menuTextColor: ColorPalette;
134
+ menuTextBold: boolean;
135
+ displayHighlight: boolean;
136
+ highlightColor: ColorPalette;
137
+ bgColor: ColorPalette;
138
+ borderTopColor: ColorPalette;
139
+ headlineColor: ColorPalette;
140
+ }, {}>, Readonly<{
141
+ default: any;
142
+ }> & {
143
+ default: any;
144
+ }>;
145
+
146
+ export declare interface MenuItemType {
147
+ title: string;
148
+ url: string;
149
+ target?: CtaTarget;
150
+ }
151
+
152
+ export declare interface SocialUrl {
153
+ linkedin?: string;
154
+ instagram?: string;
155
+ github?: string;
156
+ twitter?: string;
157
+ }
158
+
159
+ export { }
@@ -0,0 +1,255 @@
1
+ (function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('.nav__decorator[data-v-962994fc]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-962994fc]:before,.nav__text:hover+.nav__decorator[data-v-962994fc]:before{width:100%}')),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
2
+ import { openBlock as l, createElementBlock as s, createElementVNode as o, defineComponent as T, ref as L, onMounted as $, Fragment as w, renderList as b, normalizeClass as d, createBlock as I, resolveDynamicComponent as M, markRaw as C, useSlots as B, unref as v, createVNode as z, createCommentVNode as k, toDisplayString as A, renderSlot as O } from "vue";
3
+ import r from "@bobbykim/manguito-theme";
4
+ const y = (i, c) => {
5
+ const u = i.__vccOpts || i;
6
+ for (const [_, p] of c)
7
+ u[_] = p;
8
+ return u;
9
+ }, H = {}, R = {
10
+ xmlns: "http://www.w3.org/2000/svg",
11
+ viewBox: "0 0 448 512",
12
+ fill: "currentColor",
13
+ class: "h-md w-md",
14
+ role: "img"
15
+ }, S = /* @__PURE__ */ o("path", { d: "M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM277.3 415.7c-8.4 1.5-11.5-3.7-11.5-8 0-5.4.2-33 .2-55.3 0-15.6-5.2-25.5-11.3-30.7 37-4.1 76-9.2 76-73.1 0-18.2-6.5-27.3-17.1-39 1.7-4.3 7.4-22-1.7-45-13.9-4.3-45.7 17.9-45.7 17.9-13.2-3.7-27.5-5.6-41.6-5.6-14.1 0-28.4 1.9-41.6 5.6 0 0-31.8-22.2-45.7-17.9-9.1 22.9-3.5 40.6-1.7 45-10.6 11.7-15.6 20.8-15.6 39 0 63.6 37.3 69 74.3 73.1-4.8 4.3-9.1 11.7-10.6 22.3-9.5 4.3-33.8 11.7-48.3-13.9-9.1-15.8-25.5-17.1-25.5-17.1-16.2-.2-1.1 10.2-1.1 10.2 10.8 5 18.4 24.2 18.4 24.2 9.7 29.7 56.1 19.7 56.1 19.7 0 13.9.2 36.5.2 40.6 0 4.3-3 9.5-11.5 8-66-22.1-112.2-84.9-112.2-158.3 0-91.8 70.2-161.5 162-161.5S388 165.6 388 257.4c.1 73.4-44.7 136.3-110.7 158.3zm-98.1-61.1c-1.9.4-3.7-.4-3.9-1.7-.2-1.5 1.1-2.8 3-3.2 1.9-.2 3.7.6 3.9 1.9.3 1.3-1 2.6-3 3zm-9.5-.9c0 1.3-1.5 2.4-3.5 2.4-2.2.2-3.7-.9-3.7-2.4 0-1.3 1.5-2.4 3.5-2.4 1.9-.2 3.7.9 3.7 2.4zm-13.7-1.1c-.4 1.3-2.4 1.9-4.1 1.3-1.9-.4-3.2-1.9-2.8-3.2.4-1.3 2.4-1.9 4.1-1.5 2 .6 3.3 2.1 2.8 3.4zm-12.3-5.4c-.9 1.1-2.8.9-4.3-.6-1.5-1.3-1.9-3.2-.9-4.1.9-1.1 2.8-.9 4.3.6 1.3 1.3 1.8 3.3.9 4.1zm-9.1-9.1c-.9.6-2.6 0-3.7-1.5s-1.1-3.2 0-3.9c1.1-.9 2.8-.2 3.7 1.3 1.1 1.5 1.1 3.3 0 4.1zm-6.5-9.7c-.9.9-2.4.4-3.5-.6-1.1-1.3-1.3-2.8-.4-3.5.9-.9 2.4-.4 3.5.6 1.1 1.3 1.3 2.8.4 3.5zm-6.7-7.4c-.4.9-1.7 1.1-2.8.4-1.3-.6-1.9-1.7-1.5-2.6.4-.6 1.5-.9 2.8-.4 1.3.7 1.9 1.8 1.5 2.6z" }, null, -1), V = [
16
+ S
17
+ ];
18
+ function j(i, c) {
19
+ return l(), s("svg", R, V);
20
+ }
21
+ const E = /* @__PURE__ */ y(H, [["render", j]]), D = {}, F = {
22
+ xmlns: "http://www.w3.org/2000/svg",
23
+ viewBox: "0 0 448 512",
24
+ fill: "currentColor",
25
+ class: "h-md w-md",
26
+ role: "img"
27
+ }, G = /* @__PURE__ */ o("path", { d: "M224,202.66A53.34,53.34,0,1,0,277.36,256,53.38,53.38,0,0,0,224,202.66Zm124.71-41a54,54,0,0,0-30.41-30.41c-21-8.29-71-6.43-94.3-6.43s-73.25-1.93-94.31,6.43a54,54,0,0,0-30.41,30.41c-8.28,21-6.43,71.05-6.43,94.33S91,329.26,99.32,350.33a54,54,0,0,0,30.41,30.41c21,8.29,71,6.43,94.31,6.43s73.24,1.93,94.3-6.43a54,54,0,0,0,30.41-30.41c8.35-21,6.43-71.05,6.43-94.33S357.1,182.74,348.75,161.67ZM224,338a82,82,0,1,1,82-82A81.9,81.9,0,0,1,224,338Zm85.38-148.3a19.14,19.14,0,1,1,19.13-19.14A19.1,19.1,0,0,1,309.42,189.74ZM400,32H48A48,48,0,0,0,0,80V432a48,48,0,0,0,48,48H400a48,48,0,0,0,48-48V80A48,48,0,0,0,400,32ZM382.88,322c-1.29,25.63-7.14,48.34-25.85,67s-41.4,24.63-67,25.85c-26.41,1.49-105.59,1.49-132,0-25.63-1.29-48.26-7.15-67-25.85s-24.63-41.42-25.85-67c-1.49-26.42-1.49-105.61,0-132,1.29-25.63,7.07-48.34,25.85-67s41.47-24.56,67-25.78c26.41-1.49,105.59-1.49,132,0,25.63,1.29,48.33,7.15,67,25.85s24.63,41.42,25.85,67.05C384.37,216.44,384.37,295.56,382.88,322Z" }, null, -1), Z = [
28
+ G
29
+ ];
30
+ function N(i, c) {
31
+ return l(), s("svg", F, Z);
32
+ }
33
+ const X = /* @__PURE__ */ y(D, [["render", N]]), Y = {}, q = {
34
+ xmlns: "http://www.w3.org/2000/svg",
35
+ viewBox: "0 0 448 512",
36
+ fill: "currentColor",
37
+ class: "h-md w-md",
38
+ role: "img"
39
+ }, J = /* @__PURE__ */ o("path", { d: "M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z" }, null, -1), K = [
40
+ J
41
+ ];
42
+ function P(i, c) {
43
+ return l(), s("svg", q, K);
44
+ }
45
+ const Q = /* @__PURE__ */ y(Y, [["render", P]]), U = {}, W = {
46
+ xmlns: "http://www.w3.org/2000/svg",
47
+ viewBox: "0 0 448 512",
48
+ fill: "currentColor",
49
+ class: "h-md w-md",
50
+ role: "img"
51
+ }, ee = /* @__PURE__ */ o("path", { d: "M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-48.9 158.8c.2 2.8.2 5.7.2 8.5 0 86.7-66 186.6-186.6 186.6-37.2 0-71.7-10.8-100.7-29.4 5.3.6 10.4.8 15.8.8 30.7 0 58.9-10.4 81.4-28-28.8-.6-53-19.5-61.3-45.5 10.1 1.5 19.2 1.5 29.6-1.2-30-6.1-52.5-32.5-52.5-64.4v-.8c8.7 4.9 18.9 7.9 29.6 8.3a65.447 65.447 0 0 1-29.2-54.6c0-12.2 3.2-23.4 8.9-33.1 32.3 39.8 80.8 65.8 135.2 68.6-9.3-44.5 24-80.6 64-80.6 18.9 0 35.9 7.9 47.9 20.7 14.8-2.8 29-8.3 41.6-15.8-4.9 15.2-15.2 28-28.8 36.1 13.2-1.4 26-5.1 37.8-10.2-8.9 13.1-20.1 24.7-32.9 34z" }, null, -1), te = [
52
+ ee
53
+ ];
54
+ function oe(i, c) {
55
+ return l(), s("svg", W, te);
56
+ }
57
+ const le = /* @__PURE__ */ y(U, [["render", oe]]), se = { class: "flex flex-wrap" }, ne = ["href", "aria-label"], re = /* @__PURE__ */ T({
58
+ __name: "SocialIcons",
59
+ props: {
60
+ iconColor: { default: "light-1" },
61
+ socialLinks: {}
62
+ },
63
+ setup(i) {
64
+ const c = i, u = L([]), _ = () => {
65
+ const { linkedin: a, instagram: g, github: m, twitter: h } = c.socialLinks, e = [];
66
+ a && e.push({
67
+ url: a,
68
+ icon: C(Q),
69
+ label: "linkedin social icon"
70
+ }), m && e.push({
71
+ url: m,
72
+ icon: C(E),
73
+ label: "github social icon"
74
+ }), g && e.push({
75
+ url: g,
76
+ icon: C(X),
77
+ label: "instagram social icon"
78
+ }), h && e.push({
79
+ url: h,
80
+ icon: C(le),
81
+ label: "twitter social icon"
82
+ }), u.value = e;
83
+ }, p = (a) => [
84
+ r("TEXTCOLOR", a),
85
+ r("RINGCOLOR", a)
86
+ ].join(" ");
87
+ return $(() => {
88
+ _();
89
+ }), (a, g) => (l(), s("ul", se, [
90
+ (l(!0), s(w, null, b(u.value, (m, h) => (l(), s("li", {
91
+ key: h,
92
+ class: "mr-xs last:mr-0"
93
+ }, [
94
+ o("a", {
95
+ href: m.url,
96
+ target: "_blank",
97
+ class: d(["inline-block outline-none focus:ring-2 hover:ring-2 hover:opacity-70 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear", p(a.iconColor)]),
98
+ "aria-label": m.label
99
+ }, [
100
+ (l(), I(M(m.icon)))
101
+ ], 10, ne)
102
+ ]))), 128))
103
+ ]));
104
+ }
105
+ }), ie = { class: "container px-xs md:px-lg lg:px-xl" }, ce = { class: "h-lg md:h-xl align-middle mb-xs" }, ae = ["href", "target"], de = ["src", "alt"], ue = {
106
+ key: 0,
107
+ class: "mb-xs flex items-center justify-end md:justify-center"
108
+ }, me = { class: "flex flex-wrap md:justify-between items-center md:items-start gap-6 md:gap-8" }, fe = { class: "grid gap-2 justify-items-center basis-full md:basis-1/3" }, ge = ["innerHTML"], he = {
109
+ key: 0,
110
+ class: "text-xs text-white align-middle mb-2"
111
+ }, _e = { class: "px-xs md:px-0" }, pe = { class: "text-sm flex flex-col md:flex-row items-center sm:items-start sm:flex-row text-center sm:text-left gap-xs justify-between md:justify-around grow md:basis-1/2" }, ke = { class: "flex flex-wrap md:flex-col justify-center items-center gap-2xs" }, ye = ["href", "target", "onClick", "innerHTML"], Ce = {
112
+ key: 0,
113
+ class: "flex flex-wrap md:flex-col justify-center items-center gap-2xs"
114
+ }, ve = ["href", "target", "onClick", "innerHTML"], xe = /* @__PURE__ */ T({
115
+ __name: "MclFooterA",
116
+ props: {
117
+ title: {},
118
+ titleSize: { default: "md" },
119
+ titleColor: { default: "light-1" },
120
+ copyText: {},
121
+ logo: {},
122
+ logoAlt: {},
123
+ logoAsLink: { type: Boolean, default: !0 },
124
+ logoLink: {},
125
+ logoLinkTarget: { default: "_self" },
126
+ displaySocialIcons: { type: Boolean, default: !0 },
127
+ socialIconColor: { default: "light-1" },
128
+ socialLinks: {},
129
+ menuItems: {},
130
+ secondaryMenuItems: {},
131
+ menuItemAsLink: { type: Boolean, default: !0 },
132
+ menuTextSize: { default: "md" },
133
+ menuTextColor: { default: "light-1" },
134
+ menuTextBold: { type: Boolean, default: !1 },
135
+ displayHighlight: { type: Boolean, default: !0 },
136
+ highlightColor: { default: "primary" },
137
+ bgColor: { default: "dark-3" },
138
+ borderTopColor: { default: "primary" },
139
+ headlineColor: { default: "light-1" }
140
+ },
141
+ emits: ["logo-click", "menu-click"],
142
+ setup(i, { emit: c }) {
143
+ const u = i;
144
+ B();
145
+ const _ = c, p = (e, n) => [
146
+ r("BGCOLOR", e),
147
+ r("BORDER", n)
148
+ ].join(" "), a = (e, n) => [
149
+ r("H2", e),
150
+ r("TEXTCOLOR", n)
151
+ ].join(" "), g = (e, n, t) => {
152
+ const f = [
153
+ r("BODYTEXT", e),
154
+ r("TEXTCOLOR", n)
155
+ ];
156
+ return t && f.push("font-bold"), f.join(" ");
157
+ }, m = (e) => {
158
+ const { logoAsLink: n, logoLink: t, logoLinkTarget: f } = u;
159
+ !n && e.preventDefault(), _("logo-click", e, t, f);
160
+ }, h = (e, n) => {
161
+ const { menuItemAsLink: t } = u;
162
+ !t && e.preventDefault(), _("menu-click", e, n);
163
+ };
164
+ return (e, n) => (l(), s("footer", {
165
+ class: d(["border-t-2 py-6 sm:py-8 md:py-12", p(e.bgColor, e.borderTopColor)])
166
+ }, [
167
+ o("div", ie, [
168
+ o("div", {
169
+ class: d(["flex flex-col md:flex-row flex-wrap justify-between mb-xs md:mb-md px-xs md:px-md border-b-2", v(r)("BORDER", e.headlineColor)])
170
+ }, [
171
+ o("div", ce, [
172
+ o("a", {
173
+ href: e.logoLink,
174
+ target: e.logoLinkTarget,
175
+ class: d(["h-full inline-block outline-none focus:ring-2 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear", v(r)("RINGCOLOR", e.titleColor)]),
176
+ onClick: n[0] || (n[0] = (t) => m(t))
177
+ }, [
178
+ o("img", {
179
+ class: "inline-block h-full",
180
+ src: e.logo,
181
+ alt: e.logoAlt
182
+ }, null, 8, de)
183
+ ], 10, ae)
184
+ ]),
185
+ e.displaySocialIcons ? (l(), s("div", ue, [
186
+ z(re, {
187
+ "social-links": e.socialLinks,
188
+ "icon-color": e.socialIconColor
189
+ }, null, 8, ["social-links", "icon-color"])
190
+ ])) : k("", !0)
191
+ ], 2),
192
+ o("div", me, [
193
+ o("div", fe, [
194
+ o("h2", {
195
+ class: d(["inline-block align-middle tracking-wider", a(e.titleSize, e.titleColor)]),
196
+ innerHTML: e.title
197
+ }, null, 10, ge),
198
+ e.copyText ? (l(), s("small", he, " © " + A(e.copyText + " " + (/* @__PURE__ */ new Date()).getFullYear()), 1)) : k("", !0),
199
+ o("div", _e, [
200
+ O(e.$slots, "default", {}, void 0, !0)
201
+ ])
202
+ ]),
203
+ o("nav", pe, [
204
+ o("ul", ke, [
205
+ (l(!0), s(w, null, b(e.menuItems, (t, f) => (l(), s("li", {
206
+ key: `first-nav-${f}`,
207
+ class: "inline-block"
208
+ }, [
209
+ o("a", {
210
+ href: t.url,
211
+ target: t.target ? t.target : "_self",
212
+ class: d([
213
+ "tracking-wide outline-none nav__text",
214
+ g(e.menuTextSize, e.menuTextColor, e.menuTextBold)
215
+ ]),
216
+ onClick: (x) => h(x, t),
217
+ innerHTML: t.title
218
+ }, null, 10, ye),
219
+ e.displayHighlight ? (l(), s("div", {
220
+ key: 0,
221
+ class: d(["relative top-3xs h-3xs nav__decorator", v(r)("BEFOREBG", e.highlightColor)])
222
+ }, null, 2)) : k("", !0)
223
+ ]))), 128))
224
+ ]),
225
+ e.secondaryMenuItems ? (l(), s("ul", Ce, [
226
+ (l(!0), s(w, null, b(e.secondaryMenuItems, (t, f) => (l(), s("li", {
227
+ key: `second-nav-${f}`,
228
+ class: "inline-block"
229
+ }, [
230
+ o("a", {
231
+ href: t.url,
232
+ target: t.target ? t.target : "_self",
233
+ class: d([
234
+ "tracking-wide outline-none nav__text",
235
+ g(e.menuTextSize, e.menuTextColor, e.menuTextBold)
236
+ ]),
237
+ onClick: (x) => h(x, t),
238
+ innerHTML: t.title
239
+ }, null, 10, ve),
240
+ e.displayHighlight ? (l(), s("div", {
241
+ key: 0,
242
+ class: d(["relative top-3xs h-3xs nav__decorator", v(r)("BEFOREBG", e.highlightColor)])
243
+ }, null, 2)) : k("", !0)
244
+ ]))), 128))
245
+ ])) : k("", !0)
246
+ ])
247
+ ])
248
+ ])
249
+ ], 2));
250
+ }
251
+ });
252
+ const Te = /* @__PURE__ */ y(xe, [["__scopeId", "data-v-962994fc"]]);
253
+ export {
254
+ Te as MclFooterA
255
+ };
@@ -0,0 +1,2 @@
1
+ (function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('.nav__decorator[data-v-962994fc]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-962994fc]:before,.nav__text:hover+.nav__decorator[data-v-962994fc]:before{width:100%}')),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
2
+ (function(i,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):(i=typeof globalThis<"u"?globalThis:i||self,e(i.MclFooter={},i.Vue,i.ManguitoTheme))})(this,function(i,e,l){"use strict";const g=(s,r)=>{const a=s.__vccOpts||s;for(const[p,_]of r)a[p]=_;return a},u={},y={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",fill:"currentColor",class:"h-md w-md",role:"img"},B=[e.createElementVNode("path",{d:"M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM277.3 415.7c-8.4 1.5-11.5-3.7-11.5-8 0-5.4.2-33 .2-55.3 0-15.6-5.2-25.5-11.3-30.7 37-4.1 76-9.2 76-73.1 0-18.2-6.5-27.3-17.1-39 1.7-4.3 7.4-22-1.7-45-13.9-4.3-45.7 17.9-45.7 17.9-13.2-3.7-27.5-5.6-41.6-5.6-14.1 0-28.4 1.9-41.6 5.6 0 0-31.8-22.2-45.7-17.9-9.1 22.9-3.5 40.6-1.7 45-10.6 11.7-15.6 20.8-15.6 39 0 63.6 37.3 69 74.3 73.1-4.8 4.3-9.1 11.7-10.6 22.3-9.5 4.3-33.8 11.7-48.3-13.9-9.1-15.8-25.5-17.1-25.5-17.1-16.2-.2-1.1 10.2-1.1 10.2 10.8 5 18.4 24.2 18.4 24.2 9.7 29.7 56.1 19.7 56.1 19.7 0 13.9.2 36.5.2 40.6 0 4.3-3 9.5-11.5 8-66-22.1-112.2-84.9-112.2-158.3 0-91.8 70.2-161.5 162-161.5S388 165.6 388 257.4c.1 73.4-44.7 136.3-110.7 158.3zm-98.1-61.1c-1.9.4-3.7-.4-3.9-1.7-.2-1.5 1.1-2.8 3-3.2 1.9-.2 3.7.6 3.9 1.9.3 1.3-1 2.6-3 3zm-9.5-.9c0 1.3-1.5 2.4-3.5 2.4-2.2.2-3.7-.9-3.7-2.4 0-1.3 1.5-2.4 3.5-2.4 1.9-.2 3.7.9 3.7 2.4zm-13.7-1.1c-.4 1.3-2.4 1.9-4.1 1.3-1.9-.4-3.2-1.9-2.8-3.2.4-1.3 2.4-1.9 4.1-1.5 2 .6 3.3 2.1 2.8 3.4zm-12.3-5.4c-.9 1.1-2.8.9-4.3-.6-1.5-1.3-1.9-3.2-.9-4.1.9-1.1 2.8-.9 4.3.6 1.3 1.3 1.8 3.3.9 4.1zm-9.1-9.1c-.9.6-2.6 0-3.7-1.5s-1.1-3.2 0-3.9c1.1-.9 2.8-.2 3.7 1.3 1.1 1.5 1.1 3.3 0 4.1zm-6.5-9.7c-.9.9-2.4.4-3.5-.6-1.1-1.3-1.3-2.8-.4-3.5.9-.9 2.4-.4 3.5.6 1.1 1.3 1.3 2.8.4 3.5zm-6.7-7.4c-.4.9-1.7 1.1-2.8.4-1.3-.6-1.9-1.7-1.5-2.6.4-.6 1.5-.9 2.8-.4 1.3.7 1.9 1.8 1.5 2.6z"},null,-1)];function C(s,r){return e.openBlock(),e.createElementBlock("svg",y,B)}const x=g(u,[["render",C]]),w={},E={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",fill:"currentColor",class:"h-md w-md",role:"img"},b=[e.createElementVNode("path",{d:"M224,202.66A53.34,53.34,0,1,0,277.36,256,53.38,53.38,0,0,0,224,202.66Zm124.71-41a54,54,0,0,0-30.41-30.41c-21-8.29-71-6.43-94.3-6.43s-73.25-1.93-94.31,6.43a54,54,0,0,0-30.41,30.41c-8.28,21-6.43,71.05-6.43,94.33S91,329.26,99.32,350.33a54,54,0,0,0,30.41,30.41c21,8.29,71,6.43,94.31,6.43s73.24,1.93,94.3-6.43a54,54,0,0,0,30.41-30.41c8.35-21,6.43-71.05,6.43-94.33S357.1,182.74,348.75,161.67ZM224,338a82,82,0,1,1,82-82A81.9,81.9,0,0,1,224,338Zm85.38-148.3a19.14,19.14,0,1,1,19.13-19.14A19.1,19.1,0,0,1,309.42,189.74ZM400,32H48A48,48,0,0,0,0,80V432a48,48,0,0,0,48,48H400a48,48,0,0,0,48-48V80A48,48,0,0,0,400,32ZM382.88,322c-1.29,25.63-7.14,48.34-25.85,67s-41.4,24.63-67,25.85c-26.41,1.49-105.59,1.49-132,0-25.63-1.29-48.26-7.15-67-25.85s-24.63-41.42-25.85-67c-1.49-26.42-1.49-105.61,0-132,1.29-25.63,7.07-48.34,25.85-67s41.47-24.56,67-25.78c26.41-1.49,105.59-1.49,132,0,25.63,1.29,48.33,7.15,67,25.85s24.63,41.42,25.85,67.05C384.37,216.44,384.37,295.56,382.88,322Z"},null,-1)];function T(s,r){return e.openBlock(),e.createElementBlock("svg",E,b)}const V=g(w,[["render",T]]),L={},z={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",fill:"currentColor",class:"h-md w-md",role:"img"},$=[e.createElementVNode("path",{d:"M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"},null,-1)];function M(s,r){return e.openBlock(),e.createElementBlock("svg",z,$)}const N=g(L,[["render",M]]),I={},A={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",fill:"currentColor",class:"h-md w-md",role:"img"},O=[e.createElementVNode("path",{d:"M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-48.9 158.8c.2 2.8.2 5.7.2 8.5 0 86.7-66 186.6-186.6 186.6-37.2 0-71.7-10.8-100.7-29.4 5.3.6 10.4.8 15.8.8 30.7 0 58.9-10.4 81.4-28-28.8-.6-53-19.5-61.3-45.5 10.1 1.5 19.2 1.5 29.6-1.2-30-6.1-52.5-32.5-52.5-64.4v-.8c8.7 4.9 18.9 7.9 29.6 8.3a65.447 65.447 0 0 1-29.2-54.6c0-12.2 3.2-23.4 8.9-33.1 32.3 39.8 80.8 65.8 135.2 68.6-9.3-44.5 24-80.6 64-80.6 18.9 0 35.9 7.9 47.9 20.7 14.8-2.8 29-8.3 41.6-15.8-4.9 15.2-15.2 28-28.8 36.1 13.2-1.4 26-5.1 37.8-10.2-8.9 13.1-20.1 24.7-32.9 34z"},null,-1)];function R(s,r){return e.openBlock(),e.createElementBlock("svg",A,O)}const H=g(I,[["render",R]]),S={class:"flex flex-wrap"},j=["href","aria-label"],F=e.defineComponent({__name:"SocialIcons",props:{iconColor:{default:"light-1"},socialLinks:{}},setup(s){const r=s,a=e.ref([]),p=()=>{const{linkedin:c,instagram:f,github:d,twitter:h}=r.socialLinks,o=[];c&&o.push({url:c,icon:e.markRaw(N),label:"linkedin social icon"}),d&&o.push({url:d,icon:e.markRaw(x),label:"github social icon"}),f&&o.push({url:f,icon:e.markRaw(V),label:"instagram social icon"}),h&&o.push({url:h,icon:e.markRaw(H),label:"twitter social icon"}),a.value=o},_=c=>[l("TEXTCOLOR",c),l("RINGCOLOR",c)].join(" ");return e.onMounted(()=>{p()}),(c,f)=>(e.openBlock(),e.createElementBlock("ul",S,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.value,(d,h)=>(e.openBlock(),e.createElementBlock("li",{key:h,class:"mr-xs last:mr-0"},[e.createElementVNode("a",{href:d.url,target:"_blank",class:e.normalizeClass(["inline-block outline-none focus:ring-2 hover:ring-2 hover:opacity-70 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear",_(c.iconColor)]),"aria-label":d.label},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(d.icon)))],10,j)]))),128))]))}}),D={class:"container px-xs md:px-lg lg:px-xl"},G={class:"h-lg md:h-xl align-middle mb-xs"},Z=["href","target"],X=["src","alt"],q={key:0,class:"mb-xs flex items-center justify-end md:justify-center"},Y={class:"flex flex-wrap md:justify-between items-center md:items-start gap-6 md:gap-8"},P={class:"grid gap-2 justify-items-center basis-full md:basis-1/3"},J=["innerHTML"],K={key:0,class:"text-xs text-white align-middle mb-2"},Q={class:"px-xs md:px-0"},U={class:"text-sm flex flex-col md:flex-row items-center sm:items-start sm:flex-row text-center sm:text-left gap-xs justify-between md:justify-around grow md:basis-1/2"},W={class:"flex flex-wrap md:flex-col justify-center items-center gap-2xs"},v=["href","target","onClick","innerHTML"],ee={key:0,class:"flex flex-wrap md:flex-col justify-center items-center gap-2xs"},oe=["href","target","onClick","innerHTML"],te=e.defineComponent({__name:"MclFooterA",props:{title:{},titleSize:{default:"md"},titleColor:{default:"light-1"},copyText:{},logo:{},logoAlt:{},logoAsLink:{type:Boolean,default:!0},logoLink:{},logoLinkTarget:{default:"_self"},displaySocialIcons:{type:Boolean,default:!0},socialIconColor:{default:"light-1"},socialLinks:{},menuItems:{},secondaryMenuItems:{},menuItemAsLink:{type:Boolean,default:!0},menuTextSize:{default:"md"},menuTextColor:{default:"light-1"},menuTextBold:{type:Boolean,default:!1},displayHighlight:{type:Boolean,default:!0},highlightColor:{default:"primary"},bgColor:{default:"dark-3"},borderTopColor:{default:"primary"},headlineColor:{default:"light-1"}},emits:["logo-click","menu-click"],setup(s,{emit:r}){const a=s;e.useSlots();const p=r,_=(o,n)=>[l("BGCOLOR",o),l("BORDER",n)].join(" "),c=(o,n)=>[l("H2",o),l("TEXTCOLOR",n)].join(" "),f=(o,n,t)=>{const m=[l("BODYTEXT",o),l("TEXTCOLOR",n)];return t&&m.push("font-bold"),m.join(" ")},d=o=>{const{logoAsLink:n,logoLink:t,logoLinkTarget:m}=a;!n&&o.preventDefault(),p("logo-click",o,t,m)},h=(o,n)=>{const{menuItemAsLink:t}=a;!t&&o.preventDefault(),p("menu-click",o,n)};return(o,n)=>(e.openBlock(),e.createElementBlock("footer",{class:e.normalizeClass(["border-t-2 py-6 sm:py-8 md:py-12",_(o.bgColor,o.borderTopColor)])},[e.createElementVNode("div",D,[e.createElementVNode("div",{class:e.normalizeClass(["flex flex-col md:flex-row flex-wrap justify-between mb-xs md:mb-md px-xs md:px-md border-b-2",e.unref(l)("BORDER",o.headlineColor)])},[e.createElementVNode("div",G,[e.createElementVNode("a",{href:o.logoLink,target:o.logoLinkTarget,class:e.normalizeClass(["h-full inline-block outline-none focus:ring-2 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear",e.unref(l)("RINGCOLOR",o.titleColor)]),onClick:n[0]||(n[0]=t=>d(t))},[e.createElementVNode("img",{class:"inline-block h-full",src:o.logo,alt:o.logoAlt},null,8,X)],10,Z)]),o.displaySocialIcons?(e.openBlock(),e.createElementBlock("div",q,[e.createVNode(F,{"social-links":o.socialLinks,"icon-color":o.socialIconColor},null,8,["social-links","icon-color"])])):e.createCommentVNode("",!0)],2),e.createElementVNode("div",Y,[e.createElementVNode("div",P,[e.createElementVNode("h2",{class:e.normalizeClass(["inline-block align-middle tracking-wider",c(o.titleSize,o.titleColor)]),innerHTML:o.title},null,10,J),o.copyText?(e.openBlock(),e.createElementBlock("small",K," © "+e.toDisplayString(o.copyText+" "+new Date().getFullYear()),1)):e.createCommentVNode("",!0),e.createElementVNode("div",Q,[e.renderSlot(o.$slots,"default",{},void 0,!0)])]),e.createElementVNode("nav",U,[e.createElementVNode("ul",W,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.menuItems,(t,m)=>(e.openBlock(),e.createElementBlock("li",{key:`first-nav-${m}`,class:"inline-block"},[e.createElementVNode("a",{href:t.url,target:t.target?t.target:"_self",class:e.normalizeClass(["tracking-wide outline-none nav__text",f(o.menuTextSize,o.menuTextColor,o.menuTextBold)]),onClick:k=>h(k,t),innerHTML:t.title},null,10,v),o.displayHighlight?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["relative top-3xs h-3xs nav__decorator",e.unref(l)("BEFOREBG",o.highlightColor)])},null,2)):e.createCommentVNode("",!0)]))),128))]),o.secondaryMenuItems?(e.openBlock(),e.createElementBlock("ul",ee,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.secondaryMenuItems,(t,m)=>(e.openBlock(),e.createElementBlock("li",{key:`second-nav-${m}`,class:"inline-block"},[e.createElementVNode("a",{href:t.url,target:t.target?t.target:"_self",class:e.normalizeClass(["tracking-wide outline-none nav__text",f(o.menuTextSize,o.menuTextColor,o.menuTextBold)]),onClick:k=>h(k,t),innerHTML:t.title},null,10,oe),o.displayHighlight?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["relative top-3xs h-3xs nav__decorator",e.unref(l)("BEFOREBG",o.highlightColor)])},null,2)):e.createCommentVNode("",!0)]))),128))])):e.createCommentVNode("",!0)])])])],2))}}),ie="",le=g(te,[["__scopeId","data-v-962994fc"]]);i.MclFooterA=le,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});
package/package.json CHANGED
@@ -1,11 +1,23 @@
1
1
  {
2
2
  "name": "@bobbykim/mcl-footer",
3
- "version": "0.5.0",
4
- "description": "",
3
+ "version": "0.6.0",
4
+ "description": "a footer components built based on Manguito theme",
5
5
  "type": "module",
6
- "main": "index.ts",
6
+ "files": [
7
+ "dist"
8
+ ],
9
+ "main": "./dist/mcl-footer.umd.cjs",
10
+ "module": "./dist/mcl-footer.js",
11
+ "types": "./dist/index.d.ts",
12
+ "exports": {
13
+ ".": {
14
+ "import": "./dist/mcl-footer.js",
15
+ "require": "./dist/mcl-footer.umd.cjs",
16
+ "types": "./dist/index.d.ts"
17
+ }
18
+ },
7
19
  "scripts": {
8
- "build": "vue-tsc --project tsconfig.vue.json && tsc --project tsconfig.ts.json"
20
+ "build": "vite build"
9
21
  },
10
22
  "author": {
11
23
  "name": "Bobby Kim",
@@ -21,7 +33,17 @@
21
33
  },
22
34
  "license": "MIT",
23
35
  "dependencies": {
24
- "@bobbykim/manguito-theme": "^0.17.0"
36
+ "@bobbykim/manguito-theme": "0.19.0",
37
+ "vue": "^3.3.10"
38
+ },
39
+ "devDependencies": {
40
+ "@vitejs/plugin-vue": "^4.5.2",
41
+ "sass": "^1.69.5",
42
+ "typescript": "^5.3.3",
43
+ "vite": "^4.5.1",
44
+ "vite-plugin-css-injected-by-js": "^3.5.0",
45
+ "vite-plugin-dts": "^3.8.3",
46
+ "vue-tsc": "^1.8.25"
25
47
  },
26
- "gitHead": "f4be01699f747aba1f831a1f796f8e41e6fcd676"
48
+ "gitHead": "b66ad8b5fabf32c0814726f0847ce86399b4115b"
27
49
  }
package/CHANGELOG.md DELETED
@@ -1,51 +0,0 @@
1
- # Change Log
2
-
3
- All notable changes to this project will be documented in this file.
4
- See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
-
6
- # [0.5.0](https://github.com/bobbykim89/manguito-component-library/compare/@bobbykim/mcl-footer@0.3.0...@bobbykim/mcl-footer@0.5.0) (2024-03-24)
7
-
8
-
9
- ### Features
10
-
11
- * build and release ([a372086](https://github.com/bobbykim89/manguito-component-library/commit/a3720861fb40dd6ec1d0e3dda1f06e2479967432))
12
- * **components/*:** prepublish build ([c8eb95a](https://github.com/bobbykim89/manguito-component-library/commit/c8eb95a0ede6727bf183d2e9ad634ae64af1411d))
13
- * **mcl-header:** move deprecated items to deprecated folder in root dir, update configs, init mcl-header-b component ([19aa842](https://github.com/bobbykim89/manguito-component-library/commit/19aa842faa7f1594f7be030b97d5093014efe7cb))
14
- * tsconfig update, slots and emits update ([c30ff80](https://github.com/bobbykim89/manguito-component-library/commit/c30ff804c961d205ac097e20cd51285a15ca8966))
15
-
16
-
17
-
18
-
19
-
20
- # [0.4.0](https://github.com/bobbykim89/manguito-component-library/compare/@bobbykim/mcl-footer@0.3.0...@bobbykim/mcl-footer@0.4.0) (2024-03-21)
21
-
22
-
23
- ### Features
24
-
25
- * **mcl-header:** move deprecated items to deprecated folder in root dir, update configs, init mcl-header-b component ([19aa842](https://github.com/bobbykim89/manguito-component-library/commit/19aa842faa7f1594f7be030b97d5093014efe7cb))
26
- * tsconfig update, slots and emits update ([c30ff80](https://github.com/bobbykim89/manguito-component-library/commit/c30ff804c961d205ac097e20cd51285a15ca8966))
27
-
28
-
29
-
30
-
31
-
32
- # [0.3.0](https://github.com/bobbykim89/manguito-component-library/compare/@bobbykim/mcl-footer@0.2.0...@bobbykim/mcl-footer@0.3.0) (2024-02-27)
33
-
34
-
35
- ### Features
36
-
37
- * **/components/**/README.md,/deprecated:** update readme files, move deprecated packages to deprecated folder ([c0f8f7d](https://github.com/bobbykim89/manguito-component-library/commit/c0f8f7df158b8fcd99b4e3d191e02e3c8a9c144d))
38
-
39
-
40
-
41
-
42
-
43
- # 0.2.0 (2024-02-27)
44
-
45
-
46
- ### Features
47
-
48
- * **manguito-theme,mcl-cards,mcl-header,mcl-footer,mcl-carousel:** add vueuse as one of dependencies, update code to make them ssr friendly ([119a327](https://github.com/bobbykim89/manguito-component-library/commit/119a327adf1ca9866e6ac063bce5acd4790db612))
49
- * **mcl-footer:** finialize adding controllers for mcl-footer-a component, add mdx doc page ([de3bee0](https://github.com/bobbykim89/manguito-component-library/commit/de3bee0cb0376e50eaa761b6815b9dd83f61b8ec))
50
- * **mcl-footer:** init mcl-footer-a ([8b9fc27](https://github.com/bobbykim89/manguito-component-library/commit/8b9fc27c19f644459e659c84a413f01aeda3faca))
51
- * **stories/*:** ran package:build to build type declaration, move deprecated story files into deprecated folder ([ffc487d](https://github.com/bobbykim89/manguito-component-library/commit/ffc487dbcc093be7a3ccfeae98c5e10e8372a0e3))
package/index.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import MclFooterA from './lib/mcl-footer-a/MclFooterA.vue';
2
- export * from './lib/mcl-footer-a/index.types';
3
- export { MclFooterA };
package/index.js DELETED
@@ -1,3 +0,0 @@
1
- import MclFooterA from './lib/mcl-footer-a/MclFooterA.vue';
2
- export * from './lib/mcl-footer-a/index.types';
3
- export { MclFooterA };
package/index.ts DELETED
@@ -1,4 +0,0 @@
1
- import MclFooterA from './lib/mcl-footer-a/MclFooterA.vue'
2
- export * from './lib/mcl-footer-a/index.types'
3
-
4
- export { MclFooterA }
@@ -1,14 +0,0 @@
1
- <template>
2
- <svg
3
- xmlns="http://www.w3.org/2000/svg"
4
- viewBox="0 0 448 512"
5
- fill="currentColor"
6
- class="h-md w-md"
7
- role="img"
8
- >
9
- <!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. -->
10
- <path
11
- d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM277.3 415.7c-8.4 1.5-11.5-3.7-11.5-8 0-5.4.2-33 .2-55.3 0-15.6-5.2-25.5-11.3-30.7 37-4.1 76-9.2 76-73.1 0-18.2-6.5-27.3-17.1-39 1.7-4.3 7.4-22-1.7-45-13.9-4.3-45.7 17.9-45.7 17.9-13.2-3.7-27.5-5.6-41.6-5.6-14.1 0-28.4 1.9-41.6 5.6 0 0-31.8-22.2-45.7-17.9-9.1 22.9-3.5 40.6-1.7 45-10.6 11.7-15.6 20.8-15.6 39 0 63.6 37.3 69 74.3 73.1-4.8 4.3-9.1 11.7-10.6 22.3-9.5 4.3-33.8 11.7-48.3-13.9-9.1-15.8-25.5-17.1-25.5-17.1-16.2-.2-1.1 10.2-1.1 10.2 10.8 5 18.4 24.2 18.4 24.2 9.7 29.7 56.1 19.7 56.1 19.7 0 13.9.2 36.5.2 40.6 0 4.3-3 9.5-11.5 8-66-22.1-112.2-84.9-112.2-158.3 0-91.8 70.2-161.5 162-161.5S388 165.6 388 257.4c.1 73.4-44.7 136.3-110.7 158.3zm-98.1-61.1c-1.9.4-3.7-.4-3.9-1.7-.2-1.5 1.1-2.8 3-3.2 1.9-.2 3.7.6 3.9 1.9.3 1.3-1 2.6-3 3zm-9.5-.9c0 1.3-1.5 2.4-3.5 2.4-2.2.2-3.7-.9-3.7-2.4 0-1.3 1.5-2.4 3.5-2.4 1.9-.2 3.7.9 3.7 2.4zm-13.7-1.1c-.4 1.3-2.4 1.9-4.1 1.3-1.9-.4-3.2-1.9-2.8-3.2.4-1.3 2.4-1.9 4.1-1.5 2 .6 3.3 2.1 2.8 3.4zm-12.3-5.4c-.9 1.1-2.8.9-4.3-.6-1.5-1.3-1.9-3.2-.9-4.1.9-1.1 2.8-.9 4.3.6 1.3 1.3 1.8 3.3.9 4.1zm-9.1-9.1c-.9.6-2.6 0-3.7-1.5s-1.1-3.2 0-3.9c1.1-.9 2.8-.2 3.7 1.3 1.1 1.5 1.1 3.3 0 4.1zm-6.5-9.7c-.9.9-2.4.4-3.5-.6-1.1-1.3-1.3-2.8-.4-3.5.9-.9 2.4-.4 3.5.6 1.1 1.3 1.3 2.8.4 3.5zm-6.7-7.4c-.4.9-1.7 1.1-2.8.4-1.3-.6-1.9-1.7-1.5-2.6.4-.6 1.5-.9 2.8-.4 1.3.7 1.9 1.8 1.5 2.6z"
12
- />
13
- </svg>
14
- </template>
@@ -1,2 +0,0 @@
1
- declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
2
- export default _default;
@@ -1,14 +0,0 @@
1
- <template>
2
- <svg
3
- xmlns="http://www.w3.org/2000/svg"
4
- viewBox="0 0 448 512"
5
- fill="currentColor"
6
- class="h-md w-md"
7
- role="img"
8
- >
9
- <!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. -->
10
- <path
11
- d="M224,202.66A53.34,53.34,0,1,0,277.36,256,53.38,53.38,0,0,0,224,202.66Zm124.71-41a54,54,0,0,0-30.41-30.41c-21-8.29-71-6.43-94.3-6.43s-73.25-1.93-94.31,6.43a54,54,0,0,0-30.41,30.41c-8.28,21-6.43,71.05-6.43,94.33S91,329.26,99.32,350.33a54,54,0,0,0,30.41,30.41c21,8.29,71,6.43,94.31,6.43s73.24,1.93,94.3-6.43a54,54,0,0,0,30.41-30.41c8.35-21,6.43-71.05,6.43-94.33S357.1,182.74,348.75,161.67ZM224,338a82,82,0,1,1,82-82A81.9,81.9,0,0,1,224,338Zm85.38-148.3a19.14,19.14,0,1,1,19.13-19.14A19.1,19.1,0,0,1,309.42,189.74ZM400,32H48A48,48,0,0,0,0,80V432a48,48,0,0,0,48,48H400a48,48,0,0,0,48-48V80A48,48,0,0,0,400,32ZM382.88,322c-1.29,25.63-7.14,48.34-25.85,67s-41.4,24.63-67,25.85c-26.41,1.49-105.59,1.49-132,0-25.63-1.29-48.26-7.15-67-25.85s-24.63-41.42-25.85-67c-1.49-26.42-1.49-105.61,0-132,1.29-25.63,7.07-48.34,25.85-67s41.47-24.56,67-25.78c26.41-1.49,105.59-1.49,132,0,25.63,1.29,48.33,7.15,67,25.85s24.63,41.42,25.85,67.05C384.37,216.44,384.37,295.56,382.88,322Z"
12
- />
13
- </svg>
14
- </template>
@@ -1,2 +0,0 @@
1
- declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
2
- export default _default;
@@ -1,14 +0,0 @@
1
- <template>
2
- <svg
3
- xmlns="http://www.w3.org/2000/svg"
4
- viewBox="0 0 448 512"
5
- fill="currentColor"
6
- class="h-md w-md"
7
- role="img"
8
- >
9
- <!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. -->
10
- <path
11
- d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"
12
- />
13
- </svg>
14
- </template>
@@ -1,2 +0,0 @@
1
- declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
2
- export default _default;
@@ -1,14 +0,0 @@
1
- <template>
2
- <svg
3
- xmlns="http://www.w3.org/2000/svg"
4
- viewBox="0 0 448 512"
5
- fill="currentColor"
6
- class="h-md w-md"
7
- role="img"
8
- >
9
- <!--! Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. -->
10
- <path
11
- d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-48.9 158.8c.2 2.8.2 5.7.2 8.5 0 86.7-66 186.6-186.6 186.6-37.2 0-71.7-10.8-100.7-29.4 5.3.6 10.4.8 15.8.8 30.7 0 58.9-10.4 81.4-28-28.8-.6-53-19.5-61.3-45.5 10.1 1.5 19.2 1.5 29.6-1.2-30-6.1-52.5-32.5-52.5-64.4v-.8c8.7 4.9 18.9 7.9 29.6 8.3a65.447 65.447 0 0 1-29.2-54.6c0-12.2 3.2-23.4 8.9-33.1 32.3 39.8 80.8 65.8 135.2 68.6-9.3-44.5 24-80.6 64-80.6 18.9 0 35.9 7.9 47.9 20.7 14.8-2.8 29-8.3 41.6-15.8-4.9 15.2-15.2 28-28.8 36.1 13.2-1.4 26-5.1 37.8-10.2-8.9 13.1-20.1 24.7-32.9 34z"
12
- />
13
- </svg>
14
- </template>
@@ -1,2 +0,0 @@
1
- declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
2
- export default _default;
@@ -1,250 +0,0 @@
1
- <script setup lang="ts">
2
- import type {
3
- BodyText,
4
- ColorPalette,
5
- CtaTarget,
6
- HeadingSize,
7
- } from '@bobbykim/manguito-theme'
8
- import generateClass from '@bobbykim/manguito-theme'
9
- import SocialIcons from './SocialIcons.vue'
10
- import type { MenuItemType, SocialUrl } from './index.types'
11
-
12
- const props = withDefaults(
13
- defineProps<{
14
- title: string
15
- titleSize?: HeadingSize
16
- titleColor?: ColorPalette
17
- copyText?: string
18
- logo: string
19
- logoAlt?: string
20
- logoAsLink?: boolean
21
- logoLink: string
22
- logoLinkTarget?: CtaTarget
23
- displaySocialIcons?: boolean
24
- socialIconColor: ColorPalette
25
- socialLinks?: SocialUrl
26
- menuItems: MenuItemType[]
27
- secondaryMenuItems?: MenuItemType[]
28
- menuItemAsLink?: boolean
29
- menuTextSize?: BodyText
30
- menuTextColor?: ColorPalette
31
- menuTextBold?: boolean
32
- displayHighlight?: boolean
33
- highlightColor?: ColorPalette
34
- bgColor?: ColorPalette
35
- borderTopColor?: ColorPalette
36
- headlineColor?: ColorPalette
37
- }>(),
38
- {
39
- titleSize: 'md',
40
- titleColor: 'light-1',
41
- logoAsLink: true,
42
- logoLinkTarget: '_self',
43
- displaySocialIcons: true,
44
- socialIconColor: 'light-1',
45
- menuItemAsLink: true,
46
- menuTextSize: 'md',
47
- menuTextColor: 'light-1',
48
- menuTextBold: false,
49
- displayHighlight: true,
50
- highlightColor: 'primary',
51
- bgColor: 'dark-3',
52
- borderTopColor: 'primary',
53
- headlineColor: 'light-1',
54
- }
55
- )
56
-
57
- const slots = defineSlots<{
58
- default: any
59
- }>()
60
- const emit = defineEmits<{
61
- (e: 'logo-click', event: Event, link: string, target: CtaTarget): void
62
- (e: 'menu-click', event: Event, item: MenuItemType): void
63
- }>()
64
-
65
- const getFooterClass = (bg: ColorPalette, border: ColorPalette): string => {
66
- /**
67
- * @bg - bgColor
68
- * @border - borderTopColor
69
- */
70
-
71
- const classArray: string[] = [
72
- generateClass('BGCOLOR', bg),
73
- generateClass('BORDER', border),
74
- ]
75
- return classArray.join(' ')
76
- }
77
- const getTitleClass = (size: HeadingSize, color: ColorPalette): string => {
78
- /**
79
- * @size - titleSize
80
- * @color - titleColor
81
- */
82
- const classArray: string[] = [
83
- generateClass('H2', size),
84
- generateClass('TEXTCOLOR', color),
85
- ]
86
- return classArray.join(' ')
87
- }
88
- const getMenuItemClass = (
89
- size: BodyText,
90
- color: ColorPalette,
91
- bold: boolean
92
- ): string => {
93
- /**
94
- * @size - menuTextSize
95
- * @color - menuTextColor
96
- * @bold - menuTextBold
97
- */
98
- const classArray: string[] = [
99
- generateClass('BODYTEXT', size),
100
- generateClass('TEXTCOLOR', color),
101
- ]
102
- if (bold) {
103
- classArray.push('font-bold')
104
- }
105
- return classArray.join(' ')
106
- }
107
-
108
- const handleTitleClick = (e: Event) => {
109
- const { logoAsLink, logoLink, logoLinkTarget } = props
110
- !logoAsLink && e.preventDefault()
111
- emit('logo-click', e, logoLink, logoLinkTarget)
112
- }
113
-
114
- const handleMenuItemClick = (e: Event, item: MenuItemType) => {
115
- const { menuItemAsLink } = props
116
- !menuItemAsLink && e.preventDefault()
117
- emit('menu-click', e, item)
118
- }
119
- </script>
120
-
121
- <template>
122
- <footer
123
- class="border-t-2 py-6 sm:py-8 md:py-12"
124
- :class="getFooterClass(bgColor, borderTopColor)"
125
- >
126
- <div class="container px-xs md:px-lg lg:px-xl">
127
- <div
128
- class="flex flex-col md:flex-row flex-wrap justify-between mb-xs md:mb-md px-xs md:px-md border-b-2"
129
- :class="generateClass('BORDER', headlineColor)"
130
- >
131
- <div class="h-lg md:h-xl align-middle mb-xs">
132
- <a
133
- :href="logoLink"
134
- :target="logoLinkTarget"
135
- class="h-full inline-block outline-none focus:ring-2 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear"
136
- :class="generateClass('RINGCOLOR', titleColor)"
137
- @click="handleTitleClick($event)"
138
- >
139
- <img class="inline-block h-full" :src="logo" :alt="logoAlt" />
140
- </a>
141
- </div>
142
- <div
143
- v-if="displaySocialIcons"
144
- class="mb-xs flex items-center justify-end md:justify-center"
145
- >
146
- <!-- social icons -->
147
- <social-icons
148
- :social-links="socialLinks"
149
- :icon-color="socialIconColor"
150
- ></social-icons>
151
- </div>
152
- </div>
153
- <div
154
- class="flex flex-wrap md:justify-between items-center md:items-start gap-6 md:gap-8"
155
- >
156
- <div class="grid gap-2 justify-items-center basis-full md:basis-1/3">
157
- <h2
158
- class="inline-block align-middle tracking-wider"
159
- :class="getTitleClass(titleSize, titleColor)"
160
- v-html="title"
161
- ></h2>
162
- <small v-if="copyText" class="text-xs text-white align-middle mb-2">
163
- &copy; {{ copyText + ' ' + new Date().getFullYear() }}
164
- </small>
165
- <div class="px-xs md:px-0">
166
- <slot></slot>
167
- </div>
168
- </div>
169
- <nav
170
- class="text-sm flex flex-col md:flex-row items-center sm:items-start sm:flex-row text-center sm:text-left gap-xs justify-between md:justify-around grow md:basis-1/2"
171
- >
172
- <ul
173
- class="flex flex-wrap md:flex-col justify-center items-center gap-2xs"
174
- >
175
- <li
176
- v-for="(item, i) in menuItems"
177
- :key="`first-nav-${i}`"
178
- class="inline-block"
179
- >
180
- <a
181
- :href="item.url"
182
- :target="item.target ? item.target : '_self'"
183
- class="tracking-wide outline-none nav__text"
184
- :class="
185
- getMenuItemClass(menuTextSize, menuTextColor, menuTextBold)
186
- "
187
- @click="handleMenuItemClick($event, item)"
188
- v-html="item.title"
189
- >
190
- </a>
191
- <div
192
- v-if="displayHighlight"
193
- class="relative top-3xs h-3xs nav__decorator"
194
- :class="generateClass('BEFOREBG', highlightColor)"
195
- ></div>
196
- </li>
197
- </ul>
198
-
199
- <!-- secondary menu -->
200
- <ul
201
- v-if="secondaryMenuItems"
202
- class="flex flex-wrap md:flex-col justify-center items-center gap-2xs"
203
- >
204
- <li
205
- v-for="(item, i) in secondaryMenuItems"
206
- :key="`second-nav-${i}`"
207
- class="inline-block"
208
- >
209
- <a
210
- :href="item.url"
211
- :target="item.target ? item.target : '_self'"
212
- class="tracking-wide outline-none nav__text"
213
- :class="
214
- getMenuItemClass(menuTextSize, menuTextColor, menuTextBold)
215
- "
216
- @click="handleMenuItemClick($event, item)"
217
- v-html="item.title"
218
- >
219
- </a>
220
- <div
221
- v-if="displayHighlight"
222
- class="relative top-3xs h-3xs nav__decorator"
223
- :class="generateClass('BEFOREBG', highlightColor)"
224
- ></div>
225
- </li>
226
- </ul>
227
- </nav>
228
- </div>
229
- </div>
230
- </footer>
231
- </template>
232
-
233
- <style lang="scss" scoped>
234
- .nav__decorator {
235
- &::before {
236
- content: '';
237
- position: absolute;
238
- bottom: 0;
239
- left: 0;
240
- height: 100%;
241
- width: 0;
242
- transition: width 0.3s linear;
243
- }
244
- }
245
-
246
- .nav__text:focus + .nav__decorator::before,
247
- .nav__text:hover + .nav__decorator::before {
248
- width: 100%;
249
- }
250
- </style>
@@ -1,132 +0,0 @@
1
- import type { BodyText, ColorPalette, CtaTarget, HeadingSize } from '@bobbykim/manguito-theme';
2
- import type { MenuItemType, SocialUrl } from './index.types';
3
- declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
4
- title: string;
5
- titleSize?: HeadingSize | undefined;
6
- titleColor?: ColorPalette | undefined;
7
- copyText?: string | undefined;
8
- logo: string;
9
- logoAlt?: string | undefined;
10
- logoAsLink?: boolean | undefined;
11
- logoLink: string;
12
- logoLinkTarget?: CtaTarget | undefined;
13
- displaySocialIcons?: boolean | undefined;
14
- socialIconColor: ColorPalette;
15
- socialLinks?: SocialUrl | undefined;
16
- menuItems: MenuItemType[];
17
- secondaryMenuItems?: MenuItemType[] | undefined;
18
- menuItemAsLink?: boolean | undefined;
19
- menuTextSize?: BodyText | undefined;
20
- menuTextColor?: ColorPalette | undefined;
21
- menuTextBold?: boolean | undefined;
22
- displayHighlight?: boolean | undefined;
23
- highlightColor?: ColorPalette | undefined;
24
- bgColor?: ColorPalette | undefined;
25
- borderTopColor?: ColorPalette | undefined;
26
- headlineColor?: ColorPalette | undefined;
27
- }>, {
28
- titleSize: string;
29
- titleColor: string;
30
- logoAsLink: boolean;
31
- logoLinkTarget: string;
32
- displaySocialIcons: boolean;
33
- socialIconColor: string;
34
- menuItemAsLink: boolean;
35
- menuTextSize: string;
36
- menuTextColor: string;
37
- menuTextBold: boolean;
38
- displayHighlight: boolean;
39
- highlightColor: string;
40
- bgColor: string;
41
- borderTopColor: string;
42
- headlineColor: string;
43
- }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
44
- "logo-click": (event: Event, link: string, target: CtaTarget) => void;
45
- "menu-click": (event: Event, item: MenuItemType) => void;
46
- }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
47
- title: string;
48
- titleSize?: HeadingSize | undefined;
49
- titleColor?: ColorPalette | undefined;
50
- copyText?: string | undefined;
51
- logo: string;
52
- logoAlt?: string | undefined;
53
- logoAsLink?: boolean | undefined;
54
- logoLink: string;
55
- logoLinkTarget?: CtaTarget | undefined;
56
- displaySocialIcons?: boolean | undefined;
57
- socialIconColor: ColorPalette;
58
- socialLinks?: SocialUrl | undefined;
59
- menuItems: MenuItemType[];
60
- secondaryMenuItems?: MenuItemType[] | undefined;
61
- menuItemAsLink?: boolean | undefined;
62
- menuTextSize?: BodyText | undefined;
63
- menuTextColor?: ColorPalette | undefined;
64
- menuTextBold?: boolean | undefined;
65
- displayHighlight?: boolean | undefined;
66
- highlightColor?: ColorPalette | undefined;
67
- bgColor?: ColorPalette | undefined;
68
- borderTopColor?: ColorPalette | undefined;
69
- headlineColor?: ColorPalette | undefined;
70
- }>, {
71
- titleSize: string;
72
- titleColor: string;
73
- logoAsLink: boolean;
74
- logoLinkTarget: string;
75
- displaySocialIcons: boolean;
76
- socialIconColor: string;
77
- menuItemAsLink: boolean;
78
- menuTextSize: string;
79
- menuTextColor: string;
80
- menuTextBold: boolean;
81
- displayHighlight: boolean;
82
- highlightColor: string;
83
- bgColor: string;
84
- borderTopColor: string;
85
- headlineColor: string;
86
- }>>> & {
87
- "onLogo-click"?: ((event: Event, link: string, target: CtaTarget) => any) | undefined;
88
- "onMenu-click"?: ((event: Event, item: MenuItemType) => any) | undefined;
89
- }, {
90
- bgColor: ColorPalette;
91
- titleColor: ColorPalette;
92
- titleSize: HeadingSize;
93
- logoAsLink: boolean;
94
- logoLinkTarget: CtaTarget;
95
- displaySocialIcons: boolean;
96
- socialIconColor: ColorPalette;
97
- menuItemAsLink: boolean;
98
- menuTextSize: BodyText;
99
- menuTextColor: ColorPalette;
100
- menuTextBold: boolean;
101
- displayHighlight: boolean;
102
- highlightColor: ColorPalette;
103
- borderTopColor: ColorPalette;
104
- headlineColor: ColorPalette;
105
- }, {}>, Readonly<{
106
- default: any;
107
- }> & {
108
- default: any;
109
- }>;
110
- export default _default;
111
- type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
112
- type __VLS_TypePropsToRuntimeProps<T> = {
113
- [K in keyof T]-?: {} extends Pick<T, K> ? {
114
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
115
- } : {
116
- type: import('vue').PropType<T[K]>;
117
- required: true;
118
- };
119
- };
120
- type __VLS_WithDefaults<P, D> = {
121
- [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
122
- default: D[K];
123
- }> : P[K];
124
- };
125
- type __VLS_Prettify<T> = {
126
- [K in keyof T]: T[K];
127
- } & {};
128
- type __VLS_WithTemplateSlots<T, S> = T & {
129
- new (): {
130
- $slots: S;
131
- };
132
- };
@@ -1,100 +0,0 @@
1
- <script setup lang="ts">
2
- import { ref, markRaw, onMounted, computed } from 'vue'
3
- import type { ColorPalette } from '@bobbykim/manguito-theme'
4
- import generateClass from '@bobbykim/manguito-theme'
5
- import type { SocialUrl } from './index.types'
6
- // Import Icon files
7
- import GithubIcon from '../common//icons/GithubIcon.vue'
8
- import InstagramIcon from '../common/icons/InstagramIcon.vue'
9
- import LinkedinIcon from '../common/icons/LinkedinIcon.vue'
10
- import TwitterIcon from '../common/icons/TwitterIcon.vue'
11
-
12
- const props = withDefaults(
13
- defineProps<{
14
- iconColor: ColorPalette
15
- socialLinks?: SocialUrl
16
- }>(),
17
- {
18
- iconColor: 'light-1',
19
- }
20
- )
21
-
22
- interface IconList {
23
- url: string
24
- icon: any
25
- label: string
26
- }
27
- const iconsRef = ref<any>([])
28
-
29
- const handleIconsList = (): void => {
30
- const { linkedin, instagram, github, twitter } = props.socialLinks!
31
-
32
- const iconsList: IconList[] = []
33
- if (linkedin) {
34
- iconsList.push({
35
- url: linkedin,
36
- icon: markRaw(LinkedinIcon),
37
- label: 'linkedin social icon',
38
- })
39
- }
40
- if (github) {
41
- iconsList.push({
42
- url: github,
43
- icon: markRaw(GithubIcon),
44
- label: 'github social icon',
45
- })
46
- }
47
- if (instagram) {
48
- iconsList.push({
49
- url: instagram,
50
- icon: markRaw(InstagramIcon),
51
- label: 'instagram social icon',
52
- })
53
- }
54
- if (twitter) {
55
- iconsList.push({
56
- url: twitter,
57
- icon: markRaw(TwitterIcon),
58
- label: 'twitter social icon',
59
- })
60
- }
61
- iconsRef.value = iconsList
62
- }
63
-
64
- const getIconList = computed(() => {
65
- return iconsRef.value
66
- })
67
-
68
- const getIconColor = (color: ColorPalette): string => {
69
- /**
70
- * @color - iconColor
71
- */
72
- const classArray: string[] = [
73
- generateClass('TEXTCOLOR', color),
74
- generateClass('RINGCOLOR', color),
75
- ]
76
- return classArray.join(' ')
77
- }
78
-
79
- onMounted(() => {
80
- handleIconsList()
81
- })
82
- </script>
83
-
84
- <template>
85
- <ul class="flex flex-wrap">
86
- <li v-for="(item, index) in iconsRef" :key="index" class="mr-xs last:mr-0">
87
- <a
88
- :href="item.url"
89
- target="_blank"
90
- class="inline-block outline-none focus:ring-2 hover:ring-2 hover:opacity-70 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear"
91
- :class="getIconColor(iconColor)"
92
- :aria-label="item.label"
93
- >
94
- <component :is="item.icon"></component>
95
- </a>
96
- </li>
97
- </ul>
98
- </template>
99
-
100
- <style lang="scss" scoped></style>
@@ -1,33 +0,0 @@
1
- import type { ColorPalette } from '@bobbykim/manguito-theme';
2
- import type { SocialUrl } from './index.types';
3
- declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
4
- iconColor: ColorPalette;
5
- socialLinks?: SocialUrl | undefined;
6
- }>, {
7
- iconColor: string;
8
- }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
9
- iconColor: ColorPalette;
10
- socialLinks?: SocialUrl | undefined;
11
- }>, {
12
- iconColor: string;
13
- }>>>, {
14
- iconColor: ColorPalette;
15
- }, {}>;
16
- export default _default;
17
- type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
18
- type __VLS_TypePropsToRuntimeProps<T> = {
19
- [K in keyof T]-?: {} extends Pick<T, K> ? {
20
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
21
- } : {
22
- type: import('vue').PropType<T[K]>;
23
- required: true;
24
- };
25
- };
26
- type __VLS_WithDefaults<P, D> = {
27
- [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
28
- default: D[K];
29
- }> : P[K];
30
- };
31
- type __VLS_Prettify<T> = {
32
- [K in keyof T]: T[K];
33
- } & {};
@@ -1,12 +0,0 @@
1
- import type { CtaTarget } from '@bobbykim/manguito-theme';
2
- export interface MenuItemType {
3
- title: string;
4
- url: string;
5
- target?: CtaTarget;
6
- }
7
- export interface SocialUrl {
8
- linkedin?: string;
9
- instagram?: string;
10
- github?: string;
11
- twitter?: string;
12
- }
@@ -1 +0,0 @@
1
- export {};
@@ -1,14 +0,0 @@
1
- import type { CtaTarget } from '@bobbykim/manguito-theme'
2
-
3
- export interface MenuItemType {
4
- title: string
5
- url: string
6
- target?: CtaTarget
7
- }
8
-
9
- export interface SocialUrl {
10
- linkedin?: string
11
- instagram?: string
12
- github?: string
13
- twitter?: string
14
- }
package/tsconfig.json DELETED
@@ -1,5 +0,0 @@
1
- {
2
- "extends": "../../../tsconfig.json",
3
- "include": ["./**/*.ts", "./**/*.vue"],
4
- "exclude": ["node_modules", "./**/*.vue.d.ts"]
5
- }
package/tsconfig.ts.json DELETED
@@ -1,9 +0,0 @@
1
- {
2
- "extends": "../../../tsconfig.json",
3
- "include": ["./**/*.ts"],
4
- "exclude": ["node_modules", "./**/*.vue.d.ts", "./**/*.vue"],
5
- "compilerOptions": {
6
- "skipLibCheck": true,
7
- "declaration": true
8
- }
9
- }
package/tsconfig.vue.json DELETED
@@ -1,9 +0,0 @@
1
- {
2
- "extends": "../../../tsconfig.json",
3
- "include": ["./**/*.vue"],
4
- "exclude": ["node_modules"],
5
- "compilerOptions": {
6
- "declaration": true,
7
- "emitDeclarationOnly": true
8
- }
9
- }