@consumidor-positivo/aurora 1.2.0 → 1.3.0

package/astro/Card/Root/index.astro

@@ -0,0 +1,53 @@
+---
+import type { HTMLAttributes } from 'astro/types'
+import '../../../dist/components/Card/styles.css'
+
+/**
+ * Same props as React, minus `ref`. Sizes are inline `style`, written like React
+ * writes them (an unset size comes out as `undefinedpx`, which the browser
+ * drops), so a `style` passed here is ignored. Every HTML attribute is forwarded.
+ */
+export type Props = Omit<HTMLAttributes<'div'>, 'color' | 'style'> & {
+  border?: boolean
+  color?: 'primary' | 'secondary'
+  /** Width in px. */
+  width?: number
+  /** Height in px. */
+  height?: number
+  /** Max width in px. */
+  maxWidth?: number
+  /** Max height in px. */
+  maxHeight?: number
+  paddingLess?: boolean
+  hoverShadow?: boolean
+}
+
+const {
+  border = true,
+  color = 'primary',
+  width,
+  height,
+  maxWidth,
+  maxHeight,
+  paddingLess = false,
+  hoverShadow = false,
+  class: className,
+  ...rest
+} = Astro.props
+
+const style = `width:${width}px;height:${height}px;max-width:${maxWidth}px;max-height:${maxHeight}px`
+---
+
+<div
+  class:list={[
+    'au-card__root',
+    !border && 'au-card__root--border-none',
+    color === 'secondary' && 'au-card__root--color-secondary',
+    hoverShadow && 'au-card__root--with-hover-shadow',
+    paddingLess && 'au-card__root--paddingless',
+    className,
+  ]}
+  {...rest}
+  style={style}>
+  <slot />
+</div>

package/astro/Card/Tag/index.astro

@@ -0,0 +1,26 @@
+---
+import type { HTMLAttributes } from 'astro/types'
+import '../../../dist/components/Card/styles.css'
+
+/**
+ * Same props as React. The React `icon` prop is the `icon` slot and the label
+ * is the default slot. Every HTML attribute is forwarded to the root `div`.
+ */
+export type Props = Omit<HTMLAttributes<'div'>, 'color'> & {
+  color?: 'primary' | 'secondary'
+}
+
+const { color = 'primary', class: className, ...rest } = Astro.props
+---
+
+<div
+  class:list={[
+    'au-card__tag',
+    color === 'primary' && 'au-card__tag--primary',
+    color === 'secondary' && 'au-card__tag--secondary',
+    className,
+  ]}
+  {...rest}>
+  <span aria-hidden="true"><slot name="icon" /></span>
+  <span><slot /></span>
+</div>

package/astro/Chip/index.astro

@@ -0,0 +1,48 @@
+---
+import type { HTMLAttributes } from 'astro/types'
+import Button from '../Button/index.astro'
+import IconChevronDown from '../icons/default/IconChevronDown.astro'
+import '../../dist/components/Chip/styles.css'
+
+type ButtonAttributes = Omit<HTMLAttributes<'button'>, 'type' | 'disabled' | 'color'>
+
+/**
+ * Built on the Astro `Button`, like React builds on `Button`. The React `icon`
+ * prop is the `icon` slot (ignored on `variant="order"`, which always shows the
+ * chevron). No `onClick`: every HTML attribute is forwarded to the `<button>`,
+ * so hook the app on an `id` or `data-*`.
+ */
+export type Props = ButtonAttributes & {
+  isActive: boolean
+  isDisabled?: boolean
+  label: string
+  variant?: 'filter' | 'order'
+}
+
+const {
+  isActive,
+  isDisabled = false,
+  label,
+  variant = 'filter',
+  class: className,
+  ...rest
+} = Astro.props
+
+const isOrder = variant === 'order'
+---
+
+<Button
+  class:list={[
+    'au-chip',
+    `au-chip--variant-${variant}`,
+    isActive && 'au-chip--active',
+    isDisabled && 'au-chip--disabled',
+    className,
+  ]}
+  type="outlined"
+  disabled={isDisabled}
+  {...rest}>
+  {!isOrder && <slot name="icon" />}
+  {label}
+  {isOrder && <IconChevronDown />}
+</Button>

package/astro/ChipBanner/index.astro

