@thibezer/ui-components-kit 2.12.0 → 2.12.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +140 -84
- package/README.md +1 -1
- package/dist/camadas.cjs +91 -113
- package/dist/camadas.js +785 -762
- package/dist/components/ui-camadas/camadas-drag-drop.d.ts +2 -0
- package/dist/components/ui-camadas/camadas-hierarquia.d.ts +10 -0
- package/dist/components/ui-camadas/camadas-persistencia.d.ts +6 -1
- package/dist/components/ui-camadas/camadas-rodape.d.ts +5 -0
- package/dist/components/ui-camadas/camadas-sincronizacao-dom.d.ts +5 -0
- package/dist/components/ui-cores/ui-seletor-cor.d.ts +2 -0
- package/dist/components/ui-tabela-propriedades/editores-basicos.d.ts +6 -0
- package/dist/components/ui-tabela-propriedades/propriedades-gerenciador-valores.d.ts +5 -2
- package/dist/components/ui-tabela-propriedades/propriedades-render-arvore.d.ts +2 -0
- package/dist/components/ui-tabela-propriedades/tipos.d.ts +6 -0
- package/dist/components/ui-tabela-propriedades/ui-tabela-propriedades.d.ts +6 -1
- package/dist/components/ui-texto-editavel/index.d.ts +2 -0
- package/dist/components/ui-texto-editavel/texto-editavel-teclado.d.ts +12 -0
- package/dist/components/ui-texto-editavel/texto-editavel-template.d.ts +2 -0
- package/dist/components/ui-texto-editavel/tipos.d.ts +14 -0
- package/dist/components/ui-texto-editavel/ui-texto-editavel.d.ts +82 -0
- package/dist/cores.cjs +1 -1
- package/dist/cores.js +2 -2
- package/dist/custom-elements.json +15585 -14630
- package/dist/data.cjs +1 -1
- package/dist/data.js +39 -38
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +195 -191
- package/dist/register.cjs +1 -1
- package/dist/register.js +4 -4
- package/dist/tabela.cjs +1 -1
- package/dist/tabela.js +31 -30
- package/dist/tipos-elementos.d.ts +29 -3
- package/dist/tipos-react.d.ts +2 -0
- package/dist/tipos-vue.d.ts +28 -3
- package/dist/ui-controle-cores-C_cVXxCn.js +291 -0
- package/dist/ui-controle-cores-CuDFS8Y8.cjs +32 -0
- package/dist/ui-linha-BxhEBn27.js +749 -0
- package/dist/ui-linha-CcalUBDw.cjs +38 -0
- package/dist/ui-seletor-cor-DPKqf5wb.cjs +82 -0
- package/dist/ui-seletor-cor-FYtRccnK.js +396 -0
- package/dist/ui-tabela-propriedades-C5YYnod1.js +3053 -0
- package/dist/ui-tabela-propriedades-DWOKznMN.cjs +142 -0
- package/package.json +187 -187
|
@@ -24,6 +24,8 @@ export declare class CamadasDragDropManager {
|
|
|
24
24
|
/** Depois de qualquer mudança na ordem/hierarquia de camadas. */
|
|
25
25
|
private aposReordenarCamadas;
|
|
26
26
|
private emitirFeicaoMovida;
|
|
27
|
+
/** Camada travada (ou sob grupo travado) não recebe nem perde feições pelo arraste. */
|
|
28
|
+
private trocaEntreCamadasTravada;
|
|
27
29
|
private arrasteBloqueado;
|
|
28
30
|
bindDragAndDrop(): void;
|
|
29
31
|
/**
|
|
@@ -18,3 +18,13 @@ export declare function obterIdsSubarvoreCamada(camadas: CamadaItem[], camadaId:
|
|
|
18
18
|
* Retorna todas as feições pertencentes à camada e às suas subcamadas descendentes.
|
|
19
19
|
*/
|
|
20
20
|
export declare function obterFeicoesDoEscopoCamada(camadas: CamadaItem[], feicoes: FeicaoItem[], camadaId: string): FeicaoItem[];
|
|
21
|
+
export interface EstadoHerdadoCamada {
|
|
22
|
+
/** Algum grupo acima está oculto: a camada não aparece no mapa, mesmo com o próprio olho aberto. */
|
|
23
|
+
ocultaPorAncestral: boolean;
|
|
24
|
+
/** Algum grupo acima está travado: a camada e as suas feições não podem ser editadas. */
|
|
25
|
+
travadaPorAncestral: boolean;
|
|
26
|
+
}
|
|
27
|
+
/** Estado que cada camada herda dos ancestrais. Tolera ciclos e pais inexistentes. */
|
|
28
|
+
export declare function calcularEstadoHerdado(camadas: CamadaItem[]): Map<string, EstadoHerdadoCamada>;
|
|
29
|
+
/** Ids das camadas travadas por si mesmas ou por um grupo acima delas. */
|
|
30
|
+
export declare function idsCamadasTravadas(camadas: CamadaItem[]): Set<string>;
|
|
@@ -34,7 +34,12 @@ export interface EstadoPersistidoCamadas {
|
|
|
34
34
|
*/
|
|
35
35
|
export declare function gerarChaveStorage(chaveProp?: string | null, elementId?: string | null): string;
|
|
36
36
|
/**
|
|
37
|
-
*
|
|
37
|
+
* Valida o que veio do storage (editado à mão, de outra versão ou corrompido): campos com tipo errado
|
|
38
|
+
* caem para o padrão em vez de derrubar o painel. Algo que nem é objeto vira `null`.
|
|
39
|
+
*/
|
|
40
|
+
export declare function normalizarEstadoPersistido(bruto: unknown): EstadoPersistidoCamadas | null;
|
|
41
|
+
/**
|
|
42
|
+
* Lê o estado persistido do localStorage com tolerância a falhas (SSR, restrições de sandbox, conteúdo corrompido)
|
|
38
43
|
*/
|
|
39
44
|
export declare function carregarEstadoPersistido(storageKey: string): EstadoPersistidoCamadas | null;
|
|
40
45
|
/**
|
|
@@ -4,4 +4,9 @@ import { CamadaItem, FeicaoItem } from './tipos';
|
|
|
4
4
|
* a hierarquia visual com recuo e ícones de pasta
|
|
5
5
|
*/
|
|
6
6
|
export declare function formatarOpcoesCamadasHierarquicas(camadas: CamadaItem[]): string;
|
|
7
|
+
/** Ícone + texto acessível do contador do rodapé (camadas ou feições selecionadas). */
|
|
8
|
+
export declare function rotuloRodape(totalCamadas: number, totalSelecionadas: number): {
|
|
9
|
+
icone: string;
|
|
10
|
+
texto: string;
|
|
11
|
+
};
|
|
7
12
|
export declare function renderizarRodapeAcoes(camadas: CamadaItem[], feicoes: FeicaoItem[], selecionadasIds: Set<string>): string;
|
|
@@ -1,3 +1,8 @@
|
|
|
1
1
|
import { CamadasHostCompleto } from './camadas-host';
|
|
2
2
|
export declare function sincronizarCamadaAtivaDOM(host: CamadasHostCompleto, shadow: ShadowRoot): void;
|
|
3
3
|
export declare function sincronizarSelecaoDOM(host: CamadasHostCompleto, shadow: ShadowRoot): void;
|
|
4
|
+
/**
|
|
5
|
+
* Reflete no DOM o estado herdado dos grupos (sem redesenhar a árvore): esmaece o que está sob um
|
|
6
|
+
* grupo oculto e trava os cadeados das feições cuja camada, ou um grupo acima dela, está travada.
|
|
7
|
+
*/
|
|
8
|
+
export declare function sincronizarHerancaDOM(host: CamadasHostCompleto, shadow: ShadowRoot): void;
|
|
@@ -15,6 +15,8 @@ export type ConfiguracaoSeletorCor = Omit<OpcoesSeletorCor, 'ancora' | 'focar' |
|
|
|
15
15
|
export declare class UISeletorCor extends SafeHTMLElement {
|
|
16
16
|
private raiz;
|
|
17
17
|
private listeners;
|
|
18
|
+
/** @internal Aberto por `abrirSeletorCor()`: solta os ouvintes de `window` se alguém remover o elemento. */
|
|
19
|
+
aoDesconectar: (() => void) | null;
|
|
18
20
|
private _titulo;
|
|
19
21
|
private _duplo;
|
|
20
22
|
private _alvo;
|
|
@@ -2,6 +2,12 @@ import { ItemPropriedade, ContextoEditorPropriedade } from './tipos';
|
|
|
2
2
|
export declare function obterCasasDecimais(prop: ItemPropriedade): number | undefined;
|
|
3
3
|
export declare function obterPassoNumerico(prop: ItemPropriedade, casas?: number): number;
|
|
4
4
|
export declare function aplicarLimitesNumericos(valor: number, prop: ItemPropriedade): number;
|
|
5
|
+
/**
|
|
6
|
+
* Texto digitado num campo numérico → número final, ou `null` se inválido. Aceita a unidade
|
|
7
|
+
* da propriedade no fim ("25 mm", "90°"), aplica min/max e as casas decimais e remove o ruído
|
|
8
|
+
* de ponto flutuante (0.1 + 0.2 = 0.3).
|
|
9
|
+
*/
|
|
10
|
+
export declare function interpretarEntradaNumerica(texto: string, prop: ItemPropriedade): number | null;
|
|
5
11
|
export declare function criarEditorReadonly(valorAtual: any, obterTextoMisto?: () => string, prop?: ItemPropriedade): HTMLElement;
|
|
6
12
|
export declare function criarEditorBooleano(categoriaId: string, prop: ItemPropriedade, valorAtual: any, ctx: ContextoEditorPropriedade): HTMLElement;
|
|
7
13
|
export declare function criarEditorSelecao(categoriaId: string, prop: ItemPropriedade, valorAtual: any, ctx: ContextoEditorPropriedade): HTMLElement;
|
|
@@ -25,8 +25,11 @@ export declare class GerenciadorValoresPropriedades {
|
|
|
25
25
|
obterValorOriginal(propId: string): any;
|
|
26
26
|
/** Alteração programática: atualiza o editor na tela; não emite se o valor não mudou. */
|
|
27
27
|
definirValor(propId: string, novoValor: any, emitirEvento?: boolean): void;
|
|
28
|
-
/**
|
|
29
|
-
|
|
28
|
+
/**
|
|
29
|
+
* Restaura uma propriedade individual ao seu valor original (antes da edição).
|
|
30
|
+
* Devolve `false` se não havia o que restaurar.
|
|
31
|
+
*/
|
|
32
|
+
redefinirValor(propId: string, emitirEvento?: boolean): boolean;
|
|
30
33
|
/** Alteração feita pelo usuário num editor. Em modo manual só emite no Aplicar. */
|
|
31
34
|
registrarAlteracao(categoriaId: string, propId: string, novoValor: any): void;
|
|
32
35
|
aplicar(): void;
|
|
@@ -8,6 +8,8 @@ export interface ContextoLinhaPropriedade {
|
|
|
8
8
|
isDirty?: boolean;
|
|
9
9
|
editorCtx: ContextoEditorPropriedade;
|
|
10
10
|
onAtualizarCampoVisual: (propId: string, novoValor: any) => void;
|
|
11
|
+
/** Restaura o valor original da propriedade (botão ↺ das linhas modificadas). */
|
|
12
|
+
onRedefinir?: (propId: string) => void;
|
|
11
13
|
}
|
|
12
14
|
export interface OpcoesRenderArvore {
|
|
13
15
|
listaContainer: HTMLElement;
|
|
@@ -49,6 +49,12 @@ export interface SeletorTipoItem {
|
|
|
49
49
|
subtipo?: string;
|
|
50
50
|
iconeSvg?: string;
|
|
51
51
|
}
|
|
52
|
+
export interface UIAplicarDetail {
|
|
53
|
+
/** Todos os valores atuais. */
|
|
54
|
+
valores: Record<string, any>;
|
|
55
|
+
/** Só as propriedades que mudaram desde o último carregar/aplicar. */
|
|
56
|
+
alterados: Record<string, any>;
|
|
57
|
+
}
|
|
52
58
|
export interface UIPropertyChangeDetail {
|
|
53
59
|
id: string;
|
|
54
60
|
categoriaId: string;
|
|
@@ -63,6 +63,7 @@ export declare class UITabelaPropriedades extends SafeHTMLElement {
|
|
|
63
63
|
set textoMisto(texto: string);
|
|
64
64
|
get tipos(): SeletorTipoItem[];
|
|
65
65
|
set tipos(novosTipos: SeletorTipoItem[]);
|
|
66
|
+
/** Id do tipo exibido no seletor: sem seleção válida, o seletor mostra (e devolve) o primeiro. */
|
|
66
67
|
get tipoSelecionado(): string;
|
|
67
68
|
set tipoSelecionado(idTipo: string);
|
|
68
69
|
get valores(): Record<string, any>;
|
|
@@ -71,7 +72,11 @@ export declare class UITabelaPropriedades extends SafeHTMLElement {
|
|
|
71
72
|
get dirty(): boolean;
|
|
72
73
|
obterValor(propId: string): any;
|
|
73
74
|
definirValor(propId: string, novoValor: any, emitirEvento?: boolean): void;
|
|
74
|
-
|
|
75
|
+
/**
|
|
76
|
+
* Volta uma propriedade ao valor do último carregar/aplicar (o mesmo que o botão ↺ da linha).
|
|
77
|
+
* Fora do modo manual emite `ui-propriedade-alterada`. Devolve `false` se não havia o que restaurar.
|
|
78
|
+
*/
|
|
79
|
+
redefinirValor(propId: string, emitirEvento?: boolean): boolean;
|
|
75
80
|
aplicar(): void;
|
|
76
81
|
desfazer(): void;
|
|
77
82
|
expandirTudo(): void;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Trata atalhos de teclado no modo leitura (foco no botão do componente).
|
|
3
|
+
* Enter ou F2 ativam o modo de edição inline.
|
|
4
|
+
*/
|
|
5
|
+
export declare function tratarTecladoLeitura(evento: KeyboardEvent, iniciarEdicao: () => void): void;
|
|
6
|
+
/**
|
|
7
|
+
* Trata atalhos de teclado no modo de edição (foco no input interno).
|
|
8
|
+
* - Enter: confirma e salva a edição.
|
|
9
|
+
* - Escape: cancela e restaura o valor original.
|
|
10
|
+
* - Tab: confirma e salva antes de permitir a mudança de foco natural.
|
|
11
|
+
*/
|
|
12
|
+
export declare function tratarTecladoEdicao(evento: KeyboardEvent, salvar: () => void, cancelar: () => void): void;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
export declare const ATRIBUTOS_OBSERVADOS_TEXTO_EDITAVEL: readonly ["valor", "value", "placeholder", "variante", "tamanho", "disabled", "desabilitado", "readonly", "somente-leitura", "ao-perder-foco", "obrigatorio", "maxlength", "limite-caracteres", "name", "nome"];
|
|
2
|
+
export declare function criarTemplateTextoEditavel(estilos: string): string;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export type VarianteTextoEditavel = 'secundario' | 'secondary' | 'primario' | 'primary' | 'ghost' | 'terciario' | 'outline' | 'borda' | 'texto' | 'plano' | 'destaque' | 'destrutivo';
|
|
2
|
+
export type TamanhoTextoEditavel = 'sm' | 'md' | 'lg';
|
|
3
|
+
export type ModoTextoEditavel = 'leitura' | 'edicao';
|
|
4
|
+
export type ComportamentoAoPerderFoco = 'salvar' | 'cancelar' | 'ignorar';
|
|
5
|
+
export interface DetalheEventoSalvar {
|
|
6
|
+
valor: string;
|
|
7
|
+
valorAnterior: string;
|
|
8
|
+
}
|
|
9
|
+
export interface DetalheEventoCancelar {
|
|
10
|
+
valor: string;
|
|
11
|
+
}
|
|
12
|
+
export interface DetalheEventoModoAlterado {
|
|
13
|
+
modo: ModoTextoEditavel;
|
|
14
|
+
}
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import { FormAssociatedElement } from '../../core/form-associated-element';
|
|
2
|
+
import { VarianteTextoEditavel, TamanhoTextoEditavel, ComportamentoAoPerderFoco } from './tipos';
|
|
3
|
+
/**
|
|
4
|
+
* Componente de texto ou botão que se transforma em campo de edição com duplo clique (ou atalhos de teclado).
|
|
5
|
+
*
|
|
6
|
+
* @element ui-texto-editavel
|
|
7
|
+
*
|
|
8
|
+
* @attr {string} valor - Valor textual atual.
|
|
9
|
+
* @attr {string} placeholder - Texto exibido quando o valor está vazio.
|
|
10
|
+
* @attr {string} variante - Estilo visual ('secundario', 'primario', 'ghost', 'outline', 'texto', etc.).
|
|
11
|
+
* @attr {string} tamanho - Tamanho do controle ('sm', 'md', 'lg').
|
|
12
|
+
* @attr {boolean} disabled - Desabilita o componente e impede edição.
|
|
13
|
+
* @attr {boolean} readonly - Permite focar e ler, mas impede entrar em edição.
|
|
14
|
+
* @attr {string} ao-perder-foco - Ação ao sair do campo ('salvar', 'cancelar', 'ignorar'). Padrão: 'salvar'.
|
|
15
|
+
* @attr {boolean} obrigatorio - Impede salvar com valor em branco.
|
|
16
|
+
* @attr {number} maxlength - Quantidade máxima de caracteres permitida.
|
|
17
|
+
*
|
|
18
|
+
* @fires ui-salvar - Disparado ao confirmar a edição com `{ valor, valorAnterior }`. Cancelável via preventDefault().
|
|
19
|
+
* @fires ui-cancelar - Disparado ao cancelar a edição com `{ valor }`.
|
|
20
|
+
* @fires ui-modo-alterado - Disparado quando alterna entre leitura e edição com `{ modo }`.
|
|
21
|
+
* @fires change - Disparado nativamente quando o valor é alterado e confirmado.
|
|
22
|
+
*
|
|
23
|
+
* @csspart base - O contêiner envolvente.
|
|
24
|
+
* @csspart botao - O botão do modo leitura.
|
|
25
|
+
* @csspart texto - O elemento de texto interno no modo leitura.
|
|
26
|
+
* @csspart input - O campo de entrada de texto nativo no modo edição.
|
|
27
|
+
*/
|
|
28
|
+
export declare class UITextoEditavel extends FormAssociatedElement {
|
|
29
|
+
static formAssociated: boolean;
|
|
30
|
+
static get observedAttributes(): readonly ["valor", "value", "placeholder", "variante", "tamanho", "disabled", "desabilitado", "readonly", "somente-leitura", "ao-perder-foco", "obrigatorio", "maxlength", "limite-caracteres", "name", "nome"];
|
|
31
|
+
private container;
|
|
32
|
+
private botaoElement;
|
|
33
|
+
private textoElement;
|
|
34
|
+
private inputElement;
|
|
35
|
+
private _modo;
|
|
36
|
+
private _concluindo;
|
|
37
|
+
private _valorInterno;
|
|
38
|
+
private _valorOriginalAoEditar;
|
|
39
|
+
private listeners;
|
|
40
|
+
constructor();
|
|
41
|
+
connectedCallback(): void;
|
|
42
|
+
disconnectedCallback(): void;
|
|
43
|
+
attributeChangedCallback(nome: string, _antigo: string | null, novo: string | null): void;
|
|
44
|
+
private handleDuploClique;
|
|
45
|
+
private handleKeyDownBotao;
|
|
46
|
+
private handleKeyDownInput;
|
|
47
|
+
private handleBlurInput;
|
|
48
|
+
/** Entra no modo de edição se o componente não estiver desabilitado ou em somente leitura. */
|
|
49
|
+
editar(): void;
|
|
50
|
+
/**
|
|
51
|
+
* Salva as alterações feitas no modo de edição e retorna ao modo leitura.
|
|
52
|
+
* Dispara `ui-salvar` (cancelável com preventDefault()).
|
|
53
|
+
*/
|
|
54
|
+
salvar(): boolean;
|
|
55
|
+
/** Cancela as alterações e restaura o valor prévio à edição. */
|
|
56
|
+
cancelar(): void;
|
|
57
|
+
/** Informa se o componente está atualmente no modo de edição. */
|
|
58
|
+
estaEditando(): boolean;
|
|
59
|
+
private dispararEventoModo;
|
|
60
|
+
protected syncState(): void;
|
|
61
|
+
atualizarValidade(): void;
|
|
62
|
+
get valor(): string;
|
|
63
|
+
set valor(val: string);
|
|
64
|
+
get value(): string;
|
|
65
|
+
set value(val: string);
|
|
66
|
+
get placeholder(): string;
|
|
67
|
+
set placeholder(val: string);
|
|
68
|
+
get variante(): VarianteTextoEditavel;
|
|
69
|
+
set variante(val: VarianteTextoEditavel);
|
|
70
|
+
get tamanho(): TamanhoTextoEditavel;
|
|
71
|
+
set tamanho(val: TamanhoTextoEditavel);
|
|
72
|
+
get disabled(): boolean;
|
|
73
|
+
set disabled(val: boolean);
|
|
74
|
+
get readOnly(): boolean;
|
|
75
|
+
set readOnly(val: boolean);
|
|
76
|
+
get obrigatorio(): boolean;
|
|
77
|
+
set obrigatorio(val: boolean);
|
|
78
|
+
get aoPerderFoco(): ComportamentoAoPerderFoco;
|
|
79
|
+
set aoPerderFoco(val: ComportamentoAoPerderFoco);
|
|
80
|
+
get maxlength(): number | null;
|
|
81
|
+
set maxlength(val: number | null);
|
|
82
|
+
}
|
package/dist/cores.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css */const r=require("./ui-seletor-cor-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css */const r=require("./ui-seletor-cor-DPKqf5wb.cjs"),e=require("./ui-controle-cores-CuDFS8Y8.cjs");exports.PALETA_CORES_PADRAO=r.PALETA_CORES_PADRAO;exports.UISeletorCor=r.UISeletorCor;exports.abrirSeletorCor=r.abrirSeletorCor;exports.coresUnicas=r.coresUnicas;exports.escaparHtml=r.escaparHtml;exports.fecharSeletorCor=r.fecharSeletorCor;exports.normalizarCor=r.normalizarCor;exports.normalizarEspessura=r.normalizarEspessura;exports.normalizarOpacidade=r.normalizarOpacidade;exports.UIControleCores=e.UIControleCores;
|
package/dist/cores.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/* empty css */
|
|
2
|
-
import { P as s, U as e, a as l, c as t, e as i, f as m, n as C, b as c, d as n } from "./ui-seletor-cor-
|
|
3
|
-
import { U } from "./ui-controle-cores-
|
|
2
|
+
import { P as s, U as e, a as l, c as t, e as i, f as m, n as C, b as c, d as n } from "./ui-seletor-cor-FYtRccnK.js";
|
|
3
|
+
import { U } from "./ui-controle-cores-C_cVXxCn.js";
|
|
4
4
|
export {
|
|
5
5
|
s as PALETA_CORES_PADRAO,
|
|
6
6
|
U as UIControleCores,
|