negodesign 0.0.74 → 0.0.75

package/dist/index.d.ts

@@ -34,9 +34,22 @@ import Menu from "./components/ui/nav/ui/Menu.svelte";
 import PageLogin from "./components/pages/security/login/PageLogin.svelte";
 import SearchInput from "./components/ui/search/SearchInput.svelte";
 import Footer from "./components/ui/footer/ui/Footer.svelte";
+import SimpleHero from "./components/ui/hero/SimpleHero.svelte";
+import CardMedia from "./components/ui/card/core/media/CardMedia.svelte";
+import CardProfile from "./components/ui/card/core/profile/CardProfile.svelte";
 import NegoDesign from "./components/NegoDesign.svelte";
 import ItemsSimpleGrid from "./components/ui/grid/core/ui/ItemsSimpleGrid.svelte";
 import ItemsPanel from "./components/ui/grid/core/ui/ItemsPanel.svelte";
+import ModalGridSelection from "./components/ui/modal/grid/ui/ModalGridSelection.svelte";
+import ModalBadgeSelection from "./components/ui/modal/badge/ui/ModalBadgeSelection.svelte";
+import ModalShareSelection from "./components/ui/modal/share/ui/ModalShareSelection.svelte";
+import ModalNotification from "./components/ui/modal/notification/ui/ModalNotification.svelte";
+import ModalFeedback from "./components/ui/modal/feedback/ui/ModalFeedback.svelte";
+import ModalMap from "./components/ui/modal/map/ui/ModalMap.svelte";
+import ModalForm from "./components/ui/modal/form/ui/ModalForm.svelte";
+import ModalUpload from "./components/ui/modal/upload/ui/ModalUpload.svelte";
+import ModalCore from "./components/ui/modal/core/ui/ModalCore.svelte";
+import Form from "./components/ui/form/Form.svelte";
 /** Store reativa do idioma atual. Altere com `$locale = "pt"`. */
 export { locale } from "./i18n";
 /** Lista de idiomas disponíveis. Atualizado automaticamente. */
@@ -82,6 +95,137 @@ ItemsSimpleGrid,
  * @see GridProps
  */
 ItemsPanel, 
