@commandcenterio/convert-ui 0.0.10 → 0.0.11

Sign up to get free protection for your applications and to get access to all the features.
package/dist/index.d.mts CHANGED
@@ -122,8 +122,10 @@ interface FooterProps {
122
122
  maxLogoHeight?: string;
123
123
  leftElement?: JSX.Element;
124
124
  openingHours?: OpeningHourType;
125
+ waterMark?: boolean;
126
+ className?: string;
125
127
  }
126
- declare const Footer: ({ links, logo, logoText, newsletter, socialLinks, maxLogoHeight, leftElement, openingHours, }: FooterProps) => react_jsx_runtime.JSX.Element;
128
+ declare const Footer: ({ links, logo, logoText, newsletter, socialLinks, maxLogoHeight, leftElement, openingHours, waterMark, className, }: FooterProps) => react_jsx_runtime.JSX.Element;
127
129
 
128
130
  interface HeroProps {
129
131
  styleType: string | 'Bento' | 'Traditional' | 'Image';
package/dist/index.d.ts CHANGED
@@ -122,8 +122,10 @@ interface FooterProps {
122
122
  maxLogoHeight?: string;
123
123
  leftElement?: JSX.Element;
124
124
  openingHours?: OpeningHourType;
125
+ waterMark?: boolean;
126
+ className?: string;
125
127
  }
126
- declare const Footer: ({ links, logo, logoText, newsletter, socialLinks, maxLogoHeight, leftElement, openingHours, }: FooterProps) => react_jsx_runtime.JSX.Element;
128
+ declare const Footer: ({ links, logo, logoText, newsletter, socialLinks, maxLogoHeight, leftElement, openingHours, waterMark, className, }: FooterProps) => react_jsx_runtime.JSX.Element;
127
129
 
128
130
  interface HeroProps {
129
131
  styleType: string | 'Bento' | 'Traditional' | 'Image';
package/dist/index.js CHANGED
@@ -412,61 +412,83 @@ var Footer = function({
412
412
  socialLinks,
413
413
  maxLogoHeight,
414
414
  leftElement,
415
- openingHours
415
+ openingHours,
416
+ waterMark = true,
417
+ className = "p-10 text-base-content bg-base-200"
416
418
  }) {
417
- const logoHeight = maxLogoHeight ? maxLogoHeight : "50px";
418
- const logoHeightStyle = {
419
- "--footer-logo-height": logoHeight
420
- };
421
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full w-full @container", children: /* @__PURE__ */ jsxRuntime.jsxs("footer", { className: "footer flex w-full flex-col items-center justify-center gap-10 bg-base-200 p-10 text-base-content @xl:flex-row @xl:items-start", children: [
422
- leftElement ? /* @__PURE__ */ jsxRuntime.jsx("aside", { className: "flex flex-col items-center justify-center gap-4 mt-auto px-8 border-b-[1px] pb-4 border-base-100 md:border-r-[1px] md:border-b-0 md:pb-0 md:mt-0", children: leftElement }) : /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "flex flex-col items-center justify-center gap-4 mt-auto px-8 border-b-[1px] pb-4 border-base-100 md:border-r-[1px] md:border-b-0 md:pb-0 md:mt-0", children: [
423
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: logoHeightStyle, children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo || "", alt: "Company Logo", className: "h-[var(--footer-logo-height)]" }) }),
424
- /* @__PURE__ */ jsxRuntime.jsx("p", { children: logoText })
425
- ] }),
426
- links == null ? void 0 : links.map((item, index2) => {
427
- return /* @__PURE__ */ jsxRuntime.jsxs("nav", { children: [
428
- /* @__PURE__ */ jsxRuntime.jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: item.header }),
429
- item.links.map((link, index3) => {
419
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full w-full @container", children: /* @__PURE__ */ jsxRuntime.jsxs("footer", { className: `flex w-full flex-col items-center justify-center ${className}`, children: [
420
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `footer flex w-full flex-col items-center justify-start gap-10 @xl:flex-row @xl:items-start max-w-3xl`, children: [
421
+ leftElement ? /* @__PURE__ */ jsxRuntime.jsx("aside", { className: "flex flex-col items-center justify-center gap-4 mt-auto px-8 border-b-[1px] pb-4 border-base-100 md:border-r-[1px] md:border-b-0 md:pb-0 md:mt-0", children: leftElement }) : /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "gap-4 border-b-[1px] border-base-100 md:border-r-[1px] md:border-b-0 max-w-[25vw] pr-0 pb-10 md:pb-0 md:pr-10", children: [
422
+ logo && /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo, alt: "Company Logo", className: "w-sm" }),
423
+ /* @__PURE__ */ jsxRuntime.jsx("p", { children: logoText })
424
+ ] }),
425
+ links == null ? void 0 : links.map((item, index2) => {
426
+ return /* @__PURE__ */ jsxRuntime.jsxs("nav", { children: [
427
+ /* @__PURE__ */ jsxRuntime.jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: item.header }),
428
+ item.links.map((link, index3) => {
429
+ return /* @__PURE__ */ jsxRuntime.jsx(
430
+ "a",
431
+ {
432
+ className: "link-hover link mx-auto @xl:mx-0",
433
+ href: link.url,
434
+ children: link.text
435
+ },
436
+ index3
437
+ );
438
+ })
439
+ ] }, index2);
440
+ }),
441
+ socialLinks && /* @__PURE__ */ jsxRuntime.jsxs("nav", { children: [
442
+ /* @__PURE__ */ jsxRuntime.jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: "Social" }),
443
+ socialLinks == null ? void 0 : socialLinks.map((link, index2) => {
430
444
  return /* @__PURE__ */ jsxRuntime.jsx(
431
445
  "a",
432
446
  {
433
- className: "link-hover link mx-auto @xl:mx-0",
434
447
  href: link.url,
435
- children: link.text
448
+ className: "link-hover link mx-auto @xl:mx-0",
449
+ children: /* @__PURE__ */ jsxRuntime.jsx(link.icon, { className: "text-base-content", size: 30 })
436
450
  },
437
- index3
451
+ index2
438
452
  );
439
453
  })
440
- ] }, index2);
441
- }),
442
- socialLinks && /* @__PURE__ */ jsxRuntime.jsxs("nav", { children: [
443
- /* @__PURE__ */ jsxRuntime.jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: "Social" }),
444
- socialLinks == null ? void 0 : socialLinks.map((link, index2) => {
445
- return /* @__PURE__ */ jsxRuntime.jsx(
446
- "a",
447
- {
448
- href: link.url,
449
- className: "link-hover link mx-auto @xl:mx-0",
450
- children: /* @__PURE__ */ jsxRuntime.jsx(link.icon, { className: "text-base-content", size: 30 })
451
- },
452
- index2
453
- );
454
- })
454
+ ] }),
455
+ openingHours && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 w-fit", children: [
456
+ /* @__PURE__ */ jsxRuntime.jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: openingHours.header }),
457
+ openingHours.hours.map(({ day, openingTime }, index2, arr) => {
458
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center w-[200px] justify-between", children: [
459
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: "inline-block w-fit", children: day }),
460
+ /* @__PURE__ */ jsxRuntime.jsx(
461
+ "p",
462
+ {
463
+ className: `inline-block w-fit ${openingTime === "Closed" && "font-semibold"}`,
464
+ children: openingTime
465
+ }
466
+ )
467
+ ] }, index2);
468
+ })
469
+ ] })
455
470
  ] }),
