@pantheon-systems/pds-toolkit-react 2.0.0-alpha.10 → 2.0.0-alpha.12
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/dist/components/Dropdown/Dropdown.d.ts +140 -0
- package/dist/components/Dropdown/DropdownSelectedIcon.d.ts +7 -0
- package/dist/components/Popover/Popover.d.ts +5 -1
- package/dist/components/Table/Table.d.ts +9 -18
- package/dist/components/buttons/IconButton/IconButton.d.ts +4 -0
- package/dist/components/buttons/MenuButton/MenuButton.d.ts +1 -0
- package/dist/components/charts/BarChart/BarChart.d.ts +21 -0
- package/dist/components/charts/LineChart/LineChart.d.ts +22 -0
- package/dist/components/charts/shared/ChartAccessibleTable.d.ts +17 -0
- package/dist/components/charts/shared/ChartLegend.d.ts +25 -0
- package/dist/components/charts/shared/chart-colors.d.ts +18 -0
- package/dist/components/charts/shared/chart-styles.d.ts +16 -0
- package/dist/components/charts/shared/formatters.d.ts +12 -0
- package/dist/components/charts/shared/types.d.ts +97 -0
- package/dist/components/icons/Icon/generated-icon-data.d.ts +1 -1
- package/dist/components/inputs/Combobox/Combobox.d.ts +16 -6
- package/dist/components/inputs/ComboboxMultiselect/ComboboxMultiselect.d.ts +9 -4
- package/dist/components/inputs/Select/Select.d.ts +6 -1
- package/dist/components/inputs/input-utilities.d.ts +1 -0
- package/dist/components/navigation/DropdownMenu/DropdownMenu.d.ts +1 -0
- package/dist/components/navigation/{NavMenu/NavMenu.d.ts → SiteMenu/SiteMenu.d.ts} +5 -4
- package/dist/components/navigation/SiteMenu/SiteMenuDropdown.d.ts +26 -0
- package/dist/components/navigation/WorkspaceSelector/WorkspaceSelector.d.ts +1 -0
- package/dist/css/component-css/pds-bar-chart.css +1 -0
- package/dist/css/component-css/pds-breadcrumb.css +1 -1
- package/dist/css/component-css/pds-chart-legend.css +1 -0
- package/dist/css/component-css/pds-chart-tokens.css +1 -0
- package/dist/css/component-css/pds-chart-wrapper.css +1 -0
- package/dist/css/component-css/pds-combobox-multiselect.css +4 -2
- package/dist/css/component-css/pds-combobox.css +1 -1
- package/dist/css/component-css/pds-dropdown-menu.css +2 -2
- package/dist/css/component-css/pds-dropdown.css +2 -0
- package/dist/css/component-css/pds-icon-button.css +2 -2
- package/dist/css/component-css/pds-index.css +19 -16
- package/dist/css/component-css/pds-input-utilities.css +1 -1
- package/dist/css/component-css/pds-line-chart.css +1 -0
- package/dist/css/component-css/pds-menu-button.css +1 -1
- package/dist/css/component-css/pds-nav-menu.css +2 -2
- package/dist/css/component-css/pds-pantheon-logo.css +1 -1
- package/dist/css/component-css/pds-popover.css +1 -1
- package/dist/css/component-css/pds-select.css +1 -1
- package/dist/css/component-css/pds-side-nav-global.css +6 -6
- package/dist/css/component-css/pds-table.css +1 -1
- package/dist/css/component-css/pds-text-input.css +1 -1
- package/dist/css/component-css/pds-textarea.css +1 -1
- package/dist/css/component-css/pds-tooltip.css +1 -1
- package/dist/css/component-css/pds-workspace-selector.css +1 -1
- package/dist/css/design-tokens/variables.dark.css +11 -2
- package/dist/css/design-tokens/variables.light.css +11 -2
- package/dist/css/layout-css/pds-app-layout.css +2 -2
- package/dist/css/layout-css/pds-index.css +2 -2
- package/dist/css/pds-components.css +19 -16
- package/dist/css/pds-core.css +2 -2
- package/dist/css/pds-layouts.css +2 -2
- package/dist/index.css +1 -1
- package/dist/index.d.ts +15 -0
- package/dist/index.js +4724 -2359
- package/dist/index.js.map +1 -1
- package/dist/index.source.d.ts +6 -1
- package/dist/layouts/AppLayout/AppLayout.d.ts +5 -1
- package/dist/utilities/hooks/useDropdown/index.d.ts +1 -0
- package/dist/utilities/hooks/useDropdown/useDropdown.d.ts +121 -0
- package/package.json +4 -3
- package/dist/components/navigation/NavMenu/NavMenuDropdown.d.ts +0 -24
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { ComponentPropsWithoutRef } from 'react';
|
|
2
|
+
import { NavMenuItem } from '../../../libs/types/navigation-types';
|
|
3
|
+
/**
|
|
4
|
+
* Prop types for SiteMenu
|
|
5
|
+
*/
|
|
6
|
+
interface SiteMenuDropdownProps extends ComponentPropsWithoutRef<'button'> {
|
|
7
|
+
/**
|
|
8
|
+
* Menu items. If omitted or empty, renders as a plain top-level link.
|
|
9
|
+
*/
|
|
10
|
+
items?: NavMenuItem[];
|
|
11
|
+
/**
|
|
12
|
+
* Menu label shown on the trigger button.
|
|
13
|
+
*/
|
|
14
|
+
label?: string;
|
|
15
|
+
/**
|
|
16
|
+
* Viewport width (px) below which the mobile accordion style is used.
|
|
17
|
+
*/
|
|
18
|
+
mobileMenuMaxWidth?: number;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* SiteMenu UI component — a disclosure-pattern navigation menu for websites.
|
|
22
|
+
* Opens a panel of links on click or hover (desktop). Keyboard: Tab navigates
|
|
23
|
+
* through links naturally; Escape closes the panel and returns focus to the trigger.
|
|
24
|
+
*/
|
|
25
|
+
export declare const SiteMenuDropdown: ({ items, label, mobileMenuMaxWidth, }: SiteMenuDropdownProps) => import("react/jsx-runtime").JSX.Element;
|
|
26
|
+
export {};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react';
|
|
2
2
|
import { BadgeColor } from '../../badges/Badge/Badge';
|
|
3
|
+
import '@components/Dropdown/dropdown.css';
|
|
3
4
|
import './workspace-selector.css';
|
|
4
5
|
declare const tierConfig: Record<string, {
|
|
5
6
|
color: BadgeColor;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.pds-bar-chart{font-family:var(--pds-typography-ff-default);position:relative;width:100%}.pds-bar-chart__header{align-items:center;display:flex;justify-content:flex-end;margin-block-end:var(--pds-spacing-m)}.pds-bar-chart--empty,.pds-bar-chart--loading{align-items:center;display:flex;justify-content:center}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.pds-breadcrumb{color:var(--pds-color-
|
|
1
|
+
.pds-breadcrumb{color:var(--pds-color-fg-default-secondary);font-family:var(--pds-typography-ff-default);font-size:var(--pds-typography-size-s);font-weight:var(--pds-typography-fw-regular)}.pds-breadcrumb a{color:var(--pds-color-interactive-link-default);text-decoration:none;transition:var(--pds-animation-transition-link)}.pds-breadcrumb a:hover{color:var(--pds-color-interactive-link-hover);text-decoration:underline}.pds-breadcrumb a:active{color:var(--pds-color-interactive-link-active);outline:none}.pds-breadcrumb a:focus-visible{outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:.125rem;text-decoration:none;transition:var(--pds-animation-transition-focus)}.pds-breadcrumb__crumbs{display:flex;flex-wrap:wrap;list-style-type:none;margin:0;padding:0;row-gap:var(--pds-spacing-xs)}.pds-breadcrumb__crumb{align-items:center;display:flex}.pds-breadcrumb__crumb:not(:last-child):after{color:var(--pds-color-border-separator);content:"/";font-size:var(--pds-typography-size-xs);margin-inline:var(--pds-spacing-2xs)}.pds-breadcrumb__crumb--current a{color:var(--pds-color-fg-default-secondary)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.pds-chart-legend{font-family:var(--pds-typography-ff-default);font-size:var(--pds-typography-size-s);margin-block-start:var(--pds-spacing-l)}.pds-chart-legend--inline{align-items:center;display:flex;flex-wrap:wrap;gap:var(--pds-spacing-xl);justify-content:center;margin-inline-start:3.625rem}.pds-chart-legend__item{align-items:center;color:var(--pds-color-fg-default);display:flex;gap:var(--pds-spacing-3xs)}.pds-chart-legend__swatch{border-radius:2px;display:inline-block;flex-shrink:0;height:10px;width:10px}.pds-chart-legend--table{border:var(--pds-border-width-default) solid var(--pds-color-border-default);border-radius:var(--pds-border-radius-container);margin-inline-start:3.625rem}.pds-chart-legend__table-header{border-block-end:var(--pds-border-width-default) solid var(--pds-color-border-default);color:var(--pds-color-fg-default-secondary);font-size:var(--pds-typography-size-xs);letter-spacing:var(--pds-typography-ls-m);line-height:1;padding:.75rem var(--pds-spacing-s) .625rem;text-transform:uppercase}.pds-chart-legend__table-header,.pds-chart-legend__table-row{align-items:center;display:flex;justify-content:space-between}.pds-chart-legend__table-row{padding:var(--pds-spacing-xs) var(--pds-spacing-s)}.pds-chart-legend__table-row:not(:last-child){border-block-end:var(--pds-border-width-default) solid var(--pds-color-border-default)}.pds-chart-legend__table-row-label{align-items:center;color:var(--pds-color-fg-default);display:flex;font-weight:var(--pds-typography-fw-medium);gap:var(--pds-spacing-xs)}.pds-chart-legend__table-row-value{color:var(--pds-color-fg-default);font-weight:var(--pds-typography-fw-semibold)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root,[data-theme=light]{--pds-color-datavis-categorical-1:#2563eb;--pds-color-datavis-categorical-2:#16a34a;--pds-color-datavis-categorical-3:#d97706;--pds-color-datavis-categorical-4:#dc2626;--pds-color-datavis-categorical-5:#7c3aed;--pds-color-datavis-categorical-6:#0891b2;--pds-color-datavis-categorical-7:#c026d3;--pds-color-datavis-categorical-8:#4b5563;--pds-color-datavis-categorical-9:#eab308;--pds-color-datavis-sequential-1:#003f5c;--pds-color-datavis-sequential-2:#005f73;--pds-color-datavis-sequential-3:#0a7c6a;--pds-color-datavis-sequential-4:#2d9a5b;--pds-color-datavis-sequential-5:#5ab446;--pds-color-datavis-sequential-6:#96c93d;--pds-color-datavis-sequential-7:#b5c430;--pds-color-datavis-sequential-8:#ddbd16;--pds-color-datavis-sequential-9:#b89a0e;--pds-color-datavis-sequential-10:#8a7308;--pds-color-datavis-brand-1:#12026f;--pds-color-datavis-brand-2:#4f32ce;--pds-color-datavis-brand-3:#7558d9;--pds-color-datavis-brand-4:#9b82e4;--pds-color-datavis-brand-5:#bfadef;--pds-color-datavis-brand-6:#ddd5f7;--pds-color-datavis-alert-1:var(--pds-color-status-info-foreground);--pds-color-datavis-alert-2:var(--pds-color-status-success-foreground);--pds-color-datavis-alert-3:var(--pds-color-status-warning-foreground);--pds-color-datavis-alert-4:var(--pds-color-status-critical-foreground);--pds-color-datavis-alert-5:var(--pds-color-fg-default-secondary);--pds-color-datavis-diverging-1:#043362;--pds-color-datavis-diverging-2:#064a8a;--pds-color-datavis-diverging-3:#0875e1;--pds-color-datavis-diverging-4:#5aadfa;--pds-color-datavis-diverging-5:#a6d2ff;--pds-color-datavis-diverging-6:#e3e4e5;--pds-color-datavis-diverging-7:#fcc8c5;--pds-color-datavis-diverging-8:#f4706a;--pds-color-datavis-diverging-9:#de2e21;--pds-color-datavis-diverging-10:#bc1c11;--pds-color-datavis-diverging-11:#7a120b}[data-theme=dark]{--pds-color-datavis-categorical-1:#60a5fa;--pds-color-datavis-categorical-2:#4ade80;--pds-color-datavis-categorical-3:#f59e0b;--pds-color-datavis-categorical-4:#f87171;--pds-color-datavis-categorical-5:#a78bfa;--pds-color-datavis-categorical-6:#22d3ee;--pds-color-datavis-categorical-7:#e879f9;--pds-color-datavis-categorical-8:#9ca3af;--pds-color-datavis-categorical-9:#facc15;--pds-color-datavis-sequential-1:#2da8cc;--pds-color-datavis-sequential-2:#30b8a6;--pds-color-datavis-sequential-3:#56d4a0;--pds-color-datavis-sequential-4:#72c97a;--pds-color-datavis-sequential-5:#8db85a;--pds-color-datavis-sequential-6:#a5ad42;--pds-color-datavis-sequential-7:#b8a236;--pds-color-datavis-sequential-8:#c9962e;--pds-color-datavis-sequential-9:#d4882a;--pds-color-datavis-sequential-10:#de7a26;--pds-color-datavis-brand-1:#3a20b8;--pds-color-datavis-brand-2:#6c50dc;--pds-color-datavis-brand-3:#8e74e8;--pds-color-datavis-brand-4:#ab9cf2;--pds-color-datavis-brand-5:#c4b8f7;--pds-color-datavis-brand-6:#ddd5fc;--pds-color-datavis-diverging-1:#1a6fc2;--pds-color-datavis-diverging-2:#3a8de8;--pds-color-datavis-diverging-3:#60a5fa;--pds-color-datavis-diverging-4:#93c5fd;--pds-color-datavis-diverging-5:#bddeff;--pds-color-datavis-diverging-6:#b0b5bf;--pds-color-datavis-diverging-7:#fdd8d6;--pds-color-datavis-diverging-8:#fca5a5;--pds-color-datavis-diverging-9:#f87171;--pds-color-datavis-diverging-10:#ef4444;--pds-color-datavis-diverging-11:#dc2626}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.pds-chart{font-family:var(--pds-typography-ff-default);position:relative;width:100%}.pds-chart__header{align-items:center;display:flex;justify-content:flex-end;margin-block-end:var(--pds-spacing-m)}.pds-chart--empty,.pds-chart--loading{align-items:center;display:flex;justify-content:center}.recharts-default-tooltip{background-color:var(--pds-color-bg-default)!important;border:var(--pds-border-width-default) solid var(--pds-color-border-default)!important;border-radius:var(--pds-border-radius-container)!important;box-shadow:var(--pds-elevation-overlay)!important;font-family:var(--pds-typography-ff-default)!important;font-size:var(--pds-typography-size-xs)!important;padding:var(--pds-spacing-4xs) var(--pds-spacing-xs)!important}.recharts-tooltip-label{color:var(--pds-color-fg-default)!important;font-weight:var(--pds-typography-fw-semibold)!important;margin:0!important}.recharts-tooltip-item-list li:last-child{padding-block-end:0!important}.recharts-tooltip-item-list{padding:0!important}.recharts-tooltip-item{align-items:center;color:var(--pds-color-fg-default)!important;display:flex;font-size:var(--pds-typography-size-xs)!important;gap:var(--pds-spacing-3xs);margin:0!important;padding:var(--pds-spacing-5xs) 0!important}.recharts-tooltip-item__color{border-radius:2px;display:inline-block;flex-shrink:0;height:8px;width:8px}.pds-bar-chart [aria-hidden=true]:focus,.pds-line-chart [aria-hidden=true]:focus,.recharts-surface:focus,.recharts-wrapper :focus,.recharts-wrapper:focus{outline:none}
|
|
@@ -1,2 +1,4 @@
|
|
|
1
|
-
.pds-combobox-multi{position:relative}.pds-combobox-multi:disabled .pds-combobox-multi__input-wrapper{border-color:var(--pds-color-border-disabled)}.pds-combobox-multi__items-wrapper .pds-combobox-multi__selected-item:not(:last-child){display:none}.pds-combobox-multi--show-all-tags .pds-combobox-multi__input-wrapper
|
|
2
|
-
.pds-combobox-
|
|
1
|
+
.pds-combobox-multi{position:relative}.pds-combobox-multi:disabled .pds-combobox-multi__input-wrapper{border-color:var(--pds-color-border-disabled)}.pds-combobox-multi__items-wrapper .pds-combobox-multi__selected-item:not(:last-child){display:none}.pds-combobox-multi--show-all-tags .pds-combobox-multi__input-wrapper:has(.pds-combobox-multi__items-wrapper){height:auto;min-height:var(--pds-spacing-input-height-s);padding-block:var(--pds-spacing-3xs)}.pds-combobox-multi--show-all-tags .pds-combobox-multi__items-wrapper{column-gap:var(--pds-spacing-3xs);display:flex;flex-wrap:wrap;row-gap:var(--pds-spacing-3xs)}.pds-combobox-multi--show-all-tags .pds-combobox-multi__items-wrapper .pds-combobox-multi__selected-item:not(:last-child){display:inline-flex}.pds-combobox-multi--m .pds-combobox-multi__input-wrapper{gap:var(--pds-spacing-3xs);height:var(--pds-spacing-input-height-m);padding-inline-end:var(--pds-spacing-s);padding-inline-start:var(--pds-spacing-2xs)}.pds-combobox-multi--show-all-tags.pds-combobox-multi--m
|
|
2
|
+
.pds-combobox-multi__input-wrapper:has(.pds-combobox-multi__items-wrapper){min-height:var(--pds-spacing-input-height-m)}.pds-combobox-multi--l .pds-combobox-multi__aux-panel-button,.pds-combobox-multi--m .pds-combobox-multi__aux-panel-button{height:1.5rem;width:1.5rem}.pds-combobox-multi--m .pds-combobox-multi__ai-button{padding:var(--pds-spacing-3xs) var(--pds-spacing-2xs)}.pds-combobox-multi--m .pds-combobox-multi__aux-panel{padding:var(--pds-spacing-s) var(--pds-spacing-s)}.pds-combobox-multi--m .pds-combobox-multi__aux-panel-item{font-size:var(--pds-typography-size-xs);padding:var(--pds-spacing-3xs) var(--pds-spacing-2xs)}.pds-combobox-multi--m .pds-combobox-multi__selected-item{padding:var(--pds-spacing-3xs) var(--pds-spacing-2xs)}.pds-combobox-multi--m .pds-combobox-multi__counter,.pds-combobox-multi--m .pds-combobox-multi__counter-item,.pds-combobox-multi--m .pds-combobox-multi__counter-layer{height:1.5rem}.pds-combobox-multi--l .pds-combobox-multi__input-wrapper{gap:var(--pds-spacing-3xs);height:var(--pds-spacing-input-height-l);padding-inline-end:var(--pds-spacing-s);padding-inline-start:var(--pds-spacing-2xs)}.pds-combobox-multi--show-all-tags.pds-combobox-multi--l
|
|
3
|
+
.pds-combobox-multi__input-wrapper:has(.pds-combobox-multi__items-wrapper){min-height:var(--pds-spacing-input-height-l)}.pds-combobox-multi--l .pds-combobox-multi__ai-button{padding:var(--pds-spacing-3xs)}.pds-combobox-multi--l .pds-combobox-multi__aux-panel{padding:var(--pds-spacing-m) var(--pds-spacing-s)}.pds-combobox-multi--l .pds-combobox-multi__aux-panel-item,.pds-combobox-multi--l .pds-combobox-multi__selected-item{font-size:var(--pds-typography-size-s);padding:var(--pds-spacing-3xs) var(--pds-spacing-2xs)}.pds-combobox-multi--l .pds-combobox-multi__counter,.pds-combobox-multi--l .pds-combobox-multi__counter-item,.pds-combobox-multi--l .pds-combobox-multi__counter-layer{height:1.75rem}.pds-combobox-multi--l .pds-combobox-multi__dropdown-input{font-size:var(--pds-typography-size-m)}.pds-combobox-multi--l .pds-dropdown__item{font-size:var(--pds-typography-size-m);padding-block:var(--pds-spacing-s)}.pds-combobox-multi--l .pds-input-label{font-size:var(--pds-typography-size-s);margin-block-end:var(--pds-spacing-xs)}.pds-combobox-multi--l .pds-input-message{font-size:var(--pds-typography-size-s);margin-block-start:var(--pds-spacing-xs)}.pds-combobox-multi__selected-item{align-items:center;background:var(--pds-color-input-tag-background-default);border-radius:var(--pds-border-radius-input);color:var(--pds-color-input-tag-foreground-default);display:inline-flex;font-size:.75rem;font-weight:var(--pds-typography-fw-regular);gap:var(--pds-spacing-3xs);justify-content:center;line-height:1;padding:var(--pds-spacing-4xs) var(--pds-spacing-3xs);text-wrap:nowrap}.pds-combobox-multi__selected-item:hover{background:var(--pds-color-input-tag-background-hover)}.pds-combobox-multi__selected-item:focus-visible{outline:none}.pds-combobox-multi__selected-item-text{margin-top:1px}.pds-combobox-multi__selected-item-remove{align-items:center;border-radius:var(--pds-border-radius-input);color:var(--pds-color-fg-default-secondary);cursor:pointer;display:flex;height:.75rem;justify-content:center;width:.75rem}.pds-combobox-multi__selected-item-remove:hover{color:var(--pds-color-fg-default)}.pds-combobox-multi__selected-item--marked-for-deletion .pds-combobox-multi__selected-item-remove{outline:1px solid var(--pds-color-interactive-focus)}.pds-combobox-multi__input-wrapper{align-items:center;background-color:var(--pds-color-bg-default);border:var(--pds-border-width-default) solid var(--pds-color-border-input);border-radius:var(--pds-border-radius-input);box-sizing:border-box;cursor:pointer;display:flex;gap:var(--pds-spacing-3xs);height:var(--pds-spacing-input-height-s);overflow:hidden;padding-block:0;padding-inline-end:var(--pds-spacing-xs);padding-inline-start:var(--pds-spacing-3xs);transition:var(--pds-animation-transition-input);width:100%}.pds-combobox-multi__input-wrapper:focus{outline:none}.pds-combobox-multi__input-wrapper:focus-visible,.pds-combobox-multi__input-wrapper[data-focus-method=keyboard]:focus{border-color:var(--pds-color-interactive-focus);outline:none;transition:var(--pds-animation-transition-focus)}.pds-combobox-multi__input-wrapper:has(:focus-visible){border-color:var(--pds-color-interactive-focus);transition:var(--pds-animation-transition-focus)}.pds-combobox-multi__counter{display:inline-block;height:1.25rem;position:relative}.pds-combobox-multi__counter-wrapper{display:flex;position:relative}.pds-combobox-multi__counter-layer{background-color:var(--pds-color-input-tag-background-default);width:.375rem}.pds-combobox-multi__counter-item,.pds-combobox-multi__counter-layer{border-radius:var(--pds-border-radius-input);box-shadow:-2px 0 0 0 var(--pds-color-bg-default);height:1.25rem}.pds-combobox-multi__counter-item{align-items:center;background:var(--pds-color-input-tag-background-default);color:var(--pds-color-input-tag-foreground-default);display:flex;font-size:.75rem;font-weight:var(--pds-typography-fw-regular);justify-content:center;width:1.28125rem}.pds-combobox-multi__end-actions{align-items:center;align-self:center;display:flex;flex-shrink:0;gap:var(--pds-spacing-2xs);margin-inline-start:auto}.pds-combobox-multi__trigger{align-items:center;background-color:transparent;border:none;border-radius:var(--pds-border-radius-input);color:var(--pds-color-fg-default);display:flex;justify-content:center;padding:var(--pds-spacing-4xs)}.pds-combobox-multi__trigger:disabled{cursor:not-allowed}.pds-combobox-multi__trigger:focus-visible{outline:none}.pds-combobox-multi__trigger-icon{color:var(--pds-color-fg-default-secondary);pointer-events:none;transition:var(--pds-animation-transition-rotation)}.pds-combobox-multi__trigger[aria-expanded=true]
|
|
4
|
+
.pds-combobox-multi__trigger-icon{transform:rotate(180deg);transition:var(--pds-animation-transition-rotation)}.pds-combobox-multi__dropdown{box-sizing:border-box;margin-block-start:var(--pds-spacing-2xs);max-height:18rem;overflow-x:hidden;width:100%}.pds-combobox-multi__dropdown:focus-visible{outline:none}.pds-combobox-multi__dropdown-list{flex:1;margin-block-start:0;overflow-y:auto;padding:0}.pds-combobox-multi__dropdown-input-wrapper{align-items:center;background-color:var(--pds-color-dropdown-background);border-bottom:1px solid var(--pds-color-border-default);column-gap:var(--pds-spacing-2xs);display:flex;gap:var(--pds-spacing-xs);padding:var(--pds-spacing-xs) var(--pds-spacing-m);position:sticky;top:0;z-index:1}.pds-combobox-multi__dropdown-input{background-color:transparent;border:none;caret-color:var(--pds-color-fg-default);color:var(--pds-color-fg-default);flex-grow:1;font-size:var(--pds-typography-size-s);line-height:1;padding-inline:0;width:100%}.pds-combobox-multi__dropdown-input:focus{outline:none}.pds-combobox-multi__dropdown-input::placeholder{color:var(--pds-color-input-placeholder)}.pds-combobox-multi__dropdown-item{padding:var(--pds-spacing-xs) var(--pds-spacing-m)}.pds-combobox-multi__dropdown-item-label{align-items:center;display:flex;gap:.375rem;justify-content:space-between;line-height:normal;width:100%}.pds-combobox-multi__dropdown-item-text{align-items:center;display:flex;gap:var(--pds-spacing-m)}.pds-combobox-multi__dropdown-item-badge{align-items:center;background-color:var(--pds-color-category-ai-background);border-radius:var(--pds-border-radius-default);color:var(--pds-color-category-ai-foreground);display:inline-flex;font-size:var(--pds-typography-size-xs);gap:var(--pds-spacing-4xs);padding:var(--pds-spacing-4xs) var(--pds-spacing-2xs)}.pds-combobox-multi__loading{color:var(--pds-color-fg-default);font-size:var(--pds-typography-size-m);padding:var(--pds-spacing-m)}.pds-combobox-multi__ai-button{align-items:center;background-color:var(--pds-color-category-ai-background);border:none;border-radius:var(--pds-border-radius-default);color:var(--pds-color-category-ai-foreground);cursor:pointer;display:flex;justify-content:center;padding:var(--pds-spacing-4xs);transition:opacity .2s ease}.pds-combobox-multi__ai-button:hover{opacity:.8}.pds-combobox-multi__ai-button:disabled{cursor:not-allowed;opacity:.5}.pds-combobox-multi__ai-button:focus-visible{outline:1px solid var(--pds-color-interactive-focus)}.pds-combobox-multi__ai-icon{color:var(--pds-color-category-ai-foreground);font-size:.875rem;pointer-events:none}[data-theme=dark] .pds-combobox-multi__aux-panel{background-color:oklch(.36 .004 264)}.pds-combobox-multi__aux-panel{align-items:center;background-color:var(--pds-color-bg-default-secondary);border:none;border-radius:var(--pds-border-radius-container);box-shadow:var(--pds-elevation-overlay);box-sizing:border-box;display:flex;flex-direction:row;gap:var(--pds-spacing-2xs);padding:var(--pds-spacing-xs) var(--pds-spacing-xs);position:absolute}.pds-combobox-multi__aux-panel-content{align-items:center;display:flex;flex:1;gap:var(--pds-spacing-xs)}.pds-combobox-multi__aux-panel-header{align-items:center;display:flex;gap:var(--pds-spacing-xs);margin-inline-start:auto}.pds-combobox-multi__aux-panel-icon{color:var(--pds-color-fg-default-secondary);flex-shrink:0}.pds-combobox-multi__aux-panel-button{align-items:center;background-color:transparent;border:none;border-radius:var(--pds-border-radius-input);color:var(--pds-color-fg-default);cursor:pointer;display:flex;flex-shrink:0;height:1.25rem;justify-content:center;transition:background-color .2s ease;width:1.25rem}.pds-combobox-multi__aux-panel-button:hover{background-color:var(--pds-color-bg-default);color:var(--pds-color-fg-default)}.pds-combobox-multi__aux-panel-button:disabled{cursor:not-allowed}.pds-combobox-multi__aux-panel-button:focus-visible{outline:1px solid var(--pds-color-interactive-focus)}[data-theme=dark] .pds-combobox-multi__aux-panel-button:hover{background-color:oklch(.3 .02 275);color:var(--pds-color-fg-default)}.pds-combobox-multi__aux-panel-refresh-icon{height:.8125rem;width:.8125rem}.pds-combobox-multi__aux-panel-button-icon--rotating{animation:rotate 1s linear infinite}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.pds-combobox-multi__aux-panel-items{display:flex;flex:1;flex-wrap:wrap;gap:var(--pds-spacing-3xs);padding-inline-start:var(--pds-spacing-4xs)}.pds-combobox-multi__aux-panel-item{align-items:center;background-color:var(--pds-color-bg-default);border:1px solid transparent;border-radius:var(--pds-border-radius-input);color:var(--pds-color-fg-default);cursor:pointer;display:inline-flex;font-size:.75rem;font-weight:var(--pds-typography-fw-regular);justify-content:center;line-height:1;padding:var(--pds-spacing-4xs) var(--pds-spacing-3xs);text-wrap:nowrap;transition:background-color .2s ease,border-color .2s ease}.pds-combobox-multi__aux-panel-item:hover{background-color:var(--pds-color-category-ai-background);border-color:var(--pds-color-category-ai-foreground)}.pds-combobox-multi__aux-panel-item:focus-visible{outline:1px solid var(--pds-color-interactive-focus)}.pds-combobox-multi__aux-panel-item--selected{border-color:var(--pds-color-category-ai-foreground)}[data-theme=dark] .pds-combobox-multi__aux-panel-item{background-color:oklch(.3 .02 275)}[data-theme=dark] .pds-combobox-multi__aux-panel-item:hover{background-color:oklch(.42 .06 275);border-color:var(--pds-color-category-ai-utility)}[data-theme=dark] .pds-combobox-multi__aux-panel-item--selected{border-color:var(--pds-color-category-ai-utility)}.pds-combobox-multi__aux-panel-content{padding:var(--pds-spacing-3xs) var(--pds-spacing-6xs)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.pds-combobox{position:relative}.pds-combobox__input-wrapper{align-items:center;background-color:var(--pds-color-bg-default);border:var(--pds-border-width-default) solid var(--pds-color-border-input);border-radius:var(--pds-border-radius-
|
|
1
|
+
.pds-combobox{position:relative}.pds-combobox__input-wrapper{align-items:center;background-color:var(--pds-color-bg-default);border:var(--pds-border-width-default) solid var(--pds-color-border-input);border-radius:var(--pds-border-radius-input);display:flex;gap:var(--pds-spacing-xs);height:var(--pds-spacing-input-height-s);padding-inline:var(--pds-spacing-xs);position:relative;transition:var(--pds-animation-transition-input);width:100%}.pds-combobox__input-wrapper:focus-within{border-color:var(--pds-color-interactive-focus);outline:none;transition:var(--pds-animation-transition-focus)}.pds-combobox--m .pds-combobox__input-wrapper{gap:var(--pds-spacing-s);height:var(--pds-spacing-input-height-m);padding-inline:var(--pds-spacing-s)}.pds-combobox--l .pds-combobox__input-wrapper{gap:var(--pds-spacing-s);height:var(--pds-spacing-input-height-l);padding-inline:var(--pds-spacing-s)}.pds-combobox--l .pds-combobox__input,.pds-combobox--l .pds-dropdown__item{font-size:var(--pds-typography-size-m)}.pds-combobox--l .pds-dropdown__item{padding-block:var(--pds-spacing-s)}.pds-combobox--l .pds-input-label{font-size:var(--pds-typography-size-s);margin-block-end:var(--pds-spacing-xs)}.pds-combobox--l .pds-input-message{font-size:var(--pds-typography-size-s);margin-block-start:var(--pds-spacing-xs)}.pds-combobox__input{background-color:transparent;border:none;caret-color:var(--pds-color-fg-default);color:var(--pds-color-fg-default);flex-grow:1;font-size:var(--pds-typography-size-s);line-height:1;padding-inline:0;width:100%}.pds-combobox__input:focus{outline:none}.pds-combobox__input::placeholder{color:var(--pds-color-input-placeholder)}.pds-combobox__trigger{align-items:center;background-color:transparent;border:none;border-radius:var(--pds-border-radius-input);display:flex;justify-content:center;padding:var(--pds-spacing-4xs)}.pds-combobox__trigger:hover{background-color:var(--pds-color-interactive-background-hover)}.pds-combobox__trigger:focus-visible{background-color:var(--pds-color-interactive-background-hover);outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus)}.pds-combobox__trigger-icon{color:var(--pds-color-fg-default-secondary);pointer-events:none;transition:var(--pds-animation-transition-rotation)}.pds-combobox__trigger[aria-expanded=true] .pds-combobox__trigger-icon{transform:rotate(180deg);transition:var(--pds-animation-transition-rotation)}.pds-combobox__trigger-icon.pds-icon--m{height:.8125rem;width:.8125rem}.pds-combobox--l .pds-combobox__trigger-icon.pds-icon--m,.pds-combobox--m .pds-combobox__trigger-icon.pds-icon--m{height:1rem;width:1rem}.pds-combobox__dropdown{margin-block-start:var(--pds-spacing-xs);max-height:18rem;overflow-x:hidden}.pds-combobox__dropdown:focus-visible{outline:none}.pds-combobox__options{display:flex;flex-direction:column;list-style:none;margin:0;padding:0}.pds-combobox__loading{color:var(--pds-color-fg-default);font-size:var(--pds-typography-size-m);padding:var(--pds-spacing-m)}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.pds-dropdown-menu{position:relative}.pds-dropdown-menu__heading{font-weight:var(--pds-typography-fw-semibold);margin-block-end:var(--pds-spacing-s)}.pds-dropdown-menu__heading a{color:var(--pds-color-fg-default);text-decoration:none}.pds-dropdown-menu__heading a:hover{color:var(--pds-color-interactive-link-hover)}.pds-dropdown-menu__trigger{align-items:center;background-color:var(--pds-color-bg-default);border:var(--pds-border-width-default) solid var(--pds-color-border-input);border-radius:var(--pds-border-radius-
|
|
2
|
-
.pds-dropdown-menu__trigger-icon{transform:rotate(180deg);transition:var(--pds-animation-transition-rotation)}.pds-dropdown-menu__dropdown{
|
|
1
|
+
.pds-dropdown-menu{position:relative}.pds-dropdown-menu__heading{font-weight:var(--pds-typography-fw-semibold);margin-block-end:var(--pds-spacing-s)}.pds-dropdown-menu__heading a{color:var(--pds-color-fg-default);text-decoration:none}.pds-dropdown-menu__heading a:hover{color:var(--pds-color-interactive-link-hover)}.pds-dropdown-menu__trigger{align-items:center;background-color:var(--pds-color-bg-default);border:var(--pds-border-width-default) solid var(--pds-color-border-input);border-radius:var(--pds-border-radius-input);color:var(--pds-color-fg-default);cursor:pointer;display:flex;height:var(--pds-spacing-input-height-m);justify-content:space-between;padding:0 var(--pds-spacing-s);text-align:left;width:100%}.pds-dropdown-menu__trigger:focus-visible{outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus)}.pds-dropdown-menu__trigger-icon{color:var(--pds-color-fg-default-secondary);transition:var(--pds-animation-transition-rotation)}.pds-dropdown-menu__trigger[aria-expanded=true]
|
|
2
|
+
.pds-dropdown-menu__trigger-icon{transform:rotate(180deg);transition:var(--pds-animation-transition-rotation)}.pds-dropdown-menu__dropdown{margin-block-start:var(--pds-spacing-xs);max-height:30rem;overflow-y:auto;width:100%}.pds-dropdown-menu__dropdown .pds-dropdown__item>a{color:inherit;flex:1;text-decoration:none}.pds-dropdown-menu__item--second-level>a{padding-inline-start:var(--pds-spacing-2xl)}.pds-dropdown-menu__item--third-level>a{padding-inline-start:calc(var(--pds-spacing-2xl) + var(--pds-spacing-xl))}.pds-dropdown-menu__item--fourth-level>a{padding-inline-start:calc(var(--pds-spacing-2xl) + var(--pds-spacing-xl) + var(--pds-spacing-xl))}.pds-dropdown-menu__active-label{display:flex}.pds-dropdown-menu__active-icon{margin-inline:var(--pds-spacing-m)}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.pds-dropdown{position:relative}.pds-dropdown--inline{display:inline-block}.pds-dropdown__trigger{align-items:center;background:transparent;border:none;border-radius:var(--pds-border-radius-container);color:inherit;cursor:pointer;display:inline-flex;font-family:inherit;gap:var(--pds-spacing-3xs);padding:var(--pds-spacing-3xs) var(--pds-spacing-2xs);transition:background-color .15s ease}.pds-dropdown__trigger:hover{background-color:var(--pds-color-interactive-background-hover)}.pds-dropdown__trigger:focus-visible{outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:1px}.pds-dropdown__trigger-icon{color:var(--pds-color-fg-default-secondary);transition:var(--pds-animation-transition-rotation)}.pds-dropdown__trigger[aria-expanded=true] .pds-dropdown__trigger-icon{transform:rotate(180deg)}.pds-dropdown__panel{background-color:var(--pds-color-dropdown-background);border-radius:var(--pds-border-radius-container);box-shadow:var(--pds-elevation-overlay);flex-direction:column;margin:0;min-width:10rem;overflow-y:auto;padding:0;z-index:var(--pds-z-index-dropdown)}.pds-dropdown__item,.pds-dropdown__panel{display:flex;list-style:none;outline:none}.pds-dropdown__item{align-items:center;border-radius:0;color:var(--pds-color-dropdown-foreground);cursor:pointer;gap:var(--pds-spacing-xs);justify-content:space-between;padding-block:var(--pds-spacing-xs);padding-inline:var(--pds-spacing-s)}.pds-dropdown__item:focus-visible:not(:hover){outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:-1px}.pds-dropdown__item:first-child{border-radius:var(--pds-border-radius-container) var(--pds-border-radius-container) 0 0}.pds-dropdown__item:last-child{border-radius:0 0 var(--pds-border-radius-container) var(--pds-border-radius-container)}.pds-dropdown__item--focused,.pds-dropdown__item:hover{background-color:var(--pds-color-dropdown-item-background-hover)}.pds-dropdown__item:active{background-color:var(--pds-color-dropdown-item-background-active)}.pds-dropdown__selected-icon{align-self:center;color:var(--pds-color-status-success-foreground);display:flex;flex-shrink:0;height:.875em;width:.875em}.pds-dropdown__item--critical{color:var(--pds-color-status-critical-foreground)}.pds-dropdown__item--disabled{cursor:not-allowed;opacity:.5;pointer-events:none}.pds-dropdown__item-content{align-items:center;display:flex;gap:var(--pds-spacing-xs)}.pds-dropdown__item-icon{display:flex;flex-shrink:0}.pds-dropdown__item-label{display:flex;flex-direction:column}.pds-dropdown__item-description{color:var(--pds-color-fg-default-secondary);font-size:var(--pds-typography-size-xs);line-height:var(--pds-typography-lh-s);margin-block-start:var(--pds-spacing-4xs)}.pds-dropdown__item-trailing{display:flex;flex-shrink:0}.pds-dropdown__heading{color:var(--pds-color-dropdown-heading);font-size:var(--pds-typography-size-xs);font-weight:var(--pds-typography-fw-semibold);line-height:var(--pds-typography-lh-s);list-style:none;padding:var(--pds-spacing-m) var(--pds-spacing-s) var(--pds-spacing-4xs)}.pds-dropdown__separator{border-block-end:var(--pds-border-width-default) solid var(--pds-color-border-default);list-style:none}.pds-dropdown__filter{list-style:none;padding:0}.pds-dropdown__filter-wrapper{align-items:center;display:flex;position:relative}.pds-dropdown__filter-icon{color:var(--pds-color-fg-default-secondary);left:var(--pds-spacing-s);pointer-events:none;position:absolute}.pds-dropdown__filter-wrapper:has(.pds-dropdown__filter-icon)
|
|
2
|
+
.pds-dropdown__filter-input{padding-inline-start:calc(var(--pds-spacing-s) + var(--pds-spacing-xl))}.pds-dropdown__filter-input{background-color:transparent;border:none;border-block-end:var(--pds-border-width-default) solid var(--pds-color-border-separator);border-radius:0;box-sizing:border-box;color:var(--pds-color-fg-default);font-family:inherit;font-size:var(--pds-typography-size-s);padding:var(--pds-spacing-xs) var(--pds-spacing-s);width:100%}.pds-dropdown__filter-input::placeholder{color:var(--pds-color-input-placeholder);font-size:var(--pds-typography-size-xs)}.pds-dropdown__filter-input:focus-visible{border-radius:var(--pds-border-radius-container) var(--pds-border-radius-container) 0 0;outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus);outline-offset:-3px}.pds-dropdown__no-results{color:var(--pds-color-fg-default-secondary);font-size:var(--pds-typography-size-s);padding-block:var(--pds-spacing-xs);padding-inline:var(--pds-spacing-s)}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
--pds-color-icon-button-standard-background-hover
|
|
5
5
|
);--icon-button-border:var(--pds-color-icon-button-standard-border-default);--icon-button-border-hover:var(
|
|
6
6
|
--pds-color-icon-button-standard-border-hover
|
|
7
|
-
);--icon-button-foreground:var(--pds-color-icon-button-standard-foreground);background-color:var(--icon-button-background);border:var(--pds-border-width-default) solid
|
|
7
|
+
);--icon-button-foreground:var(--pds-color-icon-button-standard-foreground);background-color:var(--icon-button-background);border:var(--pds-border-width-default) solid transparent;border-radius:var(--pds-border-radius-input);box-sizing:border-box;color:var(--icon-button-foreground);cursor:pointer;height:var(--icon-button-size);padding:var(--icon-button-padding);text-decoration:none;transition:var(--pds-animation-transition-button);width:var(--icon-button-size)}.pds-icon-button,.pds-icon-button__content{align-items:center;display:flex;justify-content:center}.pds-icon-button__content{align-content:stretch;height:100%}.pds-icon-button:disabled .pds-icon-button__content{cursor:not-allowed;opacity:45%}.pds-icon-button:hover:enabled,a.pds-icon-button:hover{background-color:var(--icon-button-background-hover);color:var(--icon-button-foreground);text-decoration:none}.pds-icon-button--has-border{border-color:var(--icon-button-border)}.pds-icon-button--has-border:hover:enabled,a.pds-icon-button--has-border:hover{border-color:var(--icon-button-border-hover)}.pds-icon-button:focus-visible{outline:var(--pds-border-width-default) solid var(--pds-color-interactive-focus)}.pds-icon-button--reverse{--icon-button-background:var(
|
|
8
8
|
--pds-color-icon-button-reverse-background-default
|
|
9
9
|
);--icon-button-background-hover:var(
|
|
10
10
|
--pds-color-icon-button-reverse-background-hover
|
|
@@ -14,4 +14,4 @@
|
|
|
14
14
|
--pds-color-icon-button-critical-background-hover
|
|
15
15
|
);--icon-button-border:var(--pds-color-icon-button-critical-border-default);--icon-button-border-hover:var(
|
|
16
16
|
--pds-color-icon-button-critical-border-hover
|
|
17
|
-
);--icon-button-foreground:var(--pds-color-icon-button-critical-foreground)}.pds-icon-button--m{--icon-button-size:var(--pds-spacing-button-height-m);--icon-button-padding:var(--pds-spacing-button-padding-inline-m)}.pds-icon-
|
|
17
|
+
);--icon-button-foreground:var(--pds-color-icon-button-critical-foreground)}.pds-icon-button--m{--icon-button-size:var(--pds-spacing-button-height-m);--icon-button-padding:var(--pds-spacing-button-padding-inline-m)}.pds-icon-button__icon-wrapper{align-items:center;display:flex;justify-content:center;position:absolute}.pds-icon-button--fadeOut{-webkit-animation:scale-down-center .4s cubic-bezier(.25,.46,.45,.94) both;animation:scale-down-center .4s cubic-bezier(.25,.46,.45,.94) both;opacity:0;transition:.2s ease-in}.pds-icon-button--hide{display:none}.pds-icon-button--scaleIn{-webkit-animation:scale-in-center .2s cubic-bezier(.175,.885,.32,1.275) both;animation:scale-in-center .2s cubic-bezier(.175,.885,.32,1.275) both}.pds-icon--copy.pds-icon--copy.pds-icon-button__icon{transform:translateX(8%) translateY(-2%)}@keyframes scale-in-center{0%{opacity:1;-webkit-transform:scale(0);transform:scale(0)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}
|