@@ -0,0 +1,160 @@
+---
+import type { HTMLAttributes } from 'astro/types'
+import Text from '../Text/index.astro'
+import IconPlay from '../icons/default/IconPlay.astro'
+import '../../dist/components/ChipBanner/styles.css'
+
+/**
+ * The React version takes `onClick` and `onComplete`. Astro has no callback
+ * props: the controller emits `au:chipbannertoggle` (`detail: { isPlaying }`)
+ * on every click and `au:chipbannercomplete` when a non-looping ring finishes.
+ * `ariaLabel` is the plain `aria-label` attribute (a custom one stays fixed; the
+ * default swaps with the state) and `className` the plain `class`. Every HTML
+ * attribute is forwarded to the `<button>`.
+ */
+export type Props = Omit<HTMLAttributes<'button'>, 'type'> & {
+  /** Initial state: 'pause' starts playing (shows the pause control). */
+  type?: 'play' | 'pause'
+  /** Duration of one ring sweep. Without it there is no ring. */
+  timeInSeconds?: number
+  /** Restarts the ring forever instead of stopping after one sweep. */
+  loop?: boolean
+  negative?: boolean
+}
+
+const {
+  type = 'pause',
+  timeInSeconds,
+  loop = false,
+  negative = false,
+  'aria-label': ariaLabel,
+  class: className,
+  ...rest
+} = Astro.props
+
+const PAUSE_SVG = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.99995 2.66653C6.36793 2.66667 6.66622 2.96496 6.66636 3.33294V12.6665C6.66636 13.0346 6.36802 13.3328 5.99995 13.3329C5.63176 13.3329 5.33276 13.0347 5.33276 12.6665V3.33294C5.3329 2.96487 5.63185 2.66653 5.99995 2.66653Z" fill="currentColor"/>
+<path d="M9.99995 2.66653C10.3679 2.66667 10.6662 2.96496 10.6664 3.33294V12.6665C10.6664 13.0346 10.368 13.3328 9.99995 13.3329C9.63176 13.3329 9.33276 13.0347 9.33276 12.6665V3.33294C9.3329 2.96487 9.63185 2.66653 9.99995 2.66653Z" fill="currentColor"/>
+</svg>`
+
+const isPlaying = type === 'pause'
+const hasTimer = typeof timeInSeconds === 'number' && timeInSeconds > 0
+const label = isPlaying ? 'Pausar' : 'Reproduzir'
+const defaultAriaLabel = isPlaying ? 'Pausar reprodução' : 'Reproduzir conteúdo'
+
+// React swaps the icons. Only the active one is rendered; the other rides in
+// the `<template>` (with the controller settings), which the controller reads
+// and removes. The pause svg is inlined from ./pause.svg because only `.astro`
+// files are published, so a `?raw` import would not resolve in the consumer.
+---
+
+<button
+  type="button"
+  class:list={['au-chip-banner', negative && 'au-chip-banner--negative', className]}
+  aria-pressed={isPlaying ? 'true' : 'false'}
+  aria-label={ariaLabel ?? defaultAriaLabel}
+  data-element="au-chip-banner"
+  {...rest}>
+  <span class="au-chip-banner__icon" aria-hidden="true">
+    {isPlaying ? <span class="au-chip-banner__pause" set:html={PAUSE_SVG} /> : <IconPlay />}
+    {
+      hasTimer && (
+        <svg
+          class="au-chip-banner__ring"
+          viewBox="0 0 24 24"
+          aria-hidden="true"
+          style={`visibility: ${isPlaying ? 'visible' : 'hidden'}`}>
+          <circle
+            class="au-chip-banner__ring-progress"
+            cx="12"
+            cy="12"
+            r="10"
+            fill="none"
+            style={{
+              'animation-duration': `${timeInSeconds}s`,
+              'animation-iteration-count': loop ? 'infinite' : 1,
+              'animation-play-state': isPlaying ? 'running' : 'paused',
+            }}
+          />
+        </svg>
+      )
+    }
+  </span>
+  <Text as="span" variant="body-medium" class="au-chip-banner__label">
+    {label}
+  </Text>
+  <template
+    data-au-chip-banner
+    data-loop={loop ? 'true' : undefined}
+    data-custom-label={ariaLabel ? 'true' : undefined}>
+    {isPlaying ? <IconPlay /> : <span class="au-chip-banner__pause" set:html={PAUSE_SVG} />}
+  </template>
+</button>
+
+<script>
+  import { elementController } from '@consumidor-positivo/aurora/astro/runtime'
+
+  const PROGRESS_CLASS = 'au-chip-banner__ring-progress'
+  const LABELS = { playing: 'Pausar', paused: 'Reproduzir' }
+  const ARIA_LABELS = {
+    playing: 'Pausar reprodução',
+    paused: 'Reproduzir conteúdo',
+  }
+
+  elementController('au-chip-banner', ({ root, query, on, emit }) => {
+    const template = query<HTMLTemplateElement>(':scope > template[data-au-chip-banner]')
+    const iconBox = query<HTMLElement>(':scope > .au-chip-banner__icon')
+    const ring = query<SVGSVGElement>(':scope > .au-chip-banner__icon > .au-chip-banner__ring')
+    const label = query<HTMLElement>(':scope > .au-chip-banner__label')
+    const isLoop = template?.dataset.loop === 'true'
+    const hasCustomLabel = template?.dataset.customLabel === 'true'
+
+    const current = iconBox?.firstElementChild ?? null
+    const other = template?.content.firstElementChild ?? null
+    const startsPlaying = root.getAttribute('aria-pressed') === 'true'
+    const pause = startsPlaying ? current : other
+    const play = startsPlaying ? other : current
+    template?.remove()
+
+    const progress = () => ring?.querySelector<SVGCircleElement>(`.${PROGRESS_CLASS}`) ?? null
+
+    function setPlaying(isPlaying: boolean) {
+      const state = isPlaying ? 'playing' : 'paused'
+      root.setAttribute('aria-pressed', String(isPlaying))
+      if (!hasCustomLabel) root.setAttribute('aria-label', ARIA_LABELS[state])
+      if (label) label.textContent = LABELS[state]
+
+      const show = isPlaying ? pause : play
+      const hide = isPlaying ? play : pause
+      if (iconBox && show && hide && hide.isConnected) {
+        hide.replaceWith(show)
+      }
+      if (ring) ring.style.visibility = isPlaying ? 'visible' : 'hidden'
+
+      const circle = progress()
+      if (circle) circle.style.animationPlayState = isPlaying ? 'running' : 'paused'
+    }
+
+    // Replacing the circle restarts its animation from 0, which is what the
+    // React key bump does. Pausing only freezes it.
+    function resetRing() {
+      const circle = progress()
+      if (!circle) return
+      circle.replaceWith(circle.cloneNode(true))
+    }
+
+    on('click', () => {
+      const isPlaying = root.getAttribute('aria-pressed') !== 'true'
+      setPlaying(isPlaying)
+      emit('au:chipbannertoggle', { isPlaying })
+    })
+
+    on('animationend', (event) => {
+      const target = event.target as Element | null
+      if (!target?.classList.contains(PROGRESS_CLASS) || isLoop) return
+      setPlaying(false)
+      resetRing()
+      emit('au:chipbannercomplete')
+    })
+  })
+</script>

package/astro/Container/index.astro

@@ -0,0 +1,16 @@
+---
+import type { HTMLAttributes } from 'astro/types'
+import '../../dist/components/Container/styles.css'
+
+/**
+ * The React `customClass` prop is the plain `class` attribute here; every
+ * other HTML attribute is forwarded to the `div`.
+ */
+export type Props = HTMLAttributes<'div'>
+
+const { class: className, ...rest } = Astro.props
+---
+
+<div class:list={['au-container', className]} {...rest}>
+  <slot />
+</div>

package/astro/Divider/index.astro

@@ -0,0 +1,27 @@
+---
+import type { HTMLAttributes } from 'astro/types'
+import '../../dist/components/Divider/styles.css'
+
+/** Same props as React; every HTML attribute is forwarded to the `<hr>`. */
+export type Props = HTMLAttributes<'hr'> & {
+  borderWidth?: 1 | 2
+  state?: 'visible' | 'invisible'
+}
+
+const {
+  borderWidth = 1,
+  state = 'visible',
+  class: className,
+  ...rest
+} = Astro.props
+---
+
+<hr
+  class:list={[
+    'au-divider',
+    borderWidth && `au-divider--width-${borderWidth}`,
+    state === 'invisible' && 'au-divider--invisible',
+    className,
+  ]}
+  {...rest}
+/>

package/astro/Image/index.astro

@@ -0,0 +1,26 @@
+---
+import type { HTMLAttributes } from 'astro/types'
+import { BREAKPOINT_LG, BREAKPOINT_MD } from '@consumidor-positivo/aurora/astro/tokens'
+
+/**
+ * Same props and output as React: every `<img>` attribute goes to the
+ * `<img>`, and both `<source>` are always rendered (without `srcset` when the
+ * matching prop is missing, as React does).
+ */
+export type Props = HTMLAttributes<'img'> & {
+  /** Image used up to BREAKPOINT_MD (600px). */
+  srcMob?: string
+  /** Image used up to BREAKPOINT_LG (1024px). */
+  srcTablet?: string
+  /** Fallback `src` of the `<img>`. */
+  srcDesk?: string
+}
+
+const { srcMob, srcTablet, srcDesk, ...rest } = Astro.props
+---
+
+<picture>
+  <source media={`(max-width: ${BREAKPOINT_MD})`} srcset={srcMob} />
+  <source media={`(max-width: ${BREAKPOINT_LG})`} srcset={srcTablet} />
+  <img src={srcDesk} {...rest} />
+</picture>

package/astro/LazyImage/index.astro

@@ -0,0 +1,55 @@
+---
+import type { HTMLAttributes } from 'astro/types'
+
+/**
+ * Same output as React. With `lazy` (the default) the `<img>` ships without
+ * `src`, like the React version before the image is seen: the controller keeps
+ * the URL and sets `src` when an IntersectionObserver (same options as React's
+ * `useLazyImage`) reports the image as intersecting. No `onClick`: HTML
+ * attributes are forwarded.
+ */
+export type Props = Omit<HTMLAttributes<'img'>, 'src' | 'draggable'> & {
+  src: string
+  lazy?: boolean
+  draggable?: boolean
+}
+
+const { lazy = true, src, draggable = false, ...rest } = Astro.props
+const draggableValue = draggable ? 'true' : 'false'
+---
+
+{
+  lazy ? (
+    <img
+      data-element="au-lazy-image"
+      data-au-lazy-src={src}
+      loading="lazy"
+      draggable={draggableValue}
+      {...rest}
+    />
+  ) : (
+    <img src={src} draggable={draggableValue} {...rest} />
+  )
+}
+
+<script>
+  import { elementController } from '@consumidor-positivo/aurora/astro/runtime'
+
+  // Mirrors `useLazyImage` (lib/components/LazyImage/hooks.ts): no `src` until
+  // the observer (default options) sees the image, then observe no more.
+  elementController('au-lazy-image', ({ root }) => {
+    const src = root.dataset.auLazySrc
+    root.removeAttribute('data-au-lazy-src')
+    if (src === undefined) return
+
+    const observer = new IntersectionObserver((entries) => {
+      entries.forEach((entry) => {
+        if (!entry.isIntersecting) return
+        root.setAttribute('src', src)
+        observer.unobserve(root)
+      })
+    })
+
+    observer.observe(root)
+  })
+</script>

package/astro/LinkButton/index.astro

@@ -0,0 +1,54 @@
+---
+import type { HTMLAttributes } from 'astro/types'
+import '../../dist/components/LinkButton/styles.css'
+
+type AnchorProps = Pick<HTMLAttributes<'a'>, 'href' | 'target'>
+
+/**
+ * The React `iconLeft` / `iconRight` props are the `icon-left` / `icon-right`
+ * slots, and the label is the default slot (falls back to "Link"). No
+ * `onClick`: every HTML attribute is forwarded, so hook the app on an `id` or
+ * `data-*`.
+ */
+export type Props = Omit<HTMLAttributes<'button'>, 'disabled' | 'type'> &
+  AnchorProps & {
+    as?: 'a' | 'button'
+    /**
+     * Token size (Figma: Link Button, Size). small = 14px text / 16px icons,
+     * medium = 16px / 20px, large = 20px / 20px.
+     */
+    size?: 'small' | 'medium' | 'large'
+    disabled?: boolean
+  }
+
+const {
+  as = 'button',
+  href,
+  target,
+  size = 'medium',
+  disabled = false,
+  class: className,
+  ...rest
+} = Astro.props
+
+const isAnchor = as === 'a'
+const Tag = isAnchor ? 'a' : 'button'
+const hasLeft = Astro.slots.has('icon-left')
+const hasRight = Astro.slots.has('icon-right')
+---
+
+<Tag
+  class:list={[
+    'au-link-button',
+    `au-link-button--size-${size}`,
+    disabled && 'au-link-button--disabled',
+    className,
+  ]}
+  href={isAnchor ? href : undefined}
+  target={isAnchor ? target : undefined}
+  type={isAnchor ? undefined : 'button'}
+  disabled={!isAnchor && disabled ? true : undefined}
+  {...rest}>
+  {/* No whitespace around the label: React renders none, and it would show up in the text. */}
+  {hasLeft && <span class="au-link-button__icon" aria-hidden="true"><slot name="icon-left" /></span>}<slot>Link</slot>{hasRight && <span class="au-link-button__icon" aria-hidden="true"><slot name="icon-right" /></span>}
+</Tag>

package/astro/Logo/ac/BadgeFullWhite.astro

@@ -0,0 +1,20 @@
+---
+import Logo from '../index.astro'
+import type { HTMLAttributes } from 'astro/types'
+
+export type Props = HTMLAttributes<'div'>
+---
+
+<Logo label="Acordo Certo" {...Astro.props}>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="42"
+    height="32"
+    viewBox="0 0 42 32"
+    fill="none">
+    <path
+      d="M39.2064 2.79501C37.4096 0.991636 35.0183 0 32.4695 0C29.9208 0 27.5294 0.991636 25.7326 2.79501L18.7072 9.85054L16.3595 7.49431C14.5234 5.65145 12.0796 4.63787 9.47836 4.63787C6.87716 4.63787 4.66504 5.57685 2.90759 7.27492C1.05832 9.06952 0.022214 11.4828 0.000355074 14.0672C-0.0215038 16.6516 0.966517 19.0824 2.78955 20.9121L10.4008 28.5512C12.6173 30.7758 15.5682 32 18.7116 32C21.8549 32 24.8058 30.7758 27.0223 28.5512L39.2108 16.3181C41.012 14.5104 42 12.1102 42 9.55656C42 7.00288 41.0076 4.60277 39.2108 2.7994L39.2064 2.79501ZM26.9174 26.1643L25.7807 27.3051C21.8811 31.219 15.5333 31.219 11.638 27.3051L4.02676 19.666C2.54036 18.1741 1.73158 16.1909 1.74907 14.0804C1.76655 11.9698 2.6103 9.99973 4.12731 8.53421C5.60497 7.09941 7.5373 6.38859 9.48274 6.38859C11.4282 6.38859 13.5747 7.174 15.1267 8.73166L17.658 11.2722L14.9693 13.9707C14.9475 13.997 14.9256 14.0189 14.9037 14.0452C14.8688 14.0803 14.8338 14.1198 14.7988 14.1549C14.7682 14.19 14.742 14.2208 14.7114 14.2559C14.6851 14.2866 14.6589 14.3173 14.6327 14.348C14.6108 14.3743 14.589 14.405 14.5671 14.4314C14.5365 14.4709 14.5059 14.5104 14.4753 14.5498C14.4622 14.5674 14.4491 14.5893 14.436 14.6069C14.401 14.6595 14.366 14.7078 14.331 14.7605C14.331 14.7692 14.3223 14.7736 14.3179 14.7824C13.7933 15.5897 13.5091 16.5287 13.5091 17.516C13.5091 18.6743 13.8982 19.7713 14.6152 20.6576C14.6196 20.662 14.6239 20.6708 14.6283 20.6752C14.6677 20.7234 14.707 20.7717 14.7507 20.8156C14.7682 20.8331 14.7813 20.8507 14.7944 20.8682C14.8294 20.9033 14.86 20.9384 14.895 20.9735C14.9169 20.9999 14.9431 21.0262 14.9649 21.0481L14.9781 21.0613L14.9912 21.0745C15.9355 22.0222 17.1858 22.54 18.5192 22.54C18.8427 22.54 19.1575 22.5093 19.4679 22.4522C20.3947 22.2723 21.2516 21.8335 21.951 21.171C22.6155 20.5084 23.4986 20.1399 24.4386 20.1399C25.0463 20.1399 25.6364 20.2934 26.1611 20.5962C26.2004 20.6181 26.2398 20.6445 26.2791 20.6664C26.5108 20.8068 26.725 20.9735 26.9217 21.171C27.0048 21.2544 27.0791 21.3421 27.1535 21.4343C27.3065 21.6229 27.442 21.8204 27.5513 22.0354C27.8092 22.5356 27.9491 23.1016 27.9491 23.6676C27.9491 24.611 27.5819 25.4973 26.9217 26.1643H26.9174ZM37.9692 15.0764L29.4399 23.6369C29.4399 23.593 29.4399 23.5448 29.4355 23.5009C29.4355 23.4526 29.4355 23.4044 29.4311 23.3561C29.4311 23.3034 29.4224 23.2508 29.418 23.1981C29.4137 23.1499 29.4093 23.106 29.4049 23.0577C29.4005 23.0051 29.3874 22.9524 29.3831 22.8954C29.3743 22.8515 29.3699 22.8032 29.3612 22.7594C29.3525 22.7067 29.3393 22.6497 29.3262 22.597C29.3175 22.5531 29.3087 22.5093 29.3 22.4654C29.2869 22.4083 29.2694 22.3557 29.2519 22.2986C29.2388 22.2592 29.23 22.2153 29.2169 22.1758C29.1994 22.1187 29.1776 22.0573 29.1557 22.0003C29.1426 21.9652 29.1339 21.9257 29.1208 21.8906C29.0945 21.8204 29.0639 21.7546 29.0377 21.6844C29.0289 21.6624 29.0202 21.6361 29.0071 21.6141C28.9677 21.522 28.924 21.4343 28.8759 21.3421C28.7273 21.0525 28.5437 20.7805 28.3382 20.5216C28.2245 20.3812 28.1065 20.2408 27.9753 20.1091C27.6431 19.7757 27.2759 19.4992 26.8868 19.2842C26.1479 18.863 25.2998 18.6392 24.4342 18.6392C23.1402 18.6392 21.9248 19.1263 20.9936 20.0126C20.9499 20.0521 20.9062 20.0916 20.8625 20.1311C20.8188 20.1706 20.7794 20.2101 20.7357 20.2452C20.692 20.2803 20.6483 20.311 20.6045 20.3417C20.5564 20.3768 20.5084 20.4163 20.4603 20.4514C20.4165 20.4821 20.3685 20.5084 20.3204 20.5348C20.2679 20.5655 20.2198 20.6006 20.1674 20.6269C20.1149 20.6532 20.0668 20.6752 20.0143 20.7015C19.9619 20.7234 19.9138 20.7541 19.8613 20.7761C19.8089 20.798 19.752 20.8156 19.6996 20.8331C19.6471 20.8507 19.5947 20.8726 19.5422 20.8902C19.481 20.9077 19.4154 20.9209 19.3498 20.9384C19.3017 20.9516 19.258 20.9648 19.2099 20.9735C19.1269 20.9911 19.0394 20.9999 18.952 21.013C18.9258 21.013 18.8995 21.0218 18.8689 21.0262C18.7553 21.0394 18.6372 21.0437 18.5236 21.0437C18.4099 21.0437 18.2919 21.0394 18.1738 21.0262C17.3694 20.9472 16.6262 20.5962 16.0448 20.0126L16.0185 19.9863C16.0185 19.9863 16.0098 19.9775 16.0054 19.9731C15.9267 19.8898 15.848 19.8064 15.7781 19.723C15.765 19.7055 15.7562 19.6923 15.7431 19.6748C15.6819 19.5958 15.6251 19.5212 15.5682 19.4378C15.5682 19.4334 15.5639 19.429 15.5595 19.4247C14.93 18.4593 14.825 17.2483 15.2447 16.1996C15.2447 16.1996 15.2447 16.1909 15.2447 16.1865C15.2797 16.0987 15.3191 16.0154 15.3628 15.932C15.3715 15.9101 15.3803 15.8881 15.3934 15.8706C15.4284 15.8047 15.4677 15.7389 15.507 15.6731C15.5289 15.638 15.5464 15.6029 15.5682 15.5678C15.6032 15.5152 15.6426 15.4669 15.6775 15.4186C15.7081 15.3747 15.7431 15.3265 15.7781 15.2826C15.8174 15.2343 15.8655 15.1861 15.9092 15.1378C15.9442 15.0983 15.9748 15.0588 16.0142 15.0237L17.6099 13.4222L19.7564 11.2678L26.9655 4.03236C29.9995 0.991636 34.9308 0.987248 37.9648 4.03236C39.4338 5.50665 40.2425 7.46798 40.2425 9.55217C40.2425 11.6364 39.4338 13.5977 37.9648 15.072L37.9692 15.0764Z"
+      fill="white"
+    />
+  </svg>
+</Logo>

package/astro/Logo/ac/BadgeWhite.astro

@@ -0,0 +1,23 @@
+---
+import Logo from '../index.astro'
+import type { HTMLAttributes } from 'astro/types'
+
+export type Props = HTMLAttributes<'div'>
+---
+
+<Logo label="Acordo Certo" {...Astro.props}>
+
+
+
+   <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="42"
+    height="32"
+    viewBox="0 0 42 32"
+    fill="none">
+    <path
+      d="M39.2108 2.79463C37.414 0.991498 35.0226 0 32.4739 0C29.9251 0 27.5337 0.991498 25.7369 2.79463L18.7116 9.84918L16.3639 7.49327C14.5277 5.65066 12.0839 4.63722 9.4827 4.63722C6.8815 4.63722 4.66937 5.57608 2.91192 7.27391C1.05829 9.06826 0.022214 11.4812 0.000355092 14.0696C-0.0215038 16.6537 0.966465 19.0842 2.78949 20.9137L10.4008 28.5517C12.6173 30.776 15.5683 32 18.7116 32C21.8549 32 24.8058 30.776 27.0223 28.5517L39.2108 16.3203C41.0119 14.5127 42 12.113 42 9.55966C42 7.00633 41.0076 4.60654 39.2108 2.80341V2.79463ZM26.9217 26.1607L25.7851 27.3014C21.8854 31.2147 15.5376 31.2147 11.6423 27.3014L4.03112 19.6633C2.54471 18.1716 1.73595 16.1886 1.75344 14.0784C1.77093 11.9682 2.61465 9.99834 4.13166 8.53303C5.60932 7.09842 7.54164 6.38769 9.48708 6.38769C11.4325 6.38769 13.579 7.17304 15.131 8.73048L17.6623 11.2706L14.9737 13.9687C14.9518 13.9951 14.9299 14.017 14.908 14.0433C14.8731 14.0784 14.8381 14.1179 14.8031 14.153C14.7725 14.1881 14.7463 14.2188 14.7157 14.2539C14.6895 14.2846 14.6633 14.3153 14.637 14.346C14.6152 14.3724 14.5933 14.4031 14.5714 14.4294C14.5408 14.4689 14.5102 14.5084 14.4796 14.5479C14.4665 14.5654 14.4534 14.5874 14.4403 14.6049C14.4054 14.6576 14.3704 14.7058 14.3354 14.7584C14.3354 14.7672 14.3267 14.7716 14.3223 14.7804C13.7977 15.5876 13.5135 16.5265 13.5135 17.5136C13.5135 18.6718 13.9026 19.7686 14.6195 20.6548C14.6239 20.6592 14.6283 20.668 14.6327 20.6723C14.672 20.7206 14.7114 20.7688 14.7551 20.8127C14.7726 20.8303 14.7856 20.8478 14.7987 20.8654C14.8293 20.9005 14.8643 20.9355 14.8993 20.9706C14.9211 20.997 14.9474 21.0233 14.9693 21.0452L14.9824 21.0584L14.9956 21.0716C15.9399 22.0192 17.1901 22.5369 18.5235 22.5369C18.847 22.5369 19.1618 22.5062 19.4722 22.4492C20.3991 22.2693 21.2559 21.8306 21.9554 21.1681C22.6199 20.5056 23.503 20.1371 24.4429 20.1371C25.0506 20.1371 25.6407 20.2906 26.1653 20.5934C26.2047 20.6153 26.244 20.6416 26.2834 20.6636C26.5151 20.804 26.7293 20.9707 26.926 21.1681C27.0091 21.2515 27.0834 21.3392 27.1577 21.4313C27.3108 21.62 27.4464 21.8174 27.5556 22.0324C27.8136 22.5325 27.9534 23.0984 27.9534 23.6644C27.9534 24.6076 27.5862 25.4939 26.926 26.1607H26.9217Z"
+      fill="white"
+    />
+  </svg>
+</Logo>

package/astro/Logo/ac/BadgeWhiteStroke.astro

@@ -0,0 +1,27 @@
+---
+import Logo from '../index.astro'
+import type { HTMLAttributes } from 'astro/types'
+
+export type Props = HTMLAttributes<'div'>
+---
+
+<Logo label="Acordo Certo" {...Astro.props}>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="21"
+    height="16"
+    fill="none">
+    <path
+      fill="#fff"
+      d="M16.082 0a4.676 4.676 0 0 0-3.336 1.384l-3.48 3.494L8.105 3.71a4.778 4.778 0 0 0-3.408-1.414c-1.288 0-2.384.464-3.254 1.305A4.705 4.705 0 0 0 0 6.968a4.709 4.709 0 0 0 1.381 3.39l3.77 3.782a5.77 5.77 0 0 0 4.116 1.708 5.77 5.77 0 0 0 4.116-1.708l6.036-6.058A4.71 4.71 0 0 0 20.8 4.734a4.71 4.71 0 0 0-1.381-3.346A4.677 4.677 0 0 0 16.082.004V0Z"
+    />
+    <path
+      fill="#02BEDF"
+      d="M4.697 3.163c-.963 0-1.918.352-2.652 1.063A3.851 3.851 0 0 0 .867 6.972a3.844 3.844 0 0 0 1.128 2.766l3.77 3.783a4.946 4.946 0 0 0 7.004 0l.563-.565c.329-.33.508-.77.508-1.237a1.747 1.747 0 0 0-.827-1.486l-.058-.035a1.735 1.735 0 0 0-2.085.285 2.467 2.467 0 0 1-1.7.678c-.66 0-1.28-.258-1.747-.726l-.006-.006-.007-.007-.034-.037a1.11 1.11 0 0 1-.072-.078c-.02-.024-.041-.046-.06-.07l-.007-.008a2.46 2.46 0 0 1-.548-1.556c0-.489.14-.954.4-1.353l.007-.011.052-.076c.007-.009.013-.02.02-.028l.045-.06.033-.04.039-.046.043-.05c.017-.02.035-.037.052-.054l.032-.035 1.332-1.338L7.49 4.324a3.945 3.945 0 0 0-2.795-1.16"
+    />
+    <path
+      fill="#0048DB"
+      d="M18.804 7.463a3.848 3.848 0 0 0 1.128-2.733c0-1.032-.4-2.003-1.128-2.733a3.847 3.847 0 0 0-5.447 0L9.787 5.58 8.724 6.646l-.79.793c-.018.018-.035.04-.052.057-.022.024-.046.048-.065.072-.018.021-.033.043-.05.067-.018.024-.037.048-.054.074-.011.017-.02.035-.03.052-.02.033-.04.063-.057.098l-.015.03a1.33 1.33 0 0 0-.059.126v.007a1.744 1.744 0 0 0 .16 1.603c.027.041.057.078.087.117l.018.024a1.21 1.21 0 0 0 .119.13l.013.014a1.71 1.71 0 0 0 1.398.502c.013 0 .028-.005.041-.007.044-.004.087-.01.128-.02.024-.004.046-.01.07-.017l.095-.024c.026-.008.052-.02.078-.028.026-.009.054-.017.08-.028.026-.011.05-.024.076-.037.026-.013.051-.024.075-.037.026-.013.05-.03.076-.046.024-.013.048-.026.07-.041a.894.894 0 0 0 .07-.054c.023-.018.044-.03.066-.048l.063-.057c.021-.02.045-.039.064-.058a2.459 2.459 0 0 1 1.704-.68c.43 0 .85.11 1.215.32a2.468 2.468 0 0 1 .985 1.018c.024.043.043.09.065.135.004.01.009.024.015.035a1.896 1.896 0 0 1 .059.156l.03.087c.007.02.01.041.017.06l.024.083a18.765 18.765 0 0 0 .03.146c.005.022.007.046.011.067.005.026.009.052.011.08l.007.07c.002.026.006.052.006.078 0 .024 0 .048.002.072l.002.067 4.224-4.239-.002-.002Z"
+    />
+  </svg>
+</Logo>

package/astro/Logo/ac/BadgeWhiteStrokeDefault.astro

@@ -0,0 +1,28 @@
+---
+import Logo from '../index.astro'
+import type { HTMLAttributes } from 'astro/types'
+
+export type Props = HTMLAttributes<'div'>
+---
+
+<Logo label="Acordo Certo" {...Astro.props}>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="38"
+    height="30"
+    viewBox="0 0 38 30"
+    fill="none">
+    <path
+      d="M29.3811 0.5C27.0751 0.5 24.9115 1.39855 23.2858 3.03263L16.9295 9.42582L14.8054 7.29078C13.1441 5.62091 10.9331 4.70248 8.57959 4.70248C6.22612 4.70248 4.22467 5.55332 2.63459 7.09198C0.957497 8.71811 0.0200983 10.9048 0.000321273 13.2506C-0.0194558 15.5924 0.874421 17.7951 2.52383 19.453L9.41026 26.375C11.4157 28.3907 14.0856 29.5 16.9295 29.5C19.7735 29.5 22.4434 28.3907 24.4488 26.375L35.4764 15.2902C37.106 13.6522 38 11.4774 38 9.16344C38 6.84949 37.1021 4.67467 35.4764 3.04059C33.8507 1.4065 31.6871 0.50796 29.3811 0.50796V0.5Z"
+      fill="white"
+    />
+    <path
+      d="M8.57939 6.28857C6.81923 6.28857 5.07489 6.93267 3.734 8.23278C2.36543 9.56072 1.60206 11.3459 1.58228 13.2583C1.56646 15.1707 2.2982 16.9678 3.64304 18.3196L10.5294 25.2416C14.0576 28.7881 19.7969 28.7881 23.3252 25.2416L24.3536 24.2079C24.9548 23.6035 25.2831 22.8004 25.2831 21.9456C25.2831 21.4327 25.1605 20.9198 24.9232 20.4666C24.8243 20.2717 24.7017 20.0888 24.5633 19.9219C24.496 19.8384 24.4288 19.7589 24.3536 19.6833C24.1756 19.5044 23.9818 19.3533 23.7722 19.2261C23.7366 19.2022 23.701 19.1823 23.6654 19.1625C23.1907 18.8921 22.6567 18.749 22.1069 18.749C21.2565 18.749 20.4575 19.083 19.8563 19.6833C19.2234 20.2837 18.4482 20.6813 17.6096 20.8443C17.3288 20.896 17.044 20.9238 16.7513 20.9238C15.5449 20.9238 14.4137 20.4507 13.5593 19.5959L13.5474 19.5839L13.5355 19.572C13.5118 19.5481 13.4921 19.5243 13.4723 19.5044C13.4406 19.4726 13.409 19.4408 13.3813 19.409C13.3655 19.3931 13.3536 19.3772 13.3417 19.3613C13.3061 19.3175 13.2666 19.2778 13.231 19.234C13.227 19.2301 13.223 19.2221 13.2191 19.2181C12.5704 18.415 12.2183 17.4211 12.2183 16.3714C12.2183 15.4769 12.4755 14.626 12.9501 13.8944C12.9541 13.8865 12.9581 13.8825 12.962 13.8746C12.9937 13.8269 13.0253 13.7831 13.0569 13.7354C13.0688 13.7195 13.0807 13.6996 13.0926 13.6837C13.1203 13.648 13.1479 13.6122 13.1756 13.5764C13.1954 13.5525 13.2151 13.5247 13.2349 13.5008C13.2586 13.473 13.2824 13.4452 13.3061 13.4173C13.3338 13.3855 13.3576 13.3577 13.3853 13.3259C13.4169 13.2901 13.4486 13.2583 13.4802 13.2265C13.5 13.2066 13.5197 13.1828 13.5395 13.1629L15.972 10.7137L13.6819 8.41173C12.2778 7.00029 10.4186 6.28857 8.57543 6.28857"
+      fill="#02BEDF"
+    />
+    <path
+      d="M34.3506 14.1572C35.6796 12.8213 36.4113 11.0441 36.4113 9.15557C36.4113 7.26703 35.6796 5.48978 34.3506 4.15389C31.6055 1.39463 27.1437 1.39861 24.3987 4.15389L17.8762 10.7101L15.9341 12.6623L14.4904 14.1135C14.4587 14.1453 14.4271 14.185 14.3954 14.2168C14.3559 14.2606 14.3125 14.3043 14.2769 14.348C14.2452 14.3878 14.2174 14.4276 14.1858 14.4713C14.1541 14.515 14.1185 14.5588 14.0869 14.6065C14.0671 14.6383 14.0513 14.6701 14.0316 14.7019C13.996 14.7615 13.9604 14.8172 13.9287 14.8808C13.9169 14.9007 13.9129 14.9166 13.901 14.9365C13.8615 15.012 13.8259 15.0876 13.7942 15.1671C13.7942 15.1671 13.7942 15.1751 13.7942 15.179C13.4145 16.1293 13.5095 17.2266 14.0791 18.1013C14.0791 18.1053 14.0829 18.1092 14.0869 18.1132C14.1344 18.1887 14.1898 18.2563 14.2452 18.3279C14.257 18.3438 14.265 18.3557 14.2769 18.3716C14.3401 18.4511 14.4073 18.5267 14.4824 18.5983C14.4824 18.5983 14.4904 18.6062 14.4943 18.6102L14.5181 18.634C15.0402 19.1628 15.7166 19.4809 16.4444 19.5525C16.5473 19.5644 16.654 19.5684 16.7608 19.5684C16.8676 19.5684 16.9704 19.5644 17.0733 19.5525C17.097 19.5525 17.1247 19.5445 17.1484 19.5406C17.2275 19.5326 17.3066 19.5206 17.3818 19.5047C17.4253 19.4968 17.4649 19.4849 17.5084 19.4729C17.5677 19.457 17.6231 19.4451 17.6824 19.4292C17.7299 19.4133 17.7774 19.3934 17.8248 19.3775C17.8723 19.3616 17.9237 19.3457 17.9711 19.3258C18.0186 19.306 18.0622 19.2821 18.1096 19.2582C18.1571 19.2344 18.2045 19.2145 18.248 19.1907C18.2955 19.1668 18.339 19.135 18.3865 19.1071C18.43 19.0833 18.4735 19.0595 18.5131 19.0316C18.5605 18.9998 18.6 18.968 18.6435 18.9322C18.6831 18.9004 18.7227 18.8766 18.7622 18.8448C18.8018 18.813 18.8374 18.7772 18.877 18.7414C18.9165 18.7056 18.96 18.6698 18.9956 18.634C19.8381 17.8309 20.9416 17.3896 22.1085 17.3896C22.8917 17.3896 23.6591 17.5923 24.3275 17.974C24.6796 18.1688 25.0118 18.4233 25.3124 18.7215C25.4311 18.8408 25.5379 18.9641 25.6407 19.0953C25.8267 19.3259 25.9888 19.5724 26.1273 19.8387C26.1708 19.9183 26.2063 20.0018 26.2458 20.0852C26.2538 20.1051 26.2617 20.129 26.2736 20.1489C26.3012 20.2125 26.325 20.2721 26.3487 20.3357C26.3606 20.3675 26.3724 20.4033 26.3804 20.4351C26.4001 20.4868 26.416 20.5385 26.4358 20.5942C26.4477 20.6299 26.4555 20.6697 26.4674 20.7055C26.4832 20.7571 26.4951 20.8049 26.5109 20.8565C26.5188 20.8963 26.5268 20.9361 26.5347 20.9758C26.5465 21.0235 26.5583 21.0752 26.5663 21.1229C26.5742 21.1627 26.5781 21.2064 26.586 21.2462C26.594 21.2939 26.6019 21.3416 26.6058 21.3933C26.6098 21.437 26.6138 21.4768 26.6177 21.5205C26.6217 21.5682 26.6296 21.6159 26.6296 21.6637C26.6296 21.7074 26.6296 21.7511 26.6336 21.7948C26.6336 21.8346 26.6375 21.8784 26.6375 21.9181L34.3544 14.1612L34.3506 14.1572Z"
+      fill="#0048DB"
+    />
+  </svg>
+</Logo>

package/astro/Logo/ac/Badget.astro

@@ -0,0 +1,24 @@
+---
+import Logo from '../index.astro'
+import type { HTMLAttributes } from 'astro/types'
+
+export type Props = HTMLAttributes<'div'>
+---
+
+<Logo label="Acordo Certo" {...Astro.props}>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="40"
+    height="29"
+    fill="none"
+    viewBox="0 0 40 29">
+    <path
+      fill="#02BEDF"
+      d="M8.0347 4.7217c-2.021 0-4.024.7235-5.5637 2.184C.8995 8.3974.023 10.4028.0003 12.551c-.0182 2.1483.822 4.167 2.3662 5.6856l7.9074 7.7757c4.0513 3.9839 10.6414 3.9839 14.6927 0l1.1809-1.1612c.6903-.6788 1.0672-1.5811 1.0672-2.5413 0-.5761-.1407-1.1523-.4132-1.6614a3.3063 3.3063 0 0 0-.4133-.6119c-.0772-.0938-.1544-.1831-.2407-.268a3.4817 3.4817 0 0 0-.6677-.5136c-.0408-.0268-.0817-.0491-.1226-.0715a3.669 3.669 0 0 0-1.7896-.4645c-.9764 0-1.8939.3752-2.5842 1.0496a5.2128 5.2128 0 0 1-2.5797 1.3041 5.5357 5.5357 0 0 1-.9856.0894c-1.3852 0-2.6842-.5315-3.6652-1.4918l-.0137-.0133-.0136-.0134c-.0273-.0268-.0499-.0537-.0726-.076a2.221 2.221 0 0 1-.1045-.1072.4603.4603 0 0 1-.0454-.0536c-.0409-.0491-.0864-.0937-.1272-.1429-.0046-.0044-.0091-.0134-.0137-.0178-.7448-.9022-1.1491-2.0188-1.1491-3.1979 0-1.0049.2953-1.9607.8403-2.7825.0046-.0089.0091-.0133.0137-.0223.0363-.0536.0726-.1027.109-.1563.0136-.0179.0272-.0402.0409-.0581l.0953-.1205c.0227-.0268.0454-.0581.0681-.0849l.0817-.0938c.0318-.0357.0592-.067.091-.1027.0363-.0402.0726-.0759.109-.1117.0227-.0223.0453-.0491.068-.0714l2.7932-2.7513-2.6296-2.586c-1.6123-1.5855-3.7471-2.385-5.8635-2.385"
+    />
+    <path
+      fill="#0048DB"
+      d="M37.634 13.5601c1.526-1.5006 2.3662-3.497 2.3662-5.6185S39.16 3.8236 37.634 2.323c-3.152-3.0996-8.2753-3.0951-11.4273 0L18.7173 9.688l-2.23 2.1929-1.6578 1.6302c-.0363.0357-.0727.0804-.109.1161-.0454.0492-.0953.0983-.1362.1474-.0363.0447-.0682.0894-.1045.1385-.0364.0491-.0772.0982-.1136.1518-.0227.0357-.0408.0715-.0635.1072-.0409.067-.0818.1295-.1181.201-.0136.0223-.0182.0402-.0318.0625a2.701 2.701 0 0 0-.1227.2591v.0133c-.436 1.0675-.3269 2.3002.3271 3.2828 0 .0044.0045.0089.009.0133.0545.0849.1182.1608.1818.2412.0136.0179.0227.0313.0363.0491.0727.0894.1498.1743.2361.2547l.0136.0133.0273.0268c.5995.594 1.3762.9513 2.2119 1.0317.1181.0134.2406.0179.3633.0179.1226 0 .2407-.0045.3588-.0179.0272 0 .0591-.0089.0864-.0133a2.5849 2.5849 0 0 0 .2679-.0403c.0499-.0089.0954-.0223.1453-.0357.0682-.0179.1317-.0312.1999-.0491.0545-.0179.109-.0402.1635-.0581.0545-.0178.1135-.0357.168-.058.0545-.0224.1045-.0492.159-.076.0545-.0268.1089-.0491.1589-.0759.0545-.0268.1045-.0625.159-.0938.05-.0268.1-.0536.1454-.0848a1.8732 1.8732 0 0 0 .1498-.1117c.0454-.0357.0908-.0625.1363-.0982.0454-.0358.0863-.076.1317-.1162.0454-.0402.0954-.0804.1363-.1206.9674-.9021 2.2345-1.3979 3.5743-1.3979.8993 0 1.7804.2278 2.548.6565.4042.2189.7857.5047 1.1309.8397.1363.134.2589.2725.377.4198.2135.2591.3997.536.5586.8352.05.0894.0909.1831.1363.2769.0091.0224.0181.0491.0317.0715.0318.0714.059.1384.0863.2099.0136.0357.0273.0759.0364.1117.0227.058.0409.116.0636.1786.0136.0402.0226.0848.0363.125.0181.0581.0318.1117.05.1698l.0273.134c.0136.0536.0271.1116.0362.1652.0091.0447.0137.0938.0227.1384.0091.0536.0182.1072.0228.1653.0045.0491.0091.0938.0136.1429.0046.0536.0137.1072.0137.1608 0 .0492 0 .0983.0045.1474 0 .0447.0045.0938.0045.1385l8.8611-8.7137-.0045-.0045Z"
+    />
+  </svg>
+</Logo>