456
- openingHours && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 w-fit", children: [
457
- /* @__PURE__ */ jsxRuntime.jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: openingHours.header }),
458
- openingHours.hours.map(({ day, openingTime }, index2, arr) => {
459
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center w-[200px] justify-between", children: [
460
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: "inline-block w-fit", children: day }),
461
- /* @__PURE__ */ jsxRuntime.jsx(
462
- "p",
471
+ waterMark && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 items-center justify-between w-full text-xs text-center sm:flex-row mt-[10vh] text-[0.6rem] max-w-3xl opacity-55 hover:opacity-100 transition duration-200", children: [
472
+ /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
473
+ "\xA9 ",
474
+ (/* @__PURE__ */ new Date()).getFullYear(),
475
+ " All rights reserved"
476
+ ] }),
477
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full flex items-center justify-between gap-2 sm:justify-end sm:w-auto", children: [
478
+ /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Powered by" }),
479
+ /* @__PURE__ */ jsxRuntime.jsxs("button", { className: "relative rounded-full btn btn-xs border-purple-500/70 bg-gradient-to-tr from-base-100/70 to-purple-700/70 hover:border-purple-200/90 hover:shadow-md hover:shadow-black/[0.3] transition duration-200", children: [
480
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-x-0 h-px w-1/2 mx-auto -top-px shadow-xl bg-gradient-to-r from-transparent via-purple-200 to-transparent" }),
481
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative z-20", children: /* @__PURE__ */ jsxRuntime.jsx(
482
+ "a",
463
483
  {
464
- className: `inline-block w-fit ${openingTime === "Closed" && "font-semibold"}`,
465
- children: openingTime
484
+ href: "https://cmdcntr.io",
485
+ className: "link text-[0.6rem] no-underline text-base-content/70 hover:text-base-content/100 transition duration-200",
486
+ target: "_blank",
487
+ children: "CMD CNTR"
466
488
  }
467
- )
468
- ] }, index2);
469
- })
489
+ ) })
490
+ ] })
491
+ ] })
470
492
  ] })
