@seniorsistemas/data-seniorx-core 3.3.0 → 3.4.0-main-e91c7773

package/package.json

@@ -100,5 +100,5 @@
   ],
   "style": "./styles.css",
   "typings": "index.d.ts",
-  "version": "3.3.0"
+  "version": "3.4.0-main-e91c7773"
 }

package/public-api.d.ts

@@ -129,6 +129,7 @@ export type { NumberInputAlignment, NumberInputParseResult, NumberInputSeparator
 export { mockRowCardList } from './core/types/row-card.type';
 export type { OptionsRowCard, RowCard, RowCardListOptions } from './core/types/row-card.type';
 export type { ActionMenuItem, ActionMenuItemDisabled, ActionsCellOptions, ButtonCellOptions, CheckboxCellOptions, IconCellOptions, IconTitleCellOptions, RowBase, SortOrder, TableActionMenuItem, TableBaseVisualConfig, TableCellConfig, TableCellConfigKey, TableCellConfigMap, TableCellTag, TableColumn, TableColumnAlignment, TableColumnContent, TableColumnType, TableIconConfig, TableIconConfigInput, TableOpenMenuState, TableOptions, TableRowIdentity, TableSearchEvent, TableTagConfig, TableTagConfigInput, TableTextOverflow, TableTitleIconConfig, TableTitleIconConfigInput, TableVisualConfigInput, TableVisualConfigResolver, TagCellOptions } from './core/types/table.type';
+export type { NestedTableActionEvent, NestedTableGroup, NestedTableOptions } from './core/types/nested-table.type';
 export type { FieldAccessor, FilterableRecord, FilterDef, FiltersConfig, FilterSelection, FiltersState, FilterType, LabelAccessor, ValueAccessor } from './core/types/filters.type';
 export type { RenderableIconType } from './core/types/icon.type';
 export type { LoadingStateDirectiveValue, LoadingStateIndicator } from './core/types/loading-state.type';
@@ -211,6 +212,7 @@ export { LocalizedNumberInputComponent } from './features/localized-number-input
 export { ListComponent } from './features/list/list.component';
 export { MaskComponent } from './features/mask/mask.component';
 export { TableComponent } from './features/table/table.component';
+export { NestedTableComponent } from './features/nested-table/nested-table.component';
 export { TabComponent } from './features/tab/tab.component';
 export { TabItemComponent } from './features/tab/components/tab-item/tab-item.component';
 export { SidebarComponent } from './features/sidebar/sidebar.component';

package/src/locales/en.json

@@ -178,6 +178,9 @@
   "platform.datacore.accessibility_panel_content_field": "Panel content text",
   "platform.datacore.accessibility_panel_toggleable_toggle": "Toggle panel collapsible option",
   "platform.datacore.accessibility_panel_collapsed_toggle": "Toggle panel collapsed state",
+  "platform.datacore.accessibility_nested_table_group_toggle": "Toggle group row",
+  "platform.datacore.accessibility_nested_table_hint": "Information",
+  "platform.datacore.accessibility_nested_table_row": "group",
   "platform.datacore.accessibility_code_editor_demo_tabs": "Code editor component demonstration tabs",
   "platform.datacore.accessibility_code_editor_language_field": "Programming language selection",
   "platform.datacore.accessibility_code_editor_width_field": "Code editor width",
@@ -361,6 +364,8 @@
   "platform.datacore.showcase_demos_pick_list_description": "Standard list",
   "platform.datacore.showcase_demos_table_label": "Table",
   "platform.datacore.showcase_demos_table_description": "Table and filters",
+  "platform.datacore.showcase_demos_nested_table_label": "Nested Table",
+  "platform.datacore.showcase_demos_nested_table_description": "Two-level table with row expansion",
   "platform.datacore.showcase_demos_card_list_label": "Card List",
   "platform.datacore.showcase_demos_card_list_description": "Grid cards",
   "platform.datacore.showcase_demos_row_card_list_label": "Row Card List",

package/src/locales/es-CO.json

@@ -178,6 +178,9 @@
   "platform.datacore.accessibility_panel_content_field": "Texto del contenido del panel",
   "platform.datacore.accessibility_panel_toggleable_toggle": "Alternar opción colapsable del panel",
   "platform.datacore.accessibility_panel_collapsed_toggle": "Alternar estado colapsado del panel",
+  "platform.datacore.accessibility_nested_table_group_toggle": "Expandir o contraer fila de grupo",
+  "platform.datacore.accessibility_nested_table_hint": "Información",
+  "platform.datacore.accessibility_nested_table_row": "grupo",
   "platform.datacore.accessibility_code_editor_demo_tabs": "Pestañas de demostración del componente editor de código",
   "platform.datacore.accessibility_code_editor_language_field": "Selección de lenguaje de programación",
   "platform.datacore.accessibility_code_editor_width_field": "Ancho del editor de código",
@@ -360,6 +363,8 @@
   "platform.datacore.showcase_demos_pick_list_description": "Lista estándar",
   "platform.datacore.showcase_demos_table_label": "Table",
   "platform.datacore.showcase_demos_table_description": "Tabla y filtros",
+  "platform.datacore.showcase_demos_nested_table_label": "Nested Table",
+  "platform.datacore.showcase_demos_nested_table_description": "Tabla de dos niveles con expansión de fila",
   "platform.datacore.showcase_demos_card_list_label": "Card List",
   "platform.datacore.showcase_demos_card_list_description": "Tarjetas en cuadrícula",
   "platform.datacore.showcase_demos_row_card_list_label": "Row Card List",

package/src/locales/pt.json

@@ -178,6 +178,9 @@
   "platform.datacore.accessibility_panel_content_field": "Texto do conteúdo do painel",
   "platform.datacore.accessibility_panel_toggleable_toggle": "Alternar opção colapsável do painel",
   "platform.datacore.accessibility_panel_collapsed_toggle": "Alternar estado colapsado do painel",
+  "platform.datacore.accessibility_nested_table_group_toggle": "Expandir ou recolher linha de grupo",
+  "platform.datacore.accessibility_nested_table_hint": "Informação",
+  "platform.datacore.accessibility_nested_table_row": "grupo",
   "platform.datacore.accessibility_code_editor_demo_tabs": "Abas de demonstração do componente editor de código",
   "platform.datacore.accessibility_code_editor_language_field": "Seleção de linguagem de programação",
   "platform.datacore.accessibility_code_editor_width_field": "Largura do editor de código",
@@ -361,6 +364,8 @@
   "platform.datacore.showcase_demos_pick_list_description": "Listagem padrão",
   "platform.datacore.showcase_demos_table_label": "Table",
   "platform.datacore.showcase_demos_table_description": "Tabela e filtros",
+  "platform.datacore.showcase_demos_nested_table_label": "Nested Table",
+  "platform.datacore.showcase_demos_nested_table_description": "Tabela de duas camadas com expansão de linha",
   "platform.datacore.showcase_demos_card_list_label": "Card List",
   "platform.datacore.showcase_demos_card_list_description": "Cards em grade",
   "platform.datacore.showcase_demos_row_card_list_label": "Row Card List",

package/styles/accessibility.scss

@@ -339,3 +339,95 @@
     border-color: var(--sdc-focus-border-color, #428bca);
   }
 }