+/**
+ * Modal de seleção em grid com cards clicáveis, pagination dots e botões
+ * de navegação (Back/Continue). Primeira variação do sistema de modais.
+ * @property {string} title - Título principal do modal
+ * @property {string} subtitle - Subtítulo/descrição
+ * @property {ModelGridCard[]} cards - Lista de cards seleccionáveis
+ * @property {ModelGridCard | null} selectedCard - Card seleccionado (bindable)
+ * @property {number} totalSteps - Número total de passos (pagination dots)
+ * @property {number} currentStep - Passo actual
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(card) => void} onSelect - Callback ao seleccionar um card
+ * @property {() => void} onBack - Callback do botão Back
+ * @property {() => void} onContinue - Callback do botão Continue
+ * @see ModalGridSelectionProps
+ */
+ModalGridSelection, 
+/**
+ * Contentor base reutilizável para todos os modais.
+ * Fornece overlay, container com gradiente, cabeçalho, rodapé com progress bar e navegação.
+ * Suporta snippets personalizados para conteúdo e rodapé.
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {string} title - Título principal
+ * @property {string} subtitle - Subtítulo
+ * @property {Snippet} content - Conteúdo principal
+ * @property {Snippet} footer - Rodapé personalizado
+ * @see ModalCoreProps
+ */
+ModalCore, 
+/**
+ * Modal de seleção com badges/pills clicáveis, progress bar e botão Skip.
+ * Segunda variação do sistema de modais.
+ * @property {string} title - Título principal do modal
+ * @property {string} subtitle - Subtítulo/descrição
+ * @property {ModelBadge[]} badges - Lista de badges seleccionáveis
+ * @property {ModelBadge | null} selectedBadge - Badge seleccionado (bindable)
+ * @property {boolean} multiple - Permite seleção múltipla
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(badge) => void} onSelect - Callback ao seleccionar um badge
+ * @property {() => void} onContinue - Callback do botão Continue
+ * @property {() => void} onSkip - Callback do botão Skip
+ * @see ModalBadgeSelectionProps
+ */
+ModalBadgeSelection, 
+/**
+ * Modal de partilha em redes sociais com ícones clicáveis e campo de copiar link.
+ * Terceira variação do sistema de modais.
+ * @property {string} title - Título principal (ex: "Share this design")
+ * @property {ModelSocialShare[]} networks - Lista de redes sociais
+ * @property {string} linkValue - URL a partilhar/copiar
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(network) => void} onShare - Callback ao clicar numa rede social
+ * @property {(link) => void} onCopy - Callback ao copiar o link
+ * @see ModalShareSelectionProps
+ */
+ModalShareSelection, 
+/**
+ * Modal de subscrição/notificação por email com input e botão CTA.
+ * Quarta variação do sistema de modais.
+ * @property {string} title - Título principal
+ * @property {string} description - Texto descritivo
+ * @property {string} placeholder - Texto placeholder do input
+ * @property {string} buttonText - Texto do botão
+ * @property {boolean} isLoading - Estado de carregamento
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(email) => void} onSubmit - Callback ao submeter
+ * @see ModalNotificationProps
+ */
+ModalNotification, 
+/**
+ * Modal de feedback com editor de texto rico (bold, italic, underline, listas, alinhamento)
+ * e botão de adicionar imagem. Quinta variação do sistema de modais.
+ * @property {string} title - Título principal (default: "Your Feedback")
+ * @property {string} icon - Emoji/ícone ao lado do título
+ * @property {string} placeholder - Texto placeholder do editor
+ * @property {string} buttonText - Texto do botão Send
+ * @property {boolean} isLoading - Estado de carregamento
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(content, images) => void} onSubmit - Callback ao submeter
+ * @property {() => void} onAddImage - Callback ao clicar Add Image
+ * @see ModalFeedbackProps
+ */
+ModalFeedback, 
+/**
+ * Modal de seleção de localização com mapa, barra de pesquisa, popup de endereço
+ * e descrição. Sexta variação do sistema de modais.
+ * @property {string} title - Título do popup (default: "Location")
+ * @property {string} address - Endereço actual
+ * @property {string} description - Descrição da localização
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(query) => void} onSearch - Callback ao pesquisar
+ * @property {(address, description) => void} onApply - Callback ao aplicar
+ * @property {Snippet} mapSlot - Snippet personalizado para o mapa
+ * @see ModalMapProps
+ */
+ModalMap, 
+/**
+ * Formulário com grid responsivo de 2 colunas.
+ * Organiza inputs (text, email, password, date, phone, select, radio, checkbox, textarea)
+ * numa grid, onde cada campo pode ocupar 1 ou 2 colunas via prop `fill`.
+ * @property {FormInputConfig[]} inputs - Configuração dos inputs
+ * @property {(data) => void} onSubmit - Callback ao submeter
+ * @property {string} submitText - Texto do botão
+ * @property {boolean} isLoading - Estado de carregamento
+ * @property {1|2} columns - Número de colunas (padrão: 2)
+ * @see FormProps
+ */
+Form, 
+/**
+ * Formulário dentro de um modal. Reutiliza o componente Form com a mesma
+ * API de inputs, adicionando overlay, título e botões de navegação.
+ * @property {string} title - Título do modal
+ * @property {string} subtitle - Subtítulo do modal
+ * @property {FormInputConfig[]} inputs - Configuração dos inputs
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(data) => void} onSubmit - Callback ao submeter
+ * @property {() => void} onCancel - Callback ao cancelar
+ * @see ModalFormProps
+ */
+ModalForm, 
+/**
+ * Modal de upload de ficheiros com drag and drop, lista de ficheiros
+ * com progress bar e estados (uploading/completed/failed).
+ * @property {string} title - Título do modal (default: "Upload File")
+ * @property {string} accept - Tipos MIME aceites
+ * @property {UploadFile[]} files - Lista de ficheiros (bindable)
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(files) => void} onFilesSelected - Callback ao selecionar ficheiros
+ * @property {(files) => void} onUpload - Callback ao clicar Upload
+ * @see ModalUploadProps
+ */
+ModalUpload, 
 /**
  * Componente raiz do Negodesign.
  * Configura o tema, idioma e traduções da aplicação.
@@ -199,6 +343,31 @@ CarouselHero,
  * @see FooterProps
  */
 Footer, 
