@pallasoft/ps-table-components 1.13.0 → 1.13.1
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.
|
@@ -10,7 +10,7 @@ const react_aria_components_1 = require("react-aria-components");
|
|
|
10
10
|
const PsTableColumnPicker = ({ columns, hiddenColumnIds, onChange, }) => {
|
|
11
11
|
const zIndex = (0, ps_core_components_1.usePsLayerZIndex)(ps_design_system_1.PallasoftZIndex.Dropdown);
|
|
12
12
|
const visibleCount = columns.filter((column) => !hiddenColumnIds.includes(column.id)).length;
|
|
13
|
-
return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.DialogTrigger, { children: [(0, jsx_runtime_1.jsxs)(react_aria_components_1.Button, { className: 'ps-input-control ps-focus-ring ps-control inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control
|
|
13
|
+
return ((0, jsx_runtime_1.jsxs)(react_aria_components_1.DialogTrigger, { children: [(0, jsx_runtime_1.jsxs)(react_aria_components_1.Button, { className: 'ps-input-control ps-focus-ring ps-control ps-control-padding inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40', children: [(0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'block h-4 w-4 sm:hidden', iconKey: ps_icons_1.PsIconKey.Columns }), (0, jsx_runtime_1.jsx)("span", { className: 'sr-only sm:not-sr-only', children: "Columns" }), (0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'hidden h-4 w-4 sm:block', iconKey: ps_icons_1.PsIconKey.Chevron })] }), (0, jsx_runtime_1.jsx)(react_aria_components_1.Popover, { className: 'ps-floating-panel w-60 outline-none', offset: 6, placement: 'bottom end', style: { zIndex }, children: (0, jsx_runtime_1.jsx)(react_aria_components_1.Dialog, { "aria-label": 'Columns', className: 'flex flex-col gap-0.5 p-1.5 outline-none', children: (0, jsx_runtime_1.jsx)(ps_core_components_1.PsLayer, { zIndex: zIndex, children: columns.map((column) => {
|
|
14
14
|
const isVisible = !hiddenColumnIds.includes(column.id);
|
|
15
15
|
return ((0, jsx_runtime_1.jsx)(ps_input_components_1.PsCheckbox, { className: 'ps-floating-option w-full', isDisabled: isVisible && visibleCount <= 1, isSelected: isVisible, label: column.label, onChange: () => onChange(isVisible
|
|
16
16
|
? [...hiddenColumnIds, column.id]
|
|
@@ -8,7 +8,7 @@ const ps_icons_1 = require("@pallasoft/ps-icons");
|
|
|
8
8
|
const react_aria_components_1 = require("react-aria-components");
|
|
9
9
|
const ps_table_query_service_1 = require("../services/ps-table-query-service");
|
|
10
10
|
const ps_table_filter_field_1 = require("./ps-table-filter-field");
|
|
11
|
-
const toolbarButtonClassName = 'ps-input-control ps-focus-ring ps-control inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control
|
|
11
|
+
const toolbarButtonClassName = 'ps-input-control ps-focus-ring ps-control ps-control-padding inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40';
|
|
12
12
|
const PsTableToolbar = ({ actions, columns, filters, isSearchable, onClearFilters, onFilterChange, onSearchChange, rows, search, searchPlaceholder, }) => {
|
|
13
13
|
const filterableColumns = columns.filter((column) => column.filter);
|
|
14
14
|
const zIndex = (0, ps_core_components_1.usePsLayerZIndex)(ps_design_system_1.PallasoftZIndex.Dropdown);
|
|
@@ -7,7 +7,7 @@ import { Button, Dialog, DialogTrigger, Popover } from 'react-aria-components';
|
|
|
7
7
|
export const PsTableColumnPicker = ({ columns, hiddenColumnIds, onChange, }) => {
|
|
8
8
|
const zIndex = usePsLayerZIndex(PallasoftZIndex.Dropdown);
|
|
9
9
|
const visibleCount = columns.filter((column) => !hiddenColumnIds.includes(column.id)).length;
|
|
10
|
-
return (_jsxs(DialogTrigger, { children: [_jsxs(Button, { className: 'ps-input-control ps-focus-ring ps-control inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control
|
|
10
|
+
return (_jsxs(DialogTrigger, { children: [_jsxs(Button, { className: 'ps-input-control ps-focus-ring ps-control ps-control-padding inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40', children: [_jsx(PsIcon, { "aria-hidden": 'true', className: 'block h-4 w-4 sm:hidden', iconKey: PsIconKey.Columns }), _jsx("span", { className: 'sr-only sm:not-sr-only', children: "Columns" }), _jsx(PsIcon, { "aria-hidden": 'true', className: 'hidden h-4 w-4 sm:block', iconKey: PsIconKey.Chevron })] }), _jsx(Popover, { className: 'ps-floating-panel w-60 outline-none', offset: 6, placement: 'bottom end', style: { zIndex }, children: _jsx(Dialog, { "aria-label": 'Columns', className: 'flex flex-col gap-0.5 p-1.5 outline-none', children: _jsx(PsLayer, { zIndex: zIndex, children: columns.map((column) => {
|
|
11
11
|
const isVisible = !hiddenColumnIds.includes(column.id);
|
|
12
12
|
return (_jsx(PsCheckbox, { className: 'ps-floating-option w-full', isDisabled: isVisible && visibleCount <= 1, isSelected: isVisible, label: column.label, onChange: () => onChange(isVisible
|
|
13
13
|
? [...hiddenColumnIds, column.id]
|
|
@@ -5,7 +5,7 @@ import { PsIcon, PsIconKey } from '@pallasoft/ps-icons';
|
|
|
5
5
|
import { Button, Dialog, DialogTrigger, Popover } from 'react-aria-components';
|
|
6
6
|
import { PsTableQueryService } from '../services/ps-table-query-service';
|
|
7
7
|
import { PsTableFilterField } from './ps-table-filter-field';
|
|
8
|
-
const toolbarButtonClassName = 'ps-input-control ps-focus-ring ps-control inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control
|
|
8
|
+
const toolbarButtonClassName = 'ps-input-control ps-focus-ring ps-control ps-control-padding inline-flex w-auto min-w-11 items-center justify-center gap-2 rounded-ps-control text-sm font-semibold text-ink outline-none transition-colors hover:border-primary/40';
|
|
9
9
|
export const PsTableToolbar = ({ actions, columns, filters, isSearchable, onClearFilters, onFilterChange, onSearchChange, rows, search, searchPlaceholder, }) => {
|
|
10
10
|
const filterableColumns = columns.filter((column) => column.filter);
|
|
11
11
|
const zIndex = usePsLayerZIndex(PallasoftZIndex.Dropdown);
|