471
493
  ] }) });
472
494
  };
package/dist/index.mjs CHANGED
@@ -385,61 +385,83 @@ var Footer = function({
385
385
  socialLinks,
386
386
  maxLogoHeight,
387
387
  leftElement,
388
- openingHours
388
+ openingHours,
389
+ waterMark = true,
390
+ className = "p-10 text-base-content bg-base-200"
389
391
  }) {
390
- const logoHeight = maxLogoHeight ? maxLogoHeight : "50px";
391
- const logoHeightStyle = {
392
- "--footer-logo-height": logoHeight
393
- };
394
- return /* @__PURE__ */ jsx("div", { className: "h-full w-full @container", children: /* @__PURE__ */ jsxs("footer", { className: "footer flex w-full flex-col items-center justify-center gap-10 bg-base-200 p-10 text-base-content @xl:flex-row @xl:items-start", children: [
395
- leftElement ? /* @__PURE__ */ jsx("aside", { className: "flex flex-col items-center justify-center gap-4 mt-auto px-8 border-b-[1px] pb-4 border-base-100 md:border-r-[1px] md:border-b-0 md:pb-0 md:mt-0", children: leftElement }) : /* @__PURE__ */ jsxs("aside", { className: "flex flex-col items-center justify-center gap-4 mt-auto px-8 border-b-[1px] pb-4 border-base-100 md:border-r-[1px] md:border-b-0 md:pb-0 md:mt-0", children: [
396
- /* @__PURE__ */ jsx("div", { style: logoHeightStyle, children: /* @__PURE__ */ jsx("img", { src: logo || "", alt: "Company Logo", className: "h-[var(--footer-logo-height)]" }) }),
397
- /* @__PURE__ */ jsx("p", { children: logoText })
398
- ] }),
399
- links == null ? void 0 : links.map((item, index2) => {
400
- return /* @__PURE__ */ jsxs("nav", { children: [
401
- /* @__PURE__ */ jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: item.header }),
402
- item.links.map((link, index3) => {
392
+ return /* @__PURE__ */ jsx("div", { className: "h-full w-full @container", children: /* @__PURE__ */ jsxs("footer", { className: `flex w-full flex-col items-center justify-center ${className}`, children: [
393
+ /* @__PURE__ */ jsxs("div", { className: `footer flex w-full flex-col items-center justify-start gap-10 @xl:flex-row @xl:items-start max-w-3xl`, children: [
394
+ leftElement ? /* @__PURE__ */ jsx("aside", { className: "flex flex-col items-center justify-center gap-4 mt-auto px-8 border-b-[1px] pb-4 border-base-100 md:border-r-[1px] md:border-b-0 md:pb-0 md:mt-0", children: leftElement }) : /* @__PURE__ */ jsxs("aside", { className: "gap-4 border-b-[1px] border-base-100 md:border-r-[1px] md:border-b-0 max-w-[25vw] pr-0 pb-10 md:pb-0 md:pr-10", children: [
395
+ logo && /* @__PURE__ */ jsx("img", { src: logo, alt: "Company Logo", className: "w-sm" }),
396
+ /* @__PURE__ */ jsx("p", { children: logoText })
397
+ ] }),
398
+ links == null ? void 0 : links.map((item, index2) => {
399
+ return /* @__PURE__ */ jsxs("nav", { children: [
400
+ /* @__PURE__ */ jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: item.header }),
401
+ item.links.map((link, index3) => {
402
+ return /* @__PURE__ */ jsx(
403
+ "a",
404
+ {
405
+ className: "link-hover link mx-auto @xl:mx-0",
406
+ href: link.url,
407
+ children: link.text
408
+ },
409
+ index3
410
+ );
411
+ })
412
+ ] }, index2);
413
+ }),
414
+ socialLinks && /* @__PURE__ */ jsxs("nav", { children: [
415
+ /* @__PURE__ */ jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: "Social" }),
416
+ socialLinks == null ? void 0 : socialLinks.map((link, index2) => {
403
417
  return /* @__PURE__ */ jsx(
404
418
  "a",
405
419
  {
406
- className: "link-hover link mx-auto @xl:mx-0",
407
420
  href: link.url,
408
- children: link.text
421
+ className: "link-hover link mx-auto @xl:mx-0",
422
+ children: /* @__PURE__ */ jsx(link.icon, { className: "text-base-content", size: 30 })
409
423
  },
410
- index3
424
+ index2
411
425
  );
412
426
  })
413
- ] }, index2);
414
- }),
415
- socialLinks && /* @__PURE__ */ jsxs("nav", { children: [
416
- /* @__PURE__ */ jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: "Social" }),
417
- socialLinks == null ? void 0 : socialLinks.map((link, index2) => {
418
- return /* @__PURE__ */ jsx(
419
- "a",
420
- {
421
- href: link.url,
422
- className: "link-hover link mx-auto @xl:mx-0",
423
- children: /* @__PURE__ */ jsx(link.icon, { className: "text-base-content", size: 30 })
424
- },
425
- index2
426
- );
427
- })
427
+ ] }),
428
+ openingHours && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 w-fit", children: [
429
+ /* @__PURE__ */ jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: openingHours.header }),
430
+ openingHours.hours.map(({ day, openingTime }, index2, arr) => {
431
+ return /* @__PURE__ */ jsxs("div", { className: "flex items-center w-[200px] justify-between", children: [
432
+ /* @__PURE__ */ jsx("p", { className: "inline-block w-fit", children: day }),
433
+ /* @__PURE__ */ jsx(
434
+ "p",
435
+ {
436
+ className: `inline-block w-fit ${openingTime === "Closed" && "font-semibold"}`,
437
+ children: openingTime
438
+ }
439
+ )
440
+ ] }, index2);
441
+ })
442
+ ] })
428
443
  ] }),
429
- openingHours && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 w-fit", children: [
430
- /* @__PURE__ */ jsx("header", { className: "footer-title mx-auto @xl:mx-0", children: openingHours.header }),
431
- openingHours.hours.map(({ day, openingTime }, index2, arr) => {
432
- return /* @__PURE__ */ jsxs("div", { className: "flex items-center w-[200px] justify-between", children: [
433
- /* @__PURE__ */ jsx("p", { className: "inline-block w-fit", children: day }),
434
- /* @__PURE__ */ jsx(
435
- "p",
444
+ waterMark && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 items-center justify-between w-full text-xs text-center sm:flex-row mt-[10vh] text-[0.6rem] max-w-3xl opacity-55 hover:opacity-100 transition duration-200", children: [
445
+ /* @__PURE__ */ jsxs("p", { children: [
446
+ "\xA9 ",
447
+ (/* @__PURE__ */ new Date()).getFullYear(),
448
+ " All rights reserved"
449
+ ] }),
450
+ /* @__PURE__ */ jsxs("div", { className: "w-full flex items-center justify-between gap-2 sm:justify-end sm:w-auto", children: [
451
+ /* @__PURE__ */ jsx("p", { children: "Powered by" }),
452
+ /* @__PURE__ */ jsxs("button", { className: "relative rounded-full btn btn-xs border-purple-500/70 bg-gradient-to-tr from-base-100/70 to-purple-700/70 hover:border-purple-200/90 hover:shadow-md hover:shadow-black/[0.3] transition duration-200", children: [
453
+ /* @__PURE__ */ jsx("div", { className: "absolute inset-x-0 h-px w-1/2 mx-auto -top-px shadow-xl bg-gradient-to-r from-transparent via-purple-200 to-transparent" }),
454
+ /* @__PURE__ */ jsx("span", { className: "relative z-20", children: /* @__PURE__ */ jsx(
455
+ "a",
436
456
  {
437
- className: `inline-block w-fit ${openingTime === "Closed" && "font-semibold"}`,
438
- children: openingTime
457
+ href: "https://cmdcntr.io",
458
+ className: "link text-[0.6rem] no-underline text-base-content/70 hover:text-base-content/100 transition duration-200",
459
+ target: "_blank",
460
+ children: "CMD CNTR"
439
461
  }
440
- )
441
- ] }, index2);
442
- })
462
+ ) })
463
+ ] })
464
+ ] })
443
465
  ] })
444
466
  ] }) });
445
467
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@commandcenterio/convert-ui",
3
- "version": "0.0.10",
3
+ "version": "0.0.11",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.ts",