+/**
+ * Hero estático com layout dividido: coluna esquerda com conteúdo
+ * e coluna direita com imagem circular.
+ * @property {string} title - Título principal
+ * @property {string} subTitle - Subtítulo
+ * @property {string} description - Descrição
+ * @property {string} image - URL da imagem
+ * @see SimpleHero
+ */
+SimpleHero, 
+/**
+ * Wrapper para cards de mídia com variantes 1 (alinhado à esquerda) e 2 (centrado).
+ * Mostra logo, título, rating, tags e botões.
+ * @property {1|2} variant - Variante visual
+ * @property {CardMediaProps} - Props do card de mídia
+ * @see CardMediaProps
+ */
+CardMedia, 
+/**
+ * Wrapper para cards de perfil de organização/guia, com variantes 1 e 2.
+ * @property {1|2} variant - Variante visual
+ * @property {CardProfileProps} - Props do card de perfil
+ * @see CardProfileProps
+ */
+CardProfile, 
 /**
  * Carousel de cards de promoção com preços antigo/novo, botão de comprar,
  * favoritar e adicionar ao carrinho.

package/dist/index.js

@@ -34,9 +34,22 @@ import Menu from "./components/ui/nav/ui/Menu.svelte";
 import PageLogin from "./components/pages/security/login/PageLogin.svelte";
 import SearchInput from "./components/ui/search/SearchInput.svelte";
 import Footer from "./components/ui/footer/ui/Footer.svelte";
+import SimpleHero from "./components/ui/hero/SimpleHero.svelte";
+import CardMedia from "./components/ui/card/core/media/CardMedia.svelte";
+import CardProfile from "./components/ui/card/core/profile/CardProfile.svelte";
 import NegoDesign from "./components/NegoDesign.svelte";
 import ItemsSimpleGrid from "./components/ui/grid/core/ui/ItemsSimpleGrid.svelte";
 import ItemsPanel from "./components/ui/grid/core/ui/ItemsPanel.svelte";
+import ModalGridSelection from "./components/ui/modal/grid/ui/ModalGridSelection.svelte";
+import ModalBadgeSelection from "./components/ui/modal/badge/ui/ModalBadgeSelection.svelte";
+import ModalShareSelection from "./components/ui/modal/share/ui/ModalShareSelection.svelte";
+import ModalNotification from "./components/ui/modal/notification/ui/ModalNotification.svelte";
+import ModalFeedback from "./components/ui/modal/feedback/ui/ModalFeedback.svelte";
+import ModalMap from "./components/ui/modal/map/ui/ModalMap.svelte";
+import ModalForm from "./components/ui/modal/form/ui/ModalForm.svelte";
+import ModalUpload from "./components/ui/modal/upload/ui/ModalUpload.svelte";
+import ModalCore from "./components/ui/modal/core/ui/ModalCore.svelte";
+import Form from "./components/ui/form/Form.svelte";
 /** Store reativa do idioma atual. Altere com `$locale = "pt"`. */
 export { locale } from "./i18n";
 /** Lista de idiomas disponíveis. Atualizado automaticamente. */
@@ -82,6 +95,137 @@ ItemsSimpleGrid,
  * @see GridProps
  */
 ItemsPanel, 
