@documental-xyz/core 0.1.0

package/src/integration/override-aliases.ts

@@ -0,0 +1,67 @@
+import fs from 'node:fs';
+import path from 'node:path';
+
+/**
+ * Scan the consumer's `src/components/` and `src/layouts/` directories and
+ * produce Vite `resolve.alias` entries that redirect `@documental-xyz/core`
+ * bare-specifier imports to the consumer's local files.
+ *
+ * This is the override mechanism documented in T2 POC finding #3: a consumer
+ * can drop a local `.astro` file with the same name as a core component/layout
+ * and have it shadow the core's version. Only files that EXIST locally are
+ * aliased — missing files fall through to the core package via `exports`.
+ *
+ * Key constraint (T2 POC): the alias `find` string MUST be the exact full
+ * subpath including the `.astro` extension. A vague `@documental-xyz/core`
+ * → dir alias is insufficient and breaks resolution.
+ *
+ * @param consumerRoot Absolute path to the consumer project root
+ *                     (defaults to `process.cwd()`).
+ * @returns Array of Vite alias entries `{ find, replacement }`.
+ */
+export function overrideAliases(
+  consumerRoot: string = process.cwd()
+): Array<{ find: string; replacement: string }> {
+  const aliases: Array<{ find: string; replacement: string }> = [];
+  const coreName = '@documental-xyz/core';
+
+  // 1. Components — flat directory, one .astro file per override.
+  const localComponentsDir = path.resolve(consumerRoot, 'src/components');
+  if (fs.existsSync(localComponentsDir)) {
+    for (const file of fs.readdirSync(localComponentsDir)) {
+      if (file.endsWith('.astro')) {
+        const localPath = path.resolve(localComponentsDir, file);
+        aliases.push({
+          find: `${coreName}/components/${file}`,
+          replacement: localPath,
+        });
+      }
+    }
+  }
+
+  // 2. Layouts — recursive walk (src/layouts/components/, src/layouts/pages/, etc).
+  const localLayoutsDir = path.resolve(consumerRoot, 'src/layouts');
+  if (fs.existsSync(localLayoutsDir)) {
+    const scanLayouts = (dir: string, prefix: string = '') => {
+      for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+        if (entry.isDirectory()) {
+          scanLayouts(
+            path.resolve(dir, entry.name),
+            `${prefix}${entry.name}/`
+          );
+        } else if (entry.name.endsWith('.astro')) {
+          const localPath = path.resolve(dir, entry.name);
+          aliases.push({
+            find: `${coreName}/layouts/${prefix}${entry.name}`,
+            replacement: localPath,
+          });
+        }
+      }
+    };
+    scanLayouts(localLayoutsDir);
+  }
+
+  return aliases;
+}
+
+export default overrideAliases;

package/src/layouts/components/ButtonLayout.astro

@@ -0,0 +1,8 @@
+---
+const { Component, props } = Astro.props;
+const { link, icon, size, ...otherProps } = props;
+---
+
+<Component link={link} icon={icon} size={size} {...otherProps}>
+  <slot />
+</Component>

package/src/layouts/components/CardLayout.astro

@@ -0,0 +1,8 @@
+---
+import Card from '../../components/Card.astro';
+
+const { Component, props } = Astro.props;
+const { link, title, text, icon } = props;
+---
+
+  <Component link={link} title={title} text={text} icon={icon} />

package/src/layouts/components/CardsCallLayout.astro

@@ -0,0 +1,26 @@
+---
+import AnimationToggle from '../../components/AnimationToggle.astro';
+import Group from '../../components/Group.astro';
+
+const { Component, props } = Astro.props;
+const { cardsCallArr = []} = props;
+
+// Atualiza o array de cards substituindo a imagem original por `thumb` localizada em public/uploads
+const updatedCardsCallArr = cardsCallArr.map(card => {
+  let updatedImg = { ...card.img };
+    if (updatedImg.src) {
+        updatedImg.src = /^https?:\/\//i.test(card.img.src) ? card.img.src : new URL(card.img.src.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+        updatedImg.alt = `${card.img.alt}`
+        updatedImg.width = '100%';
+        updatedImg.height = '100%';
+    }
+  return {
+    ...card,
+    img: updatedImg
+
+  };
+});
+---
+<AnimationToggle>
+  <Component cards={updatedCardsCallArr} />
+</AnimationToggle>

package/src/layouts/components/CardsLayout.astro

