@gyramais/gyra-design 0.2.1 → 0.2.21

package/dist/components/TourGuide/TourGuide.d.ts

@@ -0,0 +1,39 @@
+import React from 'react';
+import './index.css';
+export type TourStep = {
+    title: string;
+    body: string;
+    targetSelector: string;
+    navSection?: string;
+    padding?: number;
+    /**
+     * Como alinhar o alvo ao rolar. 'center' (padrão para alvos pequenos) é
+     * imune à altura de toolbars fixas. 'start' é melhor para seções altas.
+     * 'nearest' rola o mínimo possível (bom para elementos flutuantes/portais
+     * que já estão visíveis, como dropdowns). Se omitido, decidimos pela altura.
+     */
+    scrollBlock?: 'start' | 'center' | 'nearest';
+    /**
+     * Efeito colateral ao ENTRAR no passo, disparado depois da navegação e do
+     * mount da seção (ex.: abrir um dropdown para destacá-lo). Use junto com
+     * targetSelector apontando para o conteúdo revelado.
+     */
+    onEnter?: () => void;
+    /** Limpeza ao SAIR do passo (ex.: fechar o dropdown aberto no onEnter). */
+    onLeave?: () => void;
+};
+export type TourGuideProps = {
+    steps: TourStep[];
+    visible: boolean;
+    onClose: () => void;
+    onNavigate?: (navSection: string) => void;
+    /**
+     * Espaço (px) reservado no topo ao rolar alvos altos (block:'start') para que
+     * não fiquem atrás de toolbars fixas. Aceita número ou função (recalculada a
+     * cada passo) — use a função quando a altura da toolbar varia (wrap/mobile).
+     * Alvos pequenos usam block:'center' e ignoram esse valor. Padrão: 0.
+     */
+    scrollOffsetTop?: number | (() => number);
+    className?: string;
+};
+export declare function TourGuide({ steps, visible, onClose, onNavigate, scrollOffsetTop, className, }: TourGuideProps): React.JSX.Element | null;

package/dist/components/TourGuide/index.d.ts

@@ -0,0 +1 @@
+export * from './TourGuide';

package/dist/components/TourGuide/index.js

@@ -0,0 +1,7 @@
+"use client";import e,{useState as t,useCallback as r,useEffect as n}from"react";function i(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var a,o={exports:{}};
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/a=o,function(){var e={}.hasOwnProperty;function t(){for(var e="",t=0;t<arguments.length;t++){var i=arguments[t];i&&(e=n(e,r(i)))}return e}function r(r){if("string"==typeof r||"number"==typeof r)return r;if("object"!=typeof r)return"";if(Array.isArray(r))return t.apply(null,r);if(r.toString!==Object.prototype.toString&&!r.toString.toString().includes("[native code]"))return r.toString();var i="";for(var a in r)e.call(r,a)&&r[a]&&(i=n(i,a));return i}function n(e,t){return t?e?e+" "+t:e+t:e}a.exports?(t.default=t,a.exports=t):window.classNames=t}();var l=i(o.exports);const s=14;function c({steps:i,visible:a,onClose:o,onNavigate:c,scrollOffsetTop:u=0,className:d}){const[m,g]=t(0),[h,w]=t(null),[f,p]=t({w:1440,h:900}),y=i[m],v=r(()=>{if(!y?.targetSelector)return void w(null);const e=document.querySelector(y.targetSelector);if(!e)return void w(null);const t=e.getBoundingClientRect();if(0===t.width&&0===t.height)return void w(null);const r=y.padding??8;w({top:t.top-r,left:t.left-r,width:t.width+2*r,height:t.height+2*r})},[y]);n(()=>{const e=()=>p({w:window.innerWidth,h:window.innerHeight});return e(),window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[]),n(()=>{if(!a)return;const e=()=>v();return window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[a,v]),n(()=>{if(!a||!y)return;w(null),y.navSection&&c?.(y.navSection);const e=setTimeout(()=>y.onEnter?.(),180),t=setTimeout(()=>{const e=document.querySelector(y.targetSelector);if(!e)return;const t=e.getBoundingClientRect().height,r=y.scrollBlock??(t>.55*window.innerHeight?"start":"center");if("start"===r){const t="function"==typeof u?u():u;e.style.scrollMarginTop=`${t}px`}e.scrollIntoView({behavior:"smooth",block:r})},300),r=[550,800,1100].map(e=>setTimeout(v,e));return()=>{clearTimeout(e),clearTimeout(t),r.forEach(clearTimeout),y.onLeave?.()}},[m,a]),n(()=>{if(!a)return;const e=e=>{"Escape"!==e.key?("ArrowRight"===e.key&&g(e=>e>=i.length-1?(o(),e):e+1),"ArrowLeft"===e.key&&g(e=>Math.max(0,e-1))):o()};return window.addEventListener("keydown",e),()=>window.removeEventListener("keydown",e)},[a,i.length,o]),n(()=>{a&&g(0)},[a]);if(!a||!y)return null;const E=Math.min(380,f.w-28),_=f.h-28,b=(()=>{if(!h)return Math.max(s,f.h/2-140);const e=h.top+h.height+s;let t=e+240<=f.h?e:h.top-240-s;return t=Math.max(s,Math.min(t,f.h-160-s)),t})(),k=(()=>{if(!h)return Math.max(s,(f.w-E)/2);let e=h.left;return e+E>f.w-s&&(e=f.w-E-s),e<s&&(e=s),e})();return e.createElement("div",{className:l("gyramais-tourguide",d)},e.createElement("svg",{className:"gyramais-tourguide__overlay",viewBox:`0 0 ${f.w} ${f.h}`,preserveAspectRatio:"none","aria-hidden":"true",onClick:o},e.createElement("defs",null,e.createElement("mask",{id:"gyramais-tg-mask"},e.createElement("rect",{width:f.w,height:f.h,fill:"white"}),h&&e.createElement("rect",{x:h.left,y:h.top,width:h.width,height:h.height,rx:"10",fill:"black"}))),e.createElement("rect",{width:f.w,height:f.h,fill:"rgba(0,0,0,0.52)",mask:"url(#gyramais-tg-mask)"}),h&&e.createElement("rect",{x:h.left,y:h.top,width:h.width,height:h.height,rx:"10",fill:"none",stroke:"#1256ff",strokeWidth:"2",className:"gyramais-tourguide__spotlight-border"})),e.createElement("div",{className:"gyramais-tourguide__popover",style:{top:b,left:k,width:E,maxHeight:_},role:"dialog","aria-modal":"false","aria-label":y.title},e.createElement("div",{className:"gyramais-tourguide__step-badge"},"Passo ",m+1," de ",i.length),e.createElement("h3",{className:"gyramais-tourguide__title"},y.title),e.createElement("p",{className:"gyramais-tourguide__body"},y.body),e.createElement("div",{className:"gyramais-tourguide__footer"},e.createElement("div",{className:"gyramais-tourguide__dots"},i.map((t,r)=>e.createElement("button",{key:r,type:"button",className:l("gyramais-tourguide__dot",{"gyramais-tourguide__dot--active":r===m}),onClick:()=>g(r),"aria-label":`Ir para passo ${r+1}`}))),e.createElement("div",{className:"gyramais-tourguide__actions"},e.createElement("button",{type:"button",className:"gyramais-tourguide__btn-skip",onClick:o},"Sair"),m>0&&e.createElement("button",{type:"button",className:"gyramais-tourguide__btn-prev",onClick:()=>g(e=>Math.max(0,e-1))},"← Anterior"),e.createElement("button",{type:"button",className:"gyramais-tourguide__btn-next",onClick:()=>{m>=i.length-1?o():g(e=>e+1)}},m===i.length-1?"Concluir ✓":"Próximo →")))))}export{c as TourGuide};
+//# sourceMappingURL=index.js.map

package/dist/components/TourGuide/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../node_modules/classnames/index.js","../../../src/components/TourGuide/TourGuide.tsx"],"sourcesContent":["/*!\n\tCopyright (c) 2018 Jed Watson.\n\tLicensed under the MIT License (MIT), see\n\thttp://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = '';\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (arg) {\n\t\t\t\tclasses = appendClass(classes, parseValue(arg));\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction parseValue (arg) {\n\t\tif (typeof arg === 'string' || typeof arg === 'number') {\n\t\t\treturn arg;\n\t\t}\n\n\t\tif (typeof arg !== 'object') {\n\t\t\treturn '';\n\t\t}\n\n\t\tif (Array.isArray(arg)) {\n\t\t\treturn classNames.apply(null, arg);\n\t\t}\n\n\t\tif (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {\n\t\t\treturn arg.toString();\n\t\t}\n\n\t\tvar classes = '';\n\n\t\tfor (var key in arg) {\n\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\tclasses = appendClass(classes, key);\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction appendClass (value, newClass) {\n\t\tif (!newClass) {\n\t\t\treturn value;\n\t\t}\n\t\n\t\tif (value) {\n\t\t\treturn value + ' ' + newClass;\n\t\t}\n\t\n\t\treturn value + newClass;\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","'use client';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport classNames from 'classnames';\nimport './index.css';\n\nexport type TourStep = {\n  title: string;\n  body: string;\n  targetSelector: string;\n  navSection?: string;\n  padding?: number;\n  /**\n   * Como alinhar o alvo ao rolar. 'center' (padrão para alvos pequenos) é\n   * imune à altura de toolbars fixas. 'start' é melhor para seções altas.\n   * 'nearest' rola o mínimo possível (bom para elementos flutuantes/portais\n   * que já estão visíveis, como dropdowns). Se omitido, decidimos pela altura.\n   */\n  scrollBlock?: 'start' | 'center' | 'nearest';\n  /**\n   * Efeito colateral ao ENTRAR no passo, disparado depois da navegação e do\n   * mount da seção (ex.: abrir um dropdown para destacá-lo). Use junto com\n   * targetSelector apontando para o conteúdo revelado.\n   */\n  onEnter?: () => void;\n  /** Limpeza ao SAIR do passo (ex.: fechar o dropdown aberto no onEnter). */\n  onLeave?: () => void;\n};\n\ntype Rect = { top: number; left: number; width: number; height: number };\n\nexport type TourGuideProps = {\n  steps: TourStep[];\n  visible: boolean;\n  onClose: () => void;\n  onNavigate?: (navSection: string) => void;\n  /**\n   * Espaço (px) reservado no topo ao rolar alvos altos (block:'start') para que\n   * não fiquem atrás de toolbars fixas. Aceita número ou função (recalculada a\n   * cada passo) — use a função quando a altura da toolbar varia (wrap/mobile).\n   * Alvos pequenos usam block:'center' e ignoram esse valor. Padrão: 0.\n   */\n  scrollOffsetTop?: number | (() => number);\n  className?: string;\n};\n\nconst POPOVER_W = 380;\nconst DEFAULT_PAD = 8;\nconst GAP = 14;\n// Alvos mais altos que esta fração da viewport rolam por 'start' (topo), os\n// menores por 'center' (meio) — center é imune a toolbars fixas de qualquer\n// altura, resolvendo o spotlight caindo \"atrás\" do header em telas estreitas.\nconst TALL_RATIO = 0.55;\n\nexport function TourGuide({\n  steps,\n  visible,\n  onClose,\n  onNavigate,\n  scrollOffsetTop = 0,\n  className,\n}: TourGuideProps) {\n  const [stepIdx, setStepIdx] = useState(0);\n  const [rect, setRect] = useState<Rect | null>(null);\n  const [vp, setVp] = useState({ w: 1440, h: 900 });\n\n  const step = steps[stepIdx];\n\n  const measureTarget = useCallback(() => {\n    if (!step?.targetSelector) { setRect(null); return; }\n    const el = document.querySelector<HTMLElement>(step.targetSelector);\n    if (!el) { setRect(null); return; }\n    const r = el.getBoundingClientRect();\n    if (r.width === 0 && r.height === 0) { setRect(null); return; }\n    const pad = step.padding ?? DEFAULT_PAD;\n    setRect({\n      top: r.top - pad,\n      left: r.left - pad,\n      width: r.width + pad * 2,\n      height: r.height + pad * 2,\n    });\n  }, [step]);\n\n  // Acompanha o tamanho da viewport.\n  useEffect(() => {\n    const update = () => setVp({ w: window.innerWidth, h: window.innerHeight });\n    update();\n    window.addEventListener('resize', update);\n    return () => window.removeEventListener('resize', update);\n  }, []);\n\n  // Re-mede o alvo em resize/scroll (o spotlight precisa acompanhar).\n  useEffect(() => {\n    if (!visible) return;\n    const remeasure = () => measureTarget();\n    window.addEventListener('resize', remeasure);\n    window.addEventListener('scroll', remeasure, true);\n    return () => {\n      window.removeEventListener('resize', remeasure);\n      window.removeEventListener('scroll', remeasure, true);\n    };\n  }, [visible, measureTarget]);\n\n  // Ciclo de cada passo: navega -> (onEnter) -> rola -> mede (várias vezes).\n  useEffect(() => {\n    if (!visible || !step) return;\n    setRect(null);\n    if (step.navSection) onNavigate?.(step.navSection);\n\n    const tEnter = setTimeout(() => step.onEnter?.(), 180);\n    const tScroll = setTimeout(() => {\n      const el = document.querySelector<HTMLElement>(step.targetSelector);\n      if (!el) return;\n      const elH = el.getBoundingClientRect().height;\n      const block =\n        step.scrollBlock ?? (elH > window.innerHeight * TALL_RATIO ? 'start' : 'center');\n      if (block === 'start') {\n        const off =\n          typeof scrollOffsetTop === 'function' ? scrollOffsetTop() : scrollOffsetTop;\n        el.style.scrollMarginTop = `${off}px`;\n      }\n      el.scrollIntoView({ behavior: 'smooth', block });\n    }, 300);\n    // Mede em vários instantes: a seção pode revelar conteúdo após a navegação\n    // (toggle/dropdown) e o smooth-scroll leva tempo.\n    const measures = [550, 800, 1100].map((d) => setTimeout(measureTarget, d));\n\n    return () => {\n      clearTimeout(tEnter);\n      clearTimeout(tScroll);\n      measures.forEach(clearTimeout);\n      step.onLeave?.();\n    };\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [stepIdx, visible]);\n\n  // Navegação por teclado.\n  useEffect(() => {\n    if (!visible) return;\n    const handler = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') { onClose(); return; }\n      if (e.key === 'ArrowRight') {\n        setStepIdx((s) => {\n          if (s >= steps.length - 1) { onClose(); return s; }\n          return s + 1;\n        });\n      }\n      if (e.key === 'ArrowLeft') {\n        setStepIdx((s) => Math.max(0, s - 1));\n      }\n    };\n    window.addEventListener('keydown', handler);\n    return () => window.removeEventListener('keydown', handler);\n  }, [visible, steps.length, onClose]);\n\n  useEffect(() => {\n    if (visible) setStepIdx(0);\n  }, [visible]);\n\n  const goNext = () => {\n    if (stepIdx >= steps.length - 1) { onClose(); return; }\n    setStepIdx((s) => s + 1);\n  };\n  const goPrev = () => setStepIdx((s) => Math.max(0, s - 1));\n\n  if (!visible || !step) return null;\n\n  // Popover responsivo: nunca mais largo que a viewport (mobile).\n  const popW = Math.min(POPOVER_W, vp.w - GAP * 2);\n  const popMaxH = vp.h - GAP * 2;\n\n  const popTop = (() => {\n    if (!rect) return Math.max(GAP, vp.h / 2 - 140);\n    const below = rect.top + rect.height + GAP;\n    // Cabe abaixo do alvo?\n    let t = below + 240 <= vp.h ? below : rect.top - 240 - GAP;\n    // Mantém dentro da viewport.\n    t = Math.max(GAP, Math.min(t, vp.h - 160 - GAP));\n    return t;\n  })();\n  const popLeft = (() => {\n    if (!rect) return Math.max(GAP, (vp.w - popW) / 2);\n    let l = rect.left;\n    if (l + popW > vp.w - GAP) l = vp.w - popW - GAP;\n    if (l < GAP) l = GAP;\n    return l;\n  })();\n\n  return (\n    <div className={classNames('gyramais-tourguide', className)}>\n      <svg\n        className=\"gyramais-tourguide__overlay\"\n        viewBox={`0 0 ${vp.w} ${vp.h}`}\n        preserveAspectRatio=\"none\"\n        aria-hidden=\"true\"\n        onClick={onClose}\n      >\n        <defs>\n          <mask id=\"gyramais-tg-mask\">\n            <rect width={vp.w} height={vp.h} fill=\"white\" />\n            {rect && (\n              <rect\n                x={rect.left} y={rect.top}\n                width={rect.width} height={rect.height}\n                rx=\"10\" fill=\"black\"\n              />\n            )}\n          </mask>\n        </defs>\n        <rect\n          width={vp.w} height={vp.h}\n          fill=\"rgba(0,0,0,0.52)\"\n          mask=\"url(#gyramais-tg-mask)\"\n        />\n        {rect && (\n          <rect\n            x={rect.left} y={rect.top}\n            width={rect.width} height={rect.height}\n            rx=\"10\" fill=\"none\"\n            stroke=\"#1256ff\" strokeWidth=\"2\"\n            className=\"gyramais-tourguide__spotlight-border\"\n          />\n        )}\n      </svg>\n\n      <div\n        className=\"gyramais-tourguide__popover\"\n        style={{ top: popTop, left: popLeft, width: popW, maxHeight: popMaxH }}\n        role=\"dialog\"\n        aria-modal=\"false\"\n        aria-label={step.title}\n      >\n        <div className=\"gyramais-tourguide__step-badge\">\n          Passo {stepIdx + 1} de {steps.length}\n        </div>\n        <h3 className=\"gyramais-tourguide__title\">{step.title}</h3>\n        <p className=\"gyramais-tourguide__body\">{step.body}</p>\n        <div className=\"gyramais-tourguide__footer\">\n          <div className=\"gyramais-tourguide__dots\">\n            {steps.map((_, i) => (\n              <button\n                key={i}\n                type=\"button\"\n                className={classNames('gyramais-tourguide__dot', {\n                  'gyramais-tourguide__dot--active': i === stepIdx,\n                })}\n                onClick={() => setStepIdx(i)}\n                aria-label={`Ir para passo ${i + 1}`}\n              />\n            ))}\n          </div>\n          <div className=\"gyramais-tourguide__actions\">\n            <button type=\"button\" className=\"gyramais-tourguide__btn-skip\" onClick={onClose}>\n              Sair\n            </button>\n            {stepIdx > 0 && (\n              <button type=\"button\" className=\"gyramais-tourguide__btn-prev\" onClick={goPrev}>\n                ← Anterior\n              </button>\n            )}\n            <button type=\"button\" className=\"gyramais-tourguide__btn-next\" onClick={goNext}>\n              {stepIdx === steps.length - 1 ? 'Concluir ✓' : 'Próximo →'}\n            </button>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["hasOwn","hasOwnProperty","classNames","classes","i","arguments","length","arg","appendClass","parseValue","Array","isArray","apply","toString","Object","prototype","includes","key","call","value","newClass","module","exports","default","window","GAP","TourGuide","steps","visible","onClose","onNavigate","scrollOffsetTop","className","stepIdx","setStepIdx","useState","rect","setRect","vp","setVp","w","h","step","measureTarget","useCallback","targetSelector","el","document","querySelector","r","getBoundingClientRect","width","height","pad","padding","top","left","useEffect","update","innerWidth","innerHeight","addEventListener","removeEventListener","remeasure","navSection","tEnter","setTimeout","onEnter","tScroll","elH","block","scrollBlock","off","style","scrollMarginTop","scrollIntoView","behavior","measures","map","d","clearTimeout","forEach","onLeave","handler","e","s","Math","max","popW","min","popMaxH","popTop","below","t","popLeft","l","React","createElement","viewBox","preserveAspectRatio","onClick","id","fill","x","y","rx","mask","stroke","strokeWidth","maxHeight","role","title","body","_","type"],"mappings":";;;;;MAOC,WAGA,IAAIA,EAAS,CAAA,EAAGC,eAEhB,SAASC,IAGR,IAFA,IAAIC,EAAU,GAELC,EAAI,EAAGA,EAAIC,UAAUC,OAAQF,IAAK,CAC1C,IAAIG,EAAMF,UAAUD,GAChBG,IACHJ,EAAUK,EAAYL,EAASM,EAAWF,IAE9C,CAEE,OAAOJ,CACT,CAEC,SAASM,EAAYF,GACpB,GAAmB,iBAARA,GAAmC,iBAARA,EACrC,OAAOA,EAGR,GAAmB,iBAARA,EACV,MAAO,GAGR,GAAIG,MAAMC,QAAQJ,GACjB,OAAOL,EAAWU,MAAM,KAAML,GAG/B,GAAIA,EAAIM,WAAaC,OAAOC,UAAUF,WAAaN,EAAIM,SAASA,WAAWG,SAAS,iBACnF,OAAOT,EAAIM,WAGZ,IAAIV,EAAU,GAEd,IAAK,IAAIc,KAAOV,EACXP,EAAOkB,KAAKX,EAAKU,IAAQV,EAAIU,KAChCd,EAAUK,EAAYL,EAASc,IAIjC,OAAOd,CACT,CAEC,SAASK,EAAaW,EAAOC,GAC5B,OAAKA,EAIDD,EACIA,EAAQ,IAAMC,EAGfD,EAAQC,EAPPD,CAQV,CAEsCE,EAAOC,SAC3CpB,EAAWqB,QAAUrB,EACrBmB,UAAiBnB,GAOjBsB,OAAOtB,WAAaA,CAEtB,CArEA,sBCsCA,MAEMuB,EAAM,YAMIC,GAAUC,MACxBA,EAAKC,QACLA,EAAOC,QACPA,EAAOC,WACPA,EAAUC,gBACVA,EAAkB,EAACC,UACnBA,IAEA,MAAOC,EAASC,GAAcC,EAAS,IAChCC,EAAMC,GAAWF,EAAsB,OACvCG,EAAIC,GAASJ,EAAS,CAAEK,EAAG,KAAMC,EAAG,MAErCC,EAAOf,EAAMM,GAEbU,EAAgBC,EAAY,KAChC,IAAKF,GAAMG,eAAiC,YAAfR,EAAQ,MACrC,MAAMS,EAAKC,SAASC,cAA2BN,EAAKG,gBACpD,IAAKC,EAAqB,YAAfT,EAAQ,MACnB,MAAMY,EAAIH,EAAGI,wBACb,GAAgB,IAAZD,EAAEE,OAA4B,IAAbF,EAAEG,OAA+B,YAAff,EAAQ,MAC/C,MAAMgB,EAAMX,EAAKY,SA3BD,EA4BhBjB,EAAQ,CACNkB,IAAKN,EAAEM,IAAMF,EACbG,KAAMP,EAAEO,KAAOH,EACfF,MAAOF,EAAEE,MAAc,EAANE,EACjBD,OAAQH,EAAEG,OAAe,EAANC,KAEpB,CAACX,IAGJe,EAAU,KACR,MAAMC,EAAS,IAAMnB,EAAM,CAAEC,EAAGhB,OAAOmC,WAAYlB,EAAGjB,OAAOoC,cAG7D,OAFAF,IACAlC,OAAOqC,iBAAiB,SAAUH,GAC3B,IAAMlC,OAAOsC,oBAAoB,SAAUJ,IACjD,IAGHD,EAAU,KACR,IAAK7B,EAAS,OACd,MAAMmC,EAAY,IAAMpB,IAGxB,OAFAnB,OAAOqC,iBAAiB,SAAUE,GAClCvC,OAAOqC,iBAAiB,SAAUE,GAAW,GACtC,KACLvC,OAAOsC,oBAAoB,SAAUC,GACrCvC,OAAOsC,oBAAoB,SAAUC,GAAW,KAEjD,CAACnC,EAASe,IAGbc,EAAU,KACR,IAAK7B,IAAYc,EAAM,OACvBL,EAAQ,MACJK,EAAKsB,YAAYlC,IAAaY,EAAKsB,YAEvC,MAAMC,EAASC,WAAW,IAAMxB,EAAKyB,YAAa,KAC5CC,EAAUF,WAAW,KACzB,MAAMpB,EAAKC,SAASC,cAA2BN,EAAKG,gBACpD,IAAKC,EAAI,OACT,MAAMuB,EAAMvB,EAAGI,wBAAwBE,OACjCkB,EACJ5B,EAAK6B,cAAgBF,EA/DV,IA+DgB7C,OAAOoC,YAA2B,QAAU,UACzE,GAAc,UAAVU,EAAmB,CACrB,MAAME,EACuB,mBAApBzC,EAAiCA,IAAoBA,EAC9De,EAAG2B,MAAMC,gBAAkB,GAAGF,KAChC,CACA1B,EAAG6B,eAAe,CAAEC,SAAU,SAAUN,WACvC,KAGGO,EAAW,CAAC,IAAK,IAAK,MAAMC,IAAKC,GAAMb,WAAWvB,EAAeoC,IAEvE,MAAO,KACLC,aAAaf,GACbe,aAAaZ,GACbS,EAASI,QAAQD,cACjBtC,EAAKwC,cAGN,CAACjD,EAASL,IAGb6B,EAAU,KACR,IAAK7B,EAAS,OACd,MAAMuD,EAAWC,IACD,WAAVA,EAAEnE,KACQ,eAAVmE,EAAEnE,KACJiB,EAAYmD,GACNA,GAAK1D,EAAMrB,OAAS,GAAKuB,IAAkBwD,GACxCA,EAAI,GAGD,cAAVD,EAAEnE,KACJiB,EAAYmD,GAAMC,KAAKC,IAAI,EAAGF,EAAI,KARVxD,KAY5B,OADAL,OAAOqC,iBAAiB,UAAWsB,GAC5B,IAAM3D,OAAOsC,oBAAoB,UAAWqB,IAClD,CAACvD,EAASD,EAAMrB,OAAQuB,IAE3B4B,EAAU,KACJ7B,GAASM,EAAW,IACvB,CAACN,IAQJ,IAAKA,IAAYc,EAAM,OAAO,KAG9B,MAAM8C,EAAOF,KAAKG,IA1HF,IA0HiBnD,EAAGE,EAAIf,IAClCiE,EAAUpD,EAAGG,EAAIhB,GAEjBkE,EAAS,MACb,IAAKvD,EAAM,OAAOkD,KAAKC,IAAI9D,EAAKa,EAAGG,EAAI,EAAI,KAC3C,MAAMmD,EAAQxD,EAAKmB,IAAMnB,EAAKgB,OAAS3B,EAEvC,IAAIoE,EAAID,EAAQ,KAAOtD,EAAGG,EAAImD,EAAQxD,EAAKmB,IAAM,IAAM9B,EAGvD,OADAoE,EAAIP,KAAKC,IAAI9D,EAAK6D,KAAKG,IAAII,EAAGvD,EAAGG,EAAI,IAAMhB,IACpCoE,CACR,EARc,GASTC,EAAU,MACd,IAAK1D,EAAM,OAAOkD,KAAKC,IAAI9D,GAAMa,EAAGE,EAAIgD,GAAQ,GAChD,IAAIO,EAAI3D,EAAKoB,KAGb,OAFIuC,EAAIP,EAAOlD,EAAGE,EAAIf,IAAKsE,EAAIzD,EAAGE,EAAIgD,EAAO/D,GACzCsE,EAAItE,IAAKsE,EAAItE,GACVsE,CACR,EANe,GAQhB,OACEC,uBAAKhE,UAAW9B,EAAW,qBAAsB8B,IAC/CgE,EAAAC,cAAA,MAAA,CACEjE,UAAU,8BACVkE,QAAS,OAAO5D,EAAGE,KAAKF,EAAGG,IAC3B0D,oBAAoB,qBACR,OACZC,QAASvE,GAETmE,EAAAC,cAAA,OAAA,KACED,EAAAC,cAAA,OAAA,CAAMI,GAAG,oBACPL,EAAAC,cAAA,OAAA,CAAM9C,MAAOb,EAAGE,EAAGY,OAAQd,EAAGG,EAAG6D,KAAK,UACrClE,GACC4D,EAAAC,cAAA,OAAA,CACEM,EAAGnE,EAAKoB,KAAMgD,EAAGpE,EAAKmB,IACtBJ,MAAOf,EAAKe,MAAOC,OAAQhB,EAAKgB,OAChCqD,GAAG,KAAKH,KAAK,YAKrBN,EAAAC,cAAA,OAAA,CACE9C,MAAOb,EAAGE,EAAGY,OAAQd,EAAGG,EACxB6D,KAAK,mBACLI,KAAK,2BAENtE,GACC4D,EAAAC,cAAA,OAAA,CACEM,EAAGnE,EAAKoB,KAAMgD,EAAGpE,EAAKmB,IACtBJ,MAAOf,EAAKe,MAAOC,OAAQhB,EAAKgB,OAChCqD,GAAG,KAAKH,KAAK,OACbK,OAAO,UAAUC,YAAY,IAC7B5E,UAAU,0CAKhBgE,EAAAC,cAAA,MAAA,CACEjE,UAAU,8BACVyC,MAAO,CAAElB,IAAKoC,EAAQnC,KAAMsC,EAAS3C,MAAOqC,EAAMqB,UAAWnB,GAC7DoB,KAAK,SAAQ,aACF,QAAO,aACNpE,EAAKqE,OAEjBf,EAAAC,cAAA,MAAA,CAAKjE,UAAU,2CACNC,EAAU,SAAON,EAAMrB,QAEhC0F,EAAAC,cAAA,KAAA,CAAIjE,UAAU,6BAA6BU,EAAKqE,OAChDf,EAAAC,cAAA,IAAA,CAAGjE,UAAU,4BAA4BU,EAAKsE,MAC9ChB,EAAAC,cAAA,MAAA,CAAKjE,UAAU,8BACbgE,EAAAC,cAAA,MAAA,CAAKjE,UAAU,4BACZL,EAAMmD,IAAI,CAACmC,EAAG7G,IACb4F,EAAAC,cAAA,SAAA,CACEhF,IAAKb,EACL8G,KAAK,SACLlF,UAAW9B,EAAW,0BAA2B,CAC/C,kCAAmCE,IAAM6B,IAE3CmE,QAAS,IAAMlE,EAAW9B,GAAE,aAChB,iBAAiBA,EAAI,QAIvC4F,EAAAC,cAAA,MAAA,CAAKjE,UAAU,+BACbgE,EAAAC,cAAA,SAAA,CAAQiB,KAAK,SAASlF,UAAU,+BAA+BoE,QAASvE,GAAO,QAG9EI,EAAU,GACT+D,EAAAC,cAAA,SAAA,CAAQiB,KAAK,SAASlF,UAAU,+BAA+BoE,QA7F5D,IAAMlE,EAAYmD,GAAMC,KAAKC,IAAI,EAAGF,EAAI,mBAiG7CW,EAAAC,cAAA,SAAA,CAAQiB,KAAK,SAASlF,UAAU,+BAA+BoE,QArG1D,KACTnE,GAAWN,EAAMrB,OAAS,EAAKuB,IACnCK,EAAYmD,GAAMA,EAAI,KAoGXpD,IAAYN,EAAMrB,OAAS,EAAI,aAAe,gBAO7D","x_google_ignoreList":[0]}

package/dist/index.css

@@ -746,6 +746,9 @@ video {
      -moz-user-select: none;
           user-select: none;
 }
+.resize {
+  resize: both;
+}
 .flex-col {
   flex-direction: column;
 }
@@ -904,9 +907,6 @@ video {
 .font-semibold {
   font-weight: 600;
 }
-.uppercase {
-  text-transform: uppercase;
-}
 .italic {
   font-style: italic;
 }
@@ -920,6 +920,9 @@ video {
   --tw-text-opacity: 1;
   color: rgb(59 57 64 / var(--tw-text-opacity, 1));
 }
+.text-\[var\(--color-text-secondary\)\] {
+  color: var(--color-text-secondary);
+}
 .text-\[var\(--primary-button-color\)\] {
   color: var(--primary-button-color);
 }
@@ -950,9 +953,6 @@ video {
   outline: 2px solid transparent;
   outline-offset: 2px;
 }
-.outline {
-  outline-style: solid;
-}
 .blur {
   --tw-blur: blur(8px);
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
@@ -3881,204 +3881,6 @@ h6 {
   stroke: transparent;
 }
 
-.gyramais-ai-parecer {
-  background: linear-gradient(
-    180deg,
-    rgba(124, 78, 255, 0.045) 0%,
-    rgba(18, 86, 255, 0.035) 100%
-  );
-  border: 1px solid rgba(124, 78, 255, 0.18);
-  border-radius: 12px;
-  padding: 14px 16px;
-}
-
-.gyramais-ai-parecer__header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 8px;
-}
-
-.gyramais-ai-parecer__badge {
-  display: inline-flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.gyramais-ai-parecer__badge-icon {
-  width: 22px;
-  height: 22px;
-  border-radius: 50%;
-  background: linear-gradient(135deg, #7c4eff, #1256ff);
-  color: #fff;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 13px;
-  line-height: 1;
-}
-
-.gyramais-ai-parecer__badge-label {
-  font-size: 11px;
-  font-weight: 700;
-  letter-spacing: 0.06em;
-  text-transform: uppercase;
-  color: #6635e0;
-}
-
-.gyramais-ai-parecer__meta {
-  display: inline-flex;
-  align-items: center;
-  gap: 8px;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-}
-
-.gyramais-ai-parecer__score {
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-  font-size: 11px;
-  font-weight: 600;
-  padding: 4px 10px;
-  border-radius: 999px;
-  white-space: nowrap;
-  background: rgba(18, 86, 255, 0.1);
-  color: #1256ff;
-}
-
-.gyramais-ai-parecer__score strong {
-  font-weight: 700;
-}
-
-.gyramais-ai-parecer__verdict {
-  font-size: 11px;
-  font-weight: 700;
-  letter-spacing: 0.04em;
-  text-transform: uppercase;
-  padding: 4px 10px;
-  border-radius: 999px;
-  white-space: nowrap;
-}
-
-.gyramais-ai-parecer__verdict--info {
-  background: rgba(124, 78, 255, 0.12);
-  color: #6635e0;
-}
-
-.gyramais-ai-parecer__verdict--success {
-  background: rgba(52, 199, 89, 0.18);
-  color: #1a7d37;
-}
-
-.gyramais-ai-parecer__verdict--warning {
-  background: rgba(255, 159, 10, 0.2);
-  color: #946200;
-}
-
-.gyramais-ai-parecer__verdict--danger {
-  background: rgba(255, 59, 48, 0.18);
-  color: #c93430;
-}
-
-.gyramais-ai-parecer__body {
-  margin-top: 12px;
-  display: flex;
-  flex-direction: column;
-  gap: 14px;
-}
-
-.gyramais-ai-parecer__topic {
-  display: flex;
-  gap: 12px;
-  align-items: flex-start;
-}
-
-.gyramais-ai-parecer__topic-icon {
-  flex-shrink: 0;
-}
-
-.gyramais-ai-parecer__topic-body {
-  width: 100%;
-}
-
-.gyramais-ai-parecer__topic-label {
-  display: block;
-  font-weight: 600;
-  font-size: 14px;
-  color: var(--dark-text-color, #1f2430);
-}
-
-.gyramais-ai-parecer__topic-content {
-  color: #626976;
-  font-size: 14px;
-  line-height: 1.55;
-  white-space: pre-line;
-  margin-top: 2px;
-}
-
-.gyramais-ai-parecer__foot {
-  margin-top: 12px;
-  padding-top: 10px;
-  border-top: 1px dashed rgba(124, 78, 255, 0.18);
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  flex-wrap: wrap;
-  font-size: 11px;
-  color: #8a8f9c;
-}
-
-.gyramais-ai-parecer__src {
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-}
-
-.gyramais-ai-parecer__src-icon {
-  flex-shrink: 0;
-}
-
-.gyramais-ai-parecer__actions {
-  margin-left: auto;
-  display: inline-flex;
-  align-items: center;
-  gap: 4px;
-}
-
-.gyramais-ai-parecer__btn {
-  width: 22px;
-  height: 22px;
-  border: none;
-  background: transparent;
-  cursor: pointer;
-  border-radius: 6px;
-  color: #8a8f9c;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  transition:
-    background 0.2s cubic-bezier(0.25, 0.1, 0.25, 1),
-    color 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
-}
-
-.gyramais-ai-parecer__btn:hover {
-  background: rgba(124, 78, 255, 0.1);
-  color: #6635e0;
-}
-
-.gyramais-ai-parecer__btn--active {
-  background: rgba(124, 78, 255, 0.14);
-  color: #6635e0;
-}
-
-.gyramais-ai-parecer__btn svg,
-.gyramais-ai-parecer__btn .material-symbols-outlined {
-  font-size: 14px;
-  width: 14px;
-  height: 14px;
-}
-
 .gyramais-avatar {
     display: flex;
     align-items: center;
@@ -4314,6 +4116,23 @@ h6 {
   display: flex;
   flex-direction: column;
 }
+/* Variante com mídia (ícone/badge): mídia à esquerda, texto à direita. */
+.gyramais-card .gyramais-card-header-left.with-media {
+  flex-direction: row;
+  align-items: center;
+  gap: 0.75rem;
+}
+.gyramais-card .gyramais-card-header-media {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+}
+.gyramais-card .gyramais-card-header-text {
+  display: flex;
+  min-width: 0px;
+  flex-direction: column;
+}
 .gyramais-card:not(.gyramais-card-disabled)
   .gyramais-card-header-left.with-collapse {
   cursor: pointer;
@@ -9206,22 +9025,6 @@ h6 {
   color: var(--color-text-tertiary);
 }
 
-/* ── Group (categorias: Cargos, Pessoas, ...) ─────────────────────── */
-.gyramais-multi-select-picker-group + .gyramais-multi-select-picker-group {
-  margin-top: 2px;
-}
-.gyramais-multi-select-picker-group-head {
-  padding-left: 14px;
-  padding-right: 14px;
-  padding-top: 10px;
-  padding-bottom: 4px;
-  font-size: 10.5px;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 0.07em;
-  color: var(--color-text-tertiary);
-}
-
 /* ── Footer overrides ─────────────────────────────────────────────── */
 .gyramais-multi-select-picker-count {
   font-family: var(--font-mono);
@@ -10519,3 +10322,164 @@ h6 {
   .gyramais-step-sub-title {
     font-size: 0.875rem;
     line-height: 1.25rem}}
+
+/* TourGuide — spotlight overlay + popover flutuante.
+   z-index 9998/9999 pra ficar acima de drawers, modais, tooltips etc. */
+
+.gyramais-tourguide {
+  position: fixed;
+  inset: 0;
+  z-index: 9998;
+  pointer-events: none;
+}
+
+.gyramais-tourguide__overlay {
+  position: fixed;
+  inset: 0;
+  width: 100vw;
+  height: 100vh;
+  pointer-events: auto;
+  cursor: pointer;
+}
+
+.gyramais-tourguide__spotlight-border {
+  animation: gyramais-tg-pulse 2.4s ease-in-out infinite;
+}
+
+@keyframes gyramais-tg-pulse {
+  0%, 100% { opacity: 1; }
+  50%       { opacity: 0.4; }
+}
+
+/* ── Popover ── */
+.gyramais-tourguide__popover {
+  position: fixed;
+  background: #fff;
+  border: 1px solid var(--color-border-secondary, #e8e8ed);
+  border-radius: var(--radius-lg, 12px);
+  padding: 18px 20px 16px;
+  box-shadow:
+    0 8px 32px -4px rgba(0, 0, 0, 0.12),
+    0 2px 8px -2px rgba(0, 0, 0, 0.06);
+  z-index: 9999;
+  pointer-events: auto;
+  animation: gyramais-tg-in 180ms ease-out both;
+  /* Em telas baixas (mobile) o conteúdo rola dentro do card em vez de
+     vazar pra fora da viewport. maxHeight é setado inline pelo componente. */
+  overflow-y: auto;
+  box-sizing: border-box;
+}
+
+@keyframes gyramais-tg-in {
+  from { opacity: 0; transform: translateY(6px) scale(0.97); }
+  to   { opacity: 1; transform: translateY(0)  scale(1); }
+}
+
+.gyramais-tourguide__step-badge {
+  font-size: 10.5px;
+  font-weight: 700;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--gyra-blue, #1256ff);
+  margin-bottom: 7px;
+}
+
+.gyramais-tourguide__title {
+  font-size: 15px;
+  font-weight: 700;
+  color: var(--color-text-primary, #1d1d1f);
+  margin: 0 0 8px;
+  line-height: 1.3;
+}
+
+.gyramais-tourguide__body {
+  font-size: 13px;
+  color: var(--color-text-secondary, #636366);
+  line-height: 1.55;
+  margin: 0 0 16px;
+}
+
+/* ── Footer ── */
+.gyramais-tourguide__footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+}
+
+.gyramais-tourguide__dots {
+  display: flex;
+  gap: 5px;
+  align-items: center;
+}
+
+.gyramais-tourguide__dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 999px;
+  border: none;
+  background: var(--color-border-primary, #d2d2d7);
+  cursor: pointer;
+  padding: 0;
+  transition: all 200ms ease;
+  flex-shrink: 0;
+}
+
+.gyramais-tourguide__dot--active {
+  background: var(--gyra-blue, #1256ff);
+  width: 18px;
+}
+
+.gyramais-tourguide__actions {
+  display: flex;
+  gap: 6px;
+  align-items: center;
+}
+
+.gyramais-tourguide__btn-skip {
+  padding: 6px 10px;
+  border: none;
+  background: none;
+  color: var(--color-text-tertiary, #8e8e93);
+  font-size: 12.5px;
+  cursor: pointer;
+  border-radius: var(--radius-sm, 6px);
+  transition: color 150ms ease;
+  font-family: inherit;
+}
+.gyramais-tourguide__btn-skip:hover {
+  color: var(--color-text-secondary, #636366);
+}
+
+.gyramais-tourguide__btn-prev {
+  padding: 6px 12px;
+  border: 1.5px solid var(--color-border-secondary, #e8e8ed);
+  background: #fff;
+  color: var(--color-text-primary, #1d1d1f);
+  font-size: 12.5px;
+  font-weight: 600;
+  cursor: pointer;
+  border-radius: var(--radius-sm, 6px);
+  transition: background 150ms ease, border-color 150ms ease;
+  font-family: inherit;
+}
+.gyramais-tourguide__btn-prev:hover {
+  background: var(--color-surface-secondary, #fafafa);
+  border-color: var(--color-border-primary, #d2d2d7);
+}
+
+.gyramais-tourguide__btn-next {
+  padding: 6px 14px;
+  border: none;
+  background: var(--gyra-blue, #1256ff);
+  color: #fff;
+  font-size: 12.5px;
+  font-weight: 700;
+  cursor: pointer;
+  border-radius: var(--radius-sm, 6px);
+  transition: background 150ms ease;
+  font-family: inherit;
+}
+.gyramais-tourguide__btn-next:hover {
+  background: var(--gyra-blue-hover, #2f5dcb);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gyramais/gyra-design",
-  "version": "0.2.1",
+  "version": "0.2.21",
   "description": "Gyramais Design System",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",

package/dist/components/AiParecer/AiParecer.d.ts

@@ -1,75 +0,0 @@
-import React from "react";
-import "./index.css";
-export type AiParecerVerdictTone = "success" | "warning" | "danger" | "info";
-type AiParecerProps = {
-    id?: string;
-    className?: string;
-    /**
-     * Chip de veredito exibido a direita do badge (ex: "Risco médio").
-     * Opcional.
-     */
-    verdict?: React.ReactNode;
-    verdictTone?: AiParecerVerdictTone;
-    /**
-     * Score (ex: nota GYRA+ IA) exibido como pill a esquerda do chip de
-     * veredito. Aceita number ou node. Opcional.
-     */
-    score?: React.ReactNode;
-    /** Rotulo do score. Default: "Score GYRA+ IA". */
-    scoreLabel?: string;
-    /**
-     * Conteudo do parecer: tipicamente um ou mais `<AiParecer.Topic>`
-     * (Resumo Executivo, Pontos de Atenção e Risco, etc).
-     */
-    children?: React.ReactNode;
-    /**
-     * Fontes consultadas, exibidas no rodape com um icone de base de dados
-     * (ex: "Receita Federal · Quod · Serasa"). Opcional.
-     */
-    sources?: React.ReactNode;
-    /**
-     * Grau de confianca do parecer, exibido no rodape (ex: "96%" vira
-     * "Confiança 96%"). Aceita number ou node. Opcional.
-     */
-    confidence?: React.ReactNode;
-    /**
-     * Callbacks de feedback. Quando algum e' passado, o rodape mostra os
-     * botoes padrao (👍 / 👎 / regenerar) com icones SVG proprios — sem
-     * depender de nenhuma fonte de icone externa. O estado de "util/nao-util"
-     * fica destacado automaticamente.
-     */
-    onFeedbackUp?: () => void;
-    onFeedbackDown?: () => void;
-    onRegenerate?: () => void;
-    /**
-     * Acoes customizadas do rodape. Quando presente, SUBSTITUI os botoes de
-     * feedback padrao. Use a classe `gyramais-ai-parecer__btn` pro estilo.
-     */
-    actions?: React.ReactNode;
-    /**
-     * Rodape totalmente customizado. Quando presente, substitui o rodape
-     * padrao montado a partir de `sources` / `confidence` / acoes.
-     */
-    footer?: React.ReactNode;
-};
-type AiParecerTopicProps = {
-    className?: string;
-    label: React.ReactNode;
-    /** Icone a esquerda do topico (ex: <DescriptionOutlinedIcon />). */
-    icon?: React.ReactNode;
-    /** `warning` destaca o topico (fundo + icone em tom de alerta). */
-    tone?: "default" | "warning";
-    children?: React.ReactNode;
-};
-declare const AiParecerTopic: ({ className, label, icon, tone, children, }: AiParecerTopicProps) => React.JSX.Element;
-/**
- * Faixa padrao "Parecer GYRA+ IA" usada em todas as seções de parecer
- * gerado por IA (analise financeira etc). Badge roxo com gradiente, label
- * em uppercase e chip de veredito opcional. O conteudo (topicos) vem como
- * children. Use `AiParecer.Topic` para padronizar cada bloco.
- */
-declare const AiParecer: {
-    ({ id, className, verdict, verdictTone, score, scoreLabel, children, sources, confidence, onFeedbackUp, onFeedbackDown, onRegenerate, actions, footer, }: AiParecerProps): React.JSX.Element;
-    Topic: ({ className, label, icon, tone, children, }: AiParecerTopicProps) => React.JSX.Element;
-};
-export { AiParecer, AiParecerTopic };

package/dist/components/AiParecer/index.d.ts

@@ -1 +0,0 @@
-export * from "./AiParecer";

package/dist/components/AiParecer/index.js

@@ -1,7 +0,0 @@
-"use client";import e,{useState as a}from"react";function r(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var t,c={exports:{}};
-/*!
-	Copyright (c) 2018 Jed Watson.
-	Licensed under the MIT License (MIT), see
-	http://jedwatson.github.io/classnames
-*/t=c,function(){var e={}.hasOwnProperty;function a(){for(var e="",a=0;a<arguments.length;a++){var t=arguments[a];t&&(e=c(e,r(t)))}return e}function r(r){if("string"==typeof r||"number"==typeof r)return r;if("object"!=typeof r)return"";if(Array.isArray(r))return a.apply(null,r);if(r.toString!==Object.prototype.toString&&!r.toString.toString().includes("[native code]"))return r.toString();var t="";for(var n in r)e.call(r,n)&&r[n]&&(t=c(t,n));return t}function c(e,a){return a?e?e+" "+a:e+a:e}t.exports?(a.default=a,t.exports=a):window.classNames=a}();var n=r(c.exports);const i=({className:a,label:r,icon:t,tone:c="default",children:i})=>e.createElement("div",{className:n("gyramais-ai-parecer__topic",`gyramais-ai-parecer__topic--${c}`,a)},t&&e.createElement("div",{className:"gyramais-ai-parecer__topic-icon"},t),e.createElement("div",{className:"gyramais-ai-parecer__topic-body"},e.createElement("span",{className:"gyramais-ai-parecer__topic-label"},r),e.createElement("div",{className:"gyramais-ai-parecer__topic-content"},i??"-"))),l={width:14,height:14,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":!0},s=()=>e.createElement("svg",{className:"gyramais-ai-parecer__src-icon",...l,width:12,height:12},e.createElement("ellipse",{cx:"12",cy:"5",rx:"9",ry:"3"}),e.createElement("path",{d:"M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5"}),e.createElement("path",{d:"M3 12c0 1.66 4 3 9 3s9-1.34 9-3"})),m=()=>e.createElement("svg",{...l},e.createElement("path",{d:"M7 10v12"}),e.createElement("path",{d:"M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z"})),o=()=>e.createElement("svg",{...l},e.createElement("path",{d:"M17 14V2"}),e.createElement("path",{d:"M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z"})),p=()=>e.createElement("svg",{...l},e.createElement("path",{d:"M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"}),e.createElement("path",{d:"M21 3v5h-5"}),e.createElement("path",{d:"M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"}),e.createElement("path",{d:"M8 16H3v5"})),d=({id:r,className:t,verdict:c,verdictTone:i="info",score:l,scoreLabel:d="Score GYRA+ IA",children:_,sources:g,confidence:u,onFeedbackUp:y,onFeedbackDown:E,onRegenerate:v,actions:b,footer:h})=>{const[N,f]=a(null),w=null!=l&&""!==l,M=null!=c&&""!==c,k=null!=g&&""!==g,x=null!=u&&""!==u,A=null!=b&&""!==b,L=!(A||!y&&!E&&!v),S=k||x||A||L,C=L&&e.createElement(e.Fragment,null,y&&e.createElement("button",{type:"button",title:"Útil","aria-label":"Útil","aria-pressed":"up"===N,className:n("gyramais-ai-parecer__btn",{"gyramais-ai-parecer__btn--active":"up"===N}),onClick:()=>{f("up"),y()}},e.createElement(m,null)),E&&e.createElement("button",{type:"button",title:"Não útil","aria-label":"Não útil","aria-pressed":"down"===N,className:n("gyramais-ai-parecer__btn",{"gyramais-ai-parecer__btn--active":"down"===N}),onClick:()=>{f("down"),E()}},e.createElement(o,null)),v&&e.createElement("button",{type:"button",title:"Regenerar","aria-label":"Regenerar",className:"gyramais-ai-parecer__btn",onClick:v},e.createElement(p,null)));return e.createElement("div",{id:r,className:n("gyramais-ai-parecer",t)},e.createElement("div",{className:"gyramais-ai-parecer__header"},e.createElement("div",{className:"gyramais-ai-parecer__badge"},e.createElement("span",{className:"gyramais-ai-parecer__badge-icon"},"✦"),e.createElement("span",{className:"gyramais-ai-parecer__badge-label"},"Parecer GYRA+ IA")),(w||M)&&e.createElement("div",{className:"gyramais-ai-parecer__meta"},w&&e.createElement("span",{className:"gyramais-ai-parecer__score"},d,": ",e.createElement("strong",null,l)),M&&e.createElement("span",{className:n("gyramais-ai-parecer__verdict",`gyramais-ai-parecer__verdict--${i}`)},c))),e.createElement("div",{className:"gyramais-ai-parecer__body"},_),h?e.createElement("div",{className:"gyramais-ai-parecer__foot"},h):S&&e.createElement("div",{className:"gyramais-ai-parecer__foot"},k&&e.createElement("span",{className:"gyramais-ai-parecer__src"},e.createElement(s,null),g),x&&e.createElement("span",{className:"gyramais-ai-parecer__confidence"},"Confiança ",u),(A||L)&&e.createElement("div",{className:"gyramais-ai-parecer__actions"},A?b:C)))};d.Topic=i;export{d as AiParecer,i as AiParecerTopic};
-//# sourceMappingURL=index.js.map