+
+
+
+/* ========================================
+   Área de toque em aparelho de toque (44px)
+   ========================================
+
+   ATENÇÃO para quem for mexer neste arquivo: as regras ACIMA estão dentro de blocos
+   `::ng-deep`. Isto aqui é uma folha de estilo GLOBAL, compilada direto para o
+   styles.css publicado - não é o estilo de um componente Angular, onde o compilador
+   remove esse pseudo-seletor. No CSS publicado ele chega literal, o navegador não o
+   reconhece e DESCARTA a regra inteira. Medido no bundle: 99 ocorrências de
+   ::ng-deep, nenhuma com efeito. Dá pra ver pelo resultado: o bloco acima exige 24x24
+   em qualquer botão, e mesmo assim `sdc-info-sign__icon` media 18x18 no celular.
+
+   Retirar os ::ng-deep de uma vez reanimaria as 99 regras ao mesmo tempo - altura de
+   campo, padding de célula de tabela, anel de foco e cor de link mudariam juntos, em
+   todos os produtos. Precisa ser feito, mas com teste visual próprio.
+
+   O bloco abaixo é escrito sem ::ng-deep, então vale de verdade.
+
+   --------------------------------------------------------------------------------
+   POR QUE ÁREA DE TOQUE E NÃO TAMANHO
+
+   A primeira versão disto crescia a CAIXA dos elementos (min-width/min-height: 44px).
+   Funcionava na métrica e estragava o desenho: o breadcrumb virava uma fileira de
+   caixas de 44px e desalinhava do título, o ícone de informação inchava na linha do
+   rótulo, e a tag de filtro ficava enorme ao lado da tag de status, que continuava
+   pequena. Feedback do time, com razão: o layout anterior já estava bom.
+
+   O dedo não precisa que o BOTÃO seja grande - precisa que a REGIÃO QUE RECEBE O
+   TOQUE seja. Um ::after absoluto e centrado, sem pintura nenhuma, leva essa região a
+   44x44 e não ocupa espaço no layout, porque sai do fluxo. O elemento continua
+   exatamente do tamanho que era.
+*/
+
+@mixin area-de-toque($tamanho: 44px) {
+  position: relative;
+
+  &::after {
+    content: '';
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: $tamanho;
+    height: $tamanho;
+    min-width: 100%;
+    min-height: 100%;
+    transform: translate(-50%, -50%);
+  }
+}
+
+@media (pointer: coarse) {
+  :root {
+    /* Único tamanho que de fato muda: campo de formulário. 34px num dedo é pouco e
+       44px é o padrão em celular - aqui crescer é o comportamento esperado, não um
+       efeito colateral. Alimenta textbox, combobox, autocomplete, chips e afins. */
+    --sdc-formfield-default-height: 44px;
+
+    /* O paginador anda colado ao combobox de "itens por página", e os dois precisam
+       ter a mesma altura - lado a lado, a diferença salta à vista. O combobox segue
+       a variável acima e foi pra 44px; as páginas do paginador ficavam nos 34px de
+       sempre. Agora acompanham. */
+    --sdc-table-paginator-size: 44px;
+  }
+
+  /* Botao com rotulo e caso diferente dos de cima: ali crescer desalinhava o layout,
+     aqui 44px de altura e o esperado num celular - o  tem 25px e some debaixo
+     do dedo.  vence o  fixo da lib sem disputar especificidade,
+     porque a propriedade e outra. */
+  .s-button,
+  .sdc-button {
+    min-height: 44px;
+  }
+
+  .sdc-breadcrumb-link,
+  .sdc-info-sign__icon,
+  .sdc-panel__toggle,
+  .sdc-panel__border-button,
+  .sdc-page,
+  .sdc-modal__icon-button,
+  .sdc-table-expandable-toggle,
+  .sdc-table-actions-trigger,
+  .sdc-combobox__icon-button {
+    @include area-de-toque;
+  }
+}
+
+/* NAO incluido de proposito: --sdc-form-tooltip-size. Chips, color-picker, combobox,
+   mask e number-input usam essa variavel em `width`/`height` FIXOS do icone de ajuda,
+   nao em minimo - leva-la a 44px quase dobra um icone que fica na linha do rotulo e
+   empurra o formulario. Vale revisar, mas com teste visual dessas cinco telas. */