@@ -0,0 +1,14 @@
+---
+import AnimationToggle from '../../components/AnimationToggle.astro';
+import Group from '../../components/Group.astro';
+
+const { Component, props } = Astro.props;
+const { cardsArr = []} = props;
+
+const cards = cardsArr.map(cardItem => cardItem.Card || cardItem);
+
+//console.log("CardsArr: ", cards[0].text)
+---
+<AnimationToggle>
+  <Component cards={cards} />
+</AnimationToggle>

package/src/layouts/components/ChartBarLayout.astro

@@ -0,0 +1,21 @@
+---
+import AnimationToggle from "../../components/AnimationToggle.astro";
+
+const { Component, props } = Astro.props;
+const { chartTitle, chartNotes, chartBars } = props;
+//console.log("ChartBar props:", Astro.props.chartBars);
+
+// Ensure chartBars is always a valid array
+const validChartBars = chartBars && Array.isArray(chartBars) ? chartBars : [];
+
+const componentData = {
+    title: chartTitle,
+    notes: chartNotes,
+    values: validChartBars
+};
+---
+<AnimationToggle>
+    <Component {...componentData}>
+        <slot />
+    </Component>
+</AnimationToggle>

package/src/layouts/components/ChartPercentageLayout.astro

@@ -0,0 +1,17 @@
+---
+import AnimationToggle from "../../components/AnimationToggle.astro";
+
+const { Component, props } = Astro.props;
+const { chartPercentageTitle, chartPercentageNotes, chartPercentageValues = [] } = props;
+
+const componentData = {
+    title: chartPercentageTitle,
+    notes: chartPercentageNotes,
+    values: chartPercentageValues
+};
+---
+<AnimationToggle>
+    <Component {...componentData}>
+        <slot />
+    </Component>
+</AnimationToggle>

package/src/layouts/components/ColumnLayout.astro

@@ -0,0 +1,11 @@
+---
+const { Component, props } = Astro.props;
+
+const componentData = {
+    ...props
+};
+---
+
+<Component {...componentData}>
+    <slot />
+</Component>

package/src/layouts/components/ColumnStickyLayout.astro

@@ -0,0 +1,10 @@
+---
+const { Component, props } = Astro.props;
+const { txtColor, bgColor, paddingTop, paddingBottom, layout, title, body, ...otherProps } = props;
+---
+
+<Component paddingTop={paddingTop} paddingBottom={paddingBottom} layout={layout} txtColor={txtColor} bgColor={bgColor} {...otherProps}>
+  {title && <h1 slot="title"><Fragment set:html={title} /></h1>}
+  
+  <slot />
+</Component>

package/src/layouts/components/ColumnsLayout.astro

@@ -0,0 +1,13 @@
+---
+const { Component, props } = Astro.props;
+const { column1, column2 } = props;
+---
+
+<Component {...props}>
+    <Fragment slot="column-1">
+      {column1}
+    </Fragment>
+    <Fragment slot="column-2">
+      {column2}
+    </Fragment>
+  </Component>

package/src/layouts/components/CompareLayout.astro