+/**
+ * Modal de seleção em grid com cards clicáveis, pagination dots e botões
+ * de navegação (Back/Continue). Primeira variação do sistema de modais.
+ * @property {string} title - Título principal do modal
+ * @property {string} subtitle - Subtítulo/descrição
+ * @property {ModelGridCard[]} cards - Lista de cards seleccionáveis
+ * @property {ModelGridCard | null} selectedCard - Card seleccionado (bindable)
+ * @property {number} totalSteps - Número total de passos (pagination dots)
+ * @property {number} currentStep - Passo actual
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(card) => void} onSelect - Callback ao seleccionar um card
+ * @property {() => void} onBack - Callback do botão Back
+ * @property {() => void} onContinue - Callback do botão Continue
+ * @see ModalGridSelectionProps
+ */
+ModalGridSelection, 
+/**
+ * Contentor base reutilizável para todos os modais.
+ * Fornece overlay, container com gradiente, cabeçalho, rodapé com progress bar e navegação.
+ * Suporta snippets personalizados para conteúdo e rodapé.
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {string} title - Título principal
+ * @property {string} subtitle - Subtítulo
+ * @property {Snippet} content - Conteúdo principal
+ * @property {Snippet} footer - Rodapé personalizado
+ * @see ModalCoreProps
+ */
+ModalCore, 
+/**
+ * Modal de seleção com badges/pills clicáveis, progress bar e botão Skip.
+ * Segunda variação do sistema de modais.
+ * @property {string} title - Título principal do modal
+ * @property {string} subtitle - Subtítulo/descrição
+ * @property {ModelBadge[]} badges - Lista de badges seleccionáveis
+ * @property {ModelBadge | null} selectedBadge - Badge seleccionado (bindable)
+ * @property {boolean} multiple - Permite seleção múltipla
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(badge) => void} onSelect - Callback ao seleccionar um badge
+ * @property {() => void} onContinue - Callback do botão Continue
+ * @property {() => void} onSkip - Callback do botão Skip
+ * @see ModalBadgeSelectionProps
+ */
+ModalBadgeSelection, 
+/**
+ * Modal de partilha em redes sociais com ícones clicáveis e campo de copiar link.
+ * Terceira variação do sistema de modais.
+ * @property {string} title - Título principal (ex: "Share this design")
+ * @property {ModelSocialShare[]} networks - Lista de redes sociais
+ * @property {string} linkValue - URL a partilhar/copiar
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(network) => void} onShare - Callback ao clicar numa rede social
+ * @property {(link) => void} onCopy - Callback ao copiar o link
+ * @see ModalShareSelectionProps
+ */
+ModalShareSelection, 
+/**
+ * Modal de subscrição/notificação por email com input e botão CTA.
+ * Quarta variação do sistema de modais.
+ * @property {string} title - Título principal
+ * @property {string} description - Texto descritivo
+ * @property {string} placeholder - Texto placeholder do input
+ * @property {string} buttonText - Texto do botão
+ * @property {boolean} isLoading - Estado de carregamento
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(email) => void} onSubmit - Callback ao submeter
+ * @see ModalNotificationProps
+ */
+ModalNotification, 
+/**
+ * Modal de feedback com editor de texto rico (bold, italic, underline, listas, alinhamento)
+ * e botão de adicionar imagem. Quinta variação do sistema de modais.
+ * @property {string} title - Título principal (default: "Your Feedback")
+ * @property {string} icon - Emoji/ícone ao lado do título
+ * @property {string} placeholder - Texto placeholder do editor
+ * @property {string} buttonText - Texto do botão Send
+ * @property {boolean} isLoading - Estado de carregamento
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(content, images) => void} onSubmit - Callback ao submeter
+ * @property {() => void} onAddImage - Callback ao clicar Add Image
+ * @see ModalFeedbackProps
+ */
+ModalFeedback, 
+/**
+ * Modal de seleção de localização com mapa, barra de pesquisa, popup de endereço
+ * e descrição. Sexta variação do sistema de modais.
+ * @property {string} title - Título do popup (default: "Location")
+ * @property {string} address - Endereço actual
+ * @property {string} description - Descrição da localização
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(query) => void} onSearch - Callback ao pesquisar
+ * @property {(address, description) => void} onApply - Callback ao aplicar
+ * @property {Snippet} mapSlot - Snippet personalizado para o mapa
+ * @see ModalMapProps
+ */
+ModalMap, 
+/**
+ * Formulário com grid responsivo de 2 colunas.
+ * Organiza inputs (text, email, password, date, phone, select, radio, checkbox, textarea)
+ * numa grid, onde cada campo pode ocupar 1 ou 2 colunas via prop `fill`.
+ * @property {FormInputConfig[]} inputs - Configuração dos inputs
+ * @property {(data) => void} onSubmit - Callback ao submeter
+ * @property {string} submitText - Texto do botão
+ * @property {boolean} isLoading - Estado de carregamento
+ * @property {1|2} columns - Número de colunas (padrão: 2)
+ * @see FormProps
+ */
+Form, 
+/**
+ * Formulário dentro de um modal. Reutiliza o componente Form com a mesma
+ * API de inputs, adicionando overlay, título e botões de navegação.
+ * @property {string} title - Título do modal
+ * @property {string} subtitle - Subtítulo do modal
+ * @property {FormInputConfig[]} inputs - Configuração dos inputs
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(data) => void} onSubmit - Callback ao submeter
+ * @property {() => void} onCancel - Callback ao cancelar
+ * @see ModalFormProps
+ */
+ModalForm, 
+/**
+ * Modal de upload de ficheiros com drag and drop, lista de ficheiros
+ * com progress bar e estados (uploading/completed/failed).
+ * @property {string} title - Título do modal (default: "Upload File")
+ * @property {string} accept - Tipos MIME aceites
+ * @property {UploadFile[]} files - Lista de ficheiros (bindable)
+ * @property {boolean} isOpen - Visibilidade do modal (bindable)
+ * @property {(files) => void} onFilesSelected - Callback ao selecionar ficheiros
+ * @property {(files) => void} onUpload - Callback ao clicar Upload
+ * @see ModalUploadProps
+ */
+ModalUpload, 
 /**
  * Componente raiz do Negodesign.
  * Configura o tema, idioma e traduções da aplicação.
@@ -199,6 +343,31 @@ CarouselHero,
  * @see FooterProps
  */
 Footer, 