package/styles.css

@@ -21205,4 +21205,92 @@
 ::ng-deep select:focus,
 ::ng-deep textarea:focus {
   border-color: var(--sdc-focus-border-color, #428bca);
-}
+}
+
+/* ========================================
+   Área de toque em aparelho de toque (44px)
+   ========================================
+
+   ATENÇÃO para quem for mexer neste arquivo: as regras ACIMA estão dentro de blocos
+   `::ng-deep`. Isto aqui é uma folha de estilo GLOBAL, compilada direto para o
+   styles.css publicado - não é o estilo de um componente Angular, onde o compilador
+   remove esse pseudo-seletor. No CSS publicado ele chega literal, o navegador não o
+   reconhece e DESCARTA a regra inteira. Medido no bundle: 99 ocorrências de
+   ::ng-deep, nenhuma com efeito. Dá pra ver pelo resultado: o bloco acima exige 24x24
+   em qualquer botão, e mesmo assim `sdc-info-sign__icon` media 18x18 no celular.
+
+   Retirar os ::ng-deep de uma vez reanimaria as 99 regras ao mesmo tempo - altura de
+   campo, padding de célula de tabela, anel de foco e cor de link mudariam juntos, em
+   todos os produtos. Precisa ser feito, mas com teste visual próprio.
+
+   O bloco abaixo é escrito sem ::ng-deep, então vale de verdade.
+
+   --------------------------------------------------------------------------------
+   POR QUE ÁREA DE TOQUE E NÃO TAMANHO
+
+   A primeira versão disto crescia a CAIXA dos elementos (min-width/min-height: 44px).
+   Funcionava na métrica e estragava o desenho: o breadcrumb virava uma fileira de
+   caixas de 44px e desalinhava do título, o ícone de informação inchava na linha do
+   rótulo, e a tag de filtro ficava enorme ao lado da tag de status, que continuava
+   pequena. Feedback do time, com razão: o layout anterior já estava bom.
+
+   O dedo não precisa que o BOTÃO seja grande - precisa que a REGIÃO QUE RECEBE O
+   TOQUE seja. Um ::after absoluto e centrado, sem pintura nenhuma, leva essa região a
+   44x44 e não ocupa espaço no layout, porque sai do fluxo. O elemento continua
+   exatamente do tamanho que era.
+*/
+@media (pointer: coarse) {
+  :root {
+    /* Único tamanho que de fato muda: campo de formulário. 34px num dedo é pouco e
+       44px é o padrão em celular - aqui crescer é o comportamento esperado, não um
+       efeito colateral. Alimenta textbox, combobox, autocomplete, chips e afins. */
+    --sdc-formfield-default-height: 44px;
+    /* O paginador anda colado ao combobox de "itens por página", e os dois precisam
+       ter a mesma altura - lado a lado, a diferença salta à vista. O combobox segue
+       a variável acima e foi pra 44px; as páginas do paginador ficavam nos 34px de
+       sempre. Agora acompanham. */
+    --sdc-table-paginator-size: 44px;
+  }
+  /* Botao com rotulo e caso diferente dos de cima: ali crescer desalinhava o layout,
+     aqui 44px de altura e o esperado num celular - o  tem 25px e some debaixo
+     do dedo.  vence o  fixo da lib sem disputar especificidade,
+     porque a propriedade e outra. */
+  .s-button,
+  .sdc-button {
+    min-height: 44px;
+  }
+  .sdc-breadcrumb-link,
+  .sdc-info-sign__icon,
+  .sdc-panel__toggle,
+  .sdc-panel__border-button,
+  .sdc-page,
+  .sdc-modal__icon-button,
+  .sdc-table-expandable-toggle,
+  .sdc-table-actions-trigger,
+  .sdc-combobox__icon-button {
+    position: relative;
+  }
+  .sdc-breadcrumb-link::after,
+  .sdc-info-sign__icon::after,
+  .sdc-panel__toggle::after,
+  .sdc-panel__border-button::after,
+  .sdc-page::after,
+  .sdc-modal__icon-button::after,
+  .sdc-table-expandable-toggle::after,
+  .sdc-table-actions-trigger::after,
+  .sdc-combobox__icon-button::after {
+    content: "";
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: 44px;
+    height: 44px;
+    min-width: 100%;
+    min-height: 100%;
+    transform: translate(-50%, -50%);
+  }
+}
+/* NAO incluido de proposito: --sdc-form-tooltip-size. Chips, color-picker, combobox,
+   mask e number-input usam essa variavel em `width`/`height` FIXOS do icone de ajuda,
+   nao em minimo - leva-la a 44px quase dobra um icone que fica na linha do rotulo e
+   empurra o formulario. Vale revisar, mas com teste visual dessas cinco telas. */