@@ -0,0 +1,22 @@
+---
+import AnimationToggle from "../../components/AnimationToggle.astro";
+
+const { Component, props } = Astro.props;
+const { imageLeft, imageRight, caption } = props;
+
+let imageLeftSrc;
+let imageRightSrc;
+
+if (imageLeft) {
+    imageLeftSrc = /^https?:\/\//i.test(imageLeft) ? imageLeft : new URL(imageLeft.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+}
+
+if (imageRight) {
+    imageRightSrc = /^https?:\/\//i.test(imageRight) ? imageRight : new URL(imageRight.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+}
+---
+<AnimationToggle>
+  <Component imageLeft={imageLeftSrc} imageRight={imageRightSrc} caption={caption} >
+    <slot />
+  </Component>
+</AnimationToggle>

package/src/layouts/components/CtaLayout.astro

@@ -0,0 +1,91 @@
+---
+import AnimationToggle from '../../components/AnimationToggle.astro';
+
+const { Component, props, pageSettings } = Astro.props;
+const {
+  id,
+  highlightedText,
+  ctaMedia,
+  txtColor,
+  bgColor,
+  ctaText,
+  link,
+  backgroundMedia,
+  overlay,
+  body,
+  animations = true
+} = props;
+
+const globalAnimationMode = pageSettings?.animations || 'enable_all';
+
+let shouldDisableAnimations;
+
+switch (globalAnimationMode) {
+  case 'enable_all':
+    shouldDisableAnimations = false;
+    break;
+  case 'disable_all':
+    shouldDisableAnimations = true;
+    break;
+  case 'custom':
+    shouldDisableAnimations = !animations;
+    break;
+  default:
+    shouldDisableAnimations = false;
+}
+
+const hasMedia = ctaMedia && ctaMedia.length > 0;
+const resolvedLayout = hasMedia ? 'media' : 'text';
+
+let resolvedMediaType;
+let resolvedMedia;
+
+if (hasMedia) {
+  const item = ctaMedia[0];
+  const src = item.externalUrl || item.src;
+
+  if (item.type === 'ctaImage' && src) {
+    resolvedMediaType = 'image';
+    resolvedMedia = /^https?:\/\//i.test(src)
+      ? src
+      : new URL(src.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+  } else if (item.type === 'ctaVideo' && src) {
+    resolvedMediaType = 'video';
+    resolvedMedia = src;
+  }
+}
+
+let imgBg;
+let videoBg;
+
+if (backgroundMedia && backgroundMedia.length > 0) {
+  const bgMedia = backgroundMedia[0];
+  if (bgMedia.type === 'backgroundImage' && bgMedia.imgSrc) {
+    imgBg = bgMedia.imgSrc;
+    imgBg = /^https?:\/\//i.test(imgBg) ? imgBg : new URL(imgBg.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+  } else if (bgMedia.type === 'backgroundVideo' && bgMedia.videoSrc) {
+    videoBg = bgMedia.videoSrc;
+    videoBg = /^https?:\/\//i.test(videoBg) ? videoBg : new URL(videoBg.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+  }
+}
+---
+<AnimationToggle disabled={shouldDisableAnimations}>
+  <section id={id} style={`background-color: var(--clr-bg);`}>
+    <Component
+      layout={resolvedLayout}
+      highlightedText={highlightedText}
+      media={resolvedMedia}
+      mediaType={resolvedMediaType}
+      text={ctaText}
+      link={link}
+      imgBg={imgBg}
+      videoBg={videoBg}
+      txtColor={txtColor}
+      bgColor={bgColor}
+      overlay={overlay}
+    >
+      {body && <Fragment set:html={body} />}
+      <slot />
+    </Component>
+  </section>
+</AnimationToggle>

package/src/layouts/components/GalleryLayout.astro

@@ -0,0 +1,24 @@
+---
+import AnimationToggle from '../../components/AnimationToggle.astro';
+import Group from '../../components/Group.astro';
+
+const { Component, props } = Astro.props;
+const {  ...gallery } = props;
+
+// Atualiza o array de imagens substituindo a imagem original por `thumb` localizada em public/uploads
+let updatedImages = gallery.images.map(img => {
+  let updatedImg = { ...img };
+    if (updatedImg.image) {
+        updatedImg.image = /^https?:\/\//i.test(img.image) ? img.image : new URL(img.image.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+    }
+  return updatedImg;
+});
+
+const updatedGallery = {
+    ...gallery,
+    images: updatedImages
+  };
+---
+<AnimationToggle>
+  <Component {...updatedGallery} />
+</AnimationToggle>

package/src/layouts/components/GroupLayout.astro

@@ -0,0 +1,53 @@
+---
+import AnimationToggle from '../../components/AnimationToggle.astro';
+
+const { Component, props, pageSettings } = Astro.props;
+const { id, txtColor, bgColor, backgroundMedia, overlay, animations = true } = props;
+
+// Nova lógica com 3 opções: enable_all, disable_all, custom
+const globalAnimationMode = pageSettings?.animations || 'enable_all';
+
+let shouldDisableAnimations;
+
+switch (globalAnimationMode) {
+  case 'enable_all':
+    shouldDisableAnimations = false; // Sempre habilitado
+    break;
+  case 'disable_all':
+    shouldDisableAnimations = true; // Sempre desabilitado
+    break;
+  case 'custom':
+    shouldDisableAnimations = !animations; // Segue configuração individual
+    break;
+  default:
+    shouldDisableAnimations = false;
+}
+
+let imgBg;
+let videoBg;
+
+if (backgroundMedia && backgroundMedia.length > 0) {
+    const media = backgroundMedia[0];
+    if (media.type === 'backgroundImage' && media.imgSrc) {
+        imgBg = media.imgSrc;
+        imgBg = /^https?:\/\//i.test(imgBg) ? imgBg : new URL(imgBg.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+    } else if (media.type === 'backgroundVideo' && media.videoSrc) {
+        videoBg = media.videoSrc;
+        videoBg = /^https?:\/\//i.test(videoBg) ? videoBg : new URL(videoBg.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+    }
+}
+---
+
+<section id={id}>
+    <AnimationToggle disabled={shouldDisableAnimations}>
+        <Component
+            txtColor={txtColor}
+            bgColor={bgColor}
+            imgBg={imgBg}
+            videoBg={videoBg}
+            overlay={overlay}
+        >
+            <slot />
+        </Component>
+    </AnimationToggle>
+</section>

package/src/layouts/components/HtmlEmbedLayout.astro

@@ -0,0 +1,18 @@
+---
+import AnimationToggle from "../../components/AnimationToggle.astro";
+
+const { Component, props } = Astro.props;
+const { htmlCode, htmlCaption, wideHtml } = props;
+
+const componentData = {
+    wide: wideHtml || false
+};
+---
+<AnimationToggle>
+    <Component {...componentData}>
+        <div set:html={htmlCode}></div>
+        <Fragment slot="caption">
+            {htmlCaption}
+        </Fragment>
+    </Component>
+</AnimationToggle>

package/src/layouts/components/ImageBlockLayout.astro

@@ -0,0 +1,20 @@
+---
+import AnimationToggle from "../../components/AnimationToggle.astro";
+
+const { Component, props } = Astro.props;
+const { src, alt, wideImage, description } = props;
+
+const componentData = {
+    //src: src.startsWith('http') ? src : `${import.meta.env.BASE_URL}${src}`,
+    src: /^https?:\/\//i.test(src) ? src : new URL(src.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname,
+    alt: alt || "",
+    wide: wideImage || false,
+    description: description
+};
+---
+<AnimationToggle>
+    <Component {...componentData}>
+        <slot />
+        {description}
+    </Component>
+</AnimationToggle>

package/src/layouts/components/InnerColumnsLayout.astro

@@ -0,0 +1,14 @@
+---
+const { Component, props } = Astro.props;
+const { column1, column2 } = props;
+
+---
+
+<Component {...props}>
+    <Fragment slot="column-1">
+      {column1}
+    </Fragment>
+    <Fragment slot="column-2">
+      {column2}
+    </Fragment>
+  </Component>

package/src/layouts/components/LogosGroupLayout.astro

@@ -0,0 +1,22 @@
+---
+import AnimationToggle from "../../components/AnimationToggle.astro";
+
+const { Component, props } = Astro.props;
+const { logos = []} = props;
+
+// Atualiza o array de logos substituindo a imagem original por `thumb` localizada em public/uploads
+const updatedLogos = logos.map(logo => {
+  let updatedImg = { ...logo.image };
+    if (updatedImg) {
+        updatedImg = /^https?:\/\//i.test(logo.image) ? logo.image : new URL(logo.image.replace(/^\/+/, ''), new URL(import.meta.env.BASE_URL, 'http://local')).pathname;
+    }
+  return {
+    ...logo,
+    image: updatedImg
+
+  };
+});
+---
+<AnimationToggle>
+  <Component logos={updatedLogos} />
+</AnimationToggle>

package/src/layouts/components/MapLayout.astro

@@ -0,0 +1,41 @@
+---
+import AnimationToggle from '../../components/AnimationToggle.astro';
+
+const { Component, props, pageSettings } = Astro.props;
+const { id, columnAlign, floatingText, txtColor, bgColor, mapView, components, animations = true, ...otherProps } = props;
+
+// Nova lógica com 3 opções: enable_all, disable_all, custom
+const globalAnimationMode = pageSettings?.animations || 'enable_all';
+
+let shouldDisableAnimations;
+
+switch (globalAnimationMode) {
+  case 'enable_all':
+    shouldDisableAnimations = false; // Sempre habilitado
+    break;
+  case 'disable_all':
+    shouldDisableAnimations = true; // Sempre desabilitado
+    break;
+  case 'custom':
+    shouldDisableAnimations = !animations; // Segue configuração individual
+    break;
+  default:
+    shouldDisableAnimations = false;
+}
+---
+
+<section id={id} style={{ backgroundColor: 'var(--clr-bg, transparent)' }}>
+  <AnimationToggle disabled={shouldDisableAnimations}>
+    <Component
+      columnAlign={columnAlign}
+      floatingText={floatingText}
+      txtColor={txtColor}
+      bgColor={bgColor}
+      mapView={mapView}
+      components={components}
+      {...otherProps}
+    >
+      <slot />
+    </Component>
+  </AnimationToggle>
+</section>

package/src/layouts/components/MapViewLayout.astro

@@ -0,0 +1,8 @@
+---
+const { Component, props } = Astro.props;
+const { mapView, ...otherProps } = props;
+---
+
+<Component mapView={mapView} {...otherProps}>
+  <slot />
+</Component>