+/**
+ * Hero estático com layout dividido: coluna esquerda com conteúdo
+ * e coluna direita com imagem circular.
+ * @property {string} title - Título principal
+ * @property {string} subTitle - Subtítulo
+ * @property {string} description - Descrição
+ * @property {string} image - URL da imagem
+ * @see SimpleHero
+ */
+SimpleHero, 
+/**
+ * Wrapper para cards de mídia com variantes 1 (alinhado à esquerda) e 2 (centrado).
+ * Mostra logo, título, rating, tags e botões.
+ * @property {1|2} variant - Variante visual
+ * @property {CardMediaProps} - Props do card de mídia
+ * @see CardMediaProps
+ */
+CardMedia, 
+/**
+ * Wrapper para cards de perfil de organização/guia, com variantes 1 e 2.
+ * @property {1|2} variant - Variante visual
+ * @property {CardProfileProps} - Props do card de perfil
+ * @see CardProfileProps
+ */
+CardProfile, 
 /**
  * Carousel de cards de promoção com preços antigo/novo, botão de comprar,
  * favoritar e adicionar ao carrinho.

package/dist/types/index.d.ts

@@ -31,6 +31,16 @@ import type { CarouselGridProductProps } from "../components/ui/carousel/core/gr
 import type { CompanyProfileProps } from "../components/pages/company-profile/types";
 import type { MenuProps, MenuVarientProps, ComplexMenuProps } from "../components/ui/nav/data/types";
 import type { GridProps, ItemGridProps } from "../components/ui/grid/core/data/types";
+import type { ModelGridCard, ModelGridCategory, ModalGridSelectionProps } from "../components/ui/modal/grid/types";
+import type { ModelBadge, ModalBadgeSelectionProps } from "../components/ui/modal/badge/types";
+import type { ModelSocialShare, ModalShareSelectionProps } from "../components/ui/modal/share/types";
+import type { ModalNotificationProps } from "../components/ui/modal/notification/types";
+import type { ModalFeedbackProps } from "../components/ui/modal/feedback/types";
+import type { ModalMapProps } from "../components/ui/modal/map/types";
+import type { ModalCoreProps } from "../components/ui/modal/core/types";
+import type { FormProps, FormInputConfig, FormOption } from "../components/ui/form/types";
+import type { ModalFormProps } from "../components/ui/modal/form/types";
+import type { ModalUploadProps, UploadFile, UploadFileStatus } from "../components/ui/modal/upload/types";
 export type { GridProps, 
 /** Props de um link individual no menu de navegação. @see NavMenuLinksProps */
 NavMenuLinksProps, 
@@ -176,6 +186,42 @@ ProfileUserExperience,
 ProfileUserData, 
 /** Props do componente ProfileUser — página de perfil com 3 variantes. @see ProfileUserProps */
 ProfileUserProps, 
+/** Modelo de dados para um card seleccionável no ModalGridSelection. @see ModelGridCard */
+ModelGridCard, 
+/** Modelo de dados para uma categoria no topo do ModalGridSelection (variante 2). @see ModelGridCategory */
+ModelGridCategory, 
+/** Props do componente ModalGridSelection — modal de seleção em grid. @see ModalGridSelectionProps */
+ModalGridSelectionProps, 
+/** Modelo de dados para um badge/pill seleccionável no ModalBadgeSelection. @see ModelBadge */
+ModelBadge, 
+/** Props do componente ModalBadgeSelection — modal de seleção com badges/pills. @see ModalBadgeSelectionProps */
+ModalBadgeSelectionProps, 
+/** Modelo de dados para uma rede social no ModalShareSelection. @see ModelSocialShare */
+ModelSocialShare, 
+/** Props do componente ModalShareSelection — modal de partilha em redes sociais. @see ModalShareSelectionProps */
+ModalShareSelectionProps, 
+/** Props do componente ModalNotification — modal de subscrição/notificação por email. @see ModalNotificationProps */
+ModalNotificationProps, 
+/** Props do componente ModalFeedback — modal de feedback com editor de texto rico. @see ModalFeedbackProps */
+ModalFeedbackProps, 
+/** Props do componente ModalMap — modal de seleção de localização com mapa. @see ModalMapProps */
+ModalMapProps, 
+/** Props do componente Form — formulário com grid responsivo de 2 colunas. @see FormProps */
+FormProps, 
+/** Configuração de um input dentro do Form. @see FormInputConfig */
+FormInputConfig, 
+/** Opção para inputs do tipo select, radio ou checkbox. @see FormOption */
+FormOption, 
+/** Props do componente ModalForm — formulário dentro de um modal. @see ModalFormProps */
+ModalFormProps, 
+/** Props do componente ModalUpload — modal de upload de ficheiros. @see ModalUploadProps */
+ModalUploadProps, 
+/** Modelo de dados para um ficheiro no modal de upload. @see UploadFile */
+UploadFile, 
+/** Estado de um ficheiro no upload. @see UploadFileStatus */
+UploadFileStatus, 
+/** Props do componente ModalCore — contentor base reutilizável para todos os modais. @see ModalCoreProps */
+ModalCoreProps, 
 /** Props do NegoDesign — componente raiz do Negodesign. */
 NegoDesignProps, 
 /** Props base para inputs de formulário com label. */

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "negodesign",
-	"version": "0.0.74",
+	"version": "0.0.75",
 	"type": "module",
 	"license": "MIT",
 	"sideEffects": [