@oslokommune/punkt-elements 16.8.2 → 16.9.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.
- package/CHANGELOG.md +34 -0
- package/dist/accordion.d.ts +1 -1
- package/dist/alert.d.ts +1 -1
- package/dist/backlink.d.ts +1 -1
- package/dist/base-elements/element-with-slot.d.ts +21 -0
- package/dist/base-elements/element.d.ts +32 -0
- package/dist/base-elements/input-element.d.ts +173 -0
- package/dist/base-elements/options-input-element.d.ts +73 -0
- package/dist/breadcrumbs.d.ts +1 -1
- package/dist/button.d.ts +1 -1
- package/dist/calendar.d.ts +1 -1
- package/dist/card.d.ts +1 -1
- package/dist/checkbox.d.ts +1 -1
- package/dist/combobox.d.ts +1 -1
- package/dist/components/accordion/accordion.d.ts +20 -0
- package/dist/components/accordion/accordion.test.d.ts +0 -0
- package/dist/components/accordion/accordionitem.d.ts +32 -0
- package/dist/components/accordion/index.d.ts +5 -0
- package/dist/components/alert/alert.d.ts +30 -0
- package/dist/components/alert/alert.test.d.ts +13 -0
- package/dist/components/alert/index.d.ts +3 -0
- package/dist/components/backlink/backlink.d.ts +14 -0
- package/dist/components/backlink/backlink.test.d.ts +10 -0
- package/dist/components/backlink/index.d.ts +4 -0
- package/dist/components/breadcrumbs/breadcrumbs.d.ts +15 -0
- package/dist/components/breadcrumbs/breadcrumbs.test.d.ts +0 -0
- package/dist/components/breadcrumbs/index.d.ts +2 -0
- package/dist/components/button/button.d.ts +53 -0
- package/dist/components/button/button.test.d.ts +22 -0
- package/dist/components/button/index.d.ts +4 -0
- package/dist/components/calendar/calendar.accessibility.test.d.ts +16 -0
- package/dist/components/calendar/calendar.constraints.test.d.ts +0 -0
- package/dist/components/calendar/calendar.core.test.d.ts +0 -0
- package/dist/components/calendar/calendar.d.ts +97 -0
- package/dist/components/calendar/calendar.interaction.test.d.ts +0 -0
- package/dist/components/calendar/calendar.selection.test.d.ts +0 -0
- package/dist/components/calendar/index.d.ts +3 -0
- package/dist/components/card/card.d.ts +64 -0
- package/dist/components/card/card.test.d.ts +22 -0
- package/dist/components/card/index.d.ts +3 -0
- package/dist/components/checkbox/checkbox.d.ts +32 -0
- package/dist/components/checkbox/checkbox.test.d.ts +24 -0
- package/dist/components/checkbox/index.d.ts +3 -0
- package/dist/components/combobox/combobox-base.d.ts +74 -0
- package/dist/components/combobox/combobox-handlers.d.ts +28 -0
- package/dist/components/combobox/combobox-types.d.ts +5 -0
- package/dist/components/combobox/combobox-utils.d.ts +41 -0
- package/dist/components/combobox/combobox-value.d.ts +17 -0
- package/dist/components/combobox/combobox.accessibility.test.d.ts +0 -0
- package/dist/components/combobox/combobox.core.test.d.ts +0 -0
- package/dist/components/combobox/combobox.d.ts +61 -0
- package/dist/components/combobox/combobox.interaction.test.d.ts +0 -0
- package/dist/components/combobox/combobox.selection.test.d.ts +0 -0
- package/dist/components/combobox/index.d.ts +4 -0
- package/dist/components/consent/consent.d.ts +46 -0
- package/dist/components/consent/consent.test.d.ts +16 -0
- package/dist/components/consent/index.d.ts +4 -0
- package/dist/components/consent/strings.d.ts +85 -0
- package/dist/components/datepicker/date-tags.d.ts +20 -0
- package/dist/components/datepicker/date-tags.test.d.ts +12 -0
- package/dist/components/datepicker/datepicker-base.d.ts +39 -0
- package/dist/components/datepicker/datepicker-multiple.d.ts +10 -0
- package/dist/components/datepicker/datepicker-popup.d.ts +34 -0
- package/dist/components/datepicker/datepicker-popup.test.d.ts +4 -0
- package/dist/components/datepicker/datepicker-range.d.ts +12 -0
- package/dist/components/datepicker/datepicker-single.d.ts +8 -0
- package/dist/components/datepicker/datepicker-types.d.ts +6 -0
- package/dist/components/datepicker/datepicker-utils.d.ts +77 -0
- package/dist/components/datepicker/datepicker-utils.test.d.ts +1 -0
- package/dist/components/datepicker/datepicker.accessibility.test.d.ts +0 -0
- package/dist/components/datepicker/datepicker.core.test.d.ts +0 -0
- package/dist/components/datepicker/datepicker.d.ts +83 -0
- package/dist/components/datepicker/datepicker.input.test.d.ts +0 -0
- package/dist/components/datepicker/datepicker.selection.test.d.ts +0 -0
- package/dist/components/datepicker/datepicker.validation.test.d.ts +0 -0
- package/dist/components/datepicker/index.d.ts +6 -0
- package/dist/components/header/header-service.d.ts +86 -0
- package/dist/components/header/header-service.test.d.ts +18 -0
- package/dist/components/header/header-user-menu.d.ts +29 -0
- package/dist/components/header/header-utils.d.ts +6 -0
- package/dist/components/header/header.d.ts +52 -0
- package/dist/components/header/index.d.ts +5 -0
- package/dist/components/header/types.d.ts +59 -0
- package/dist/components/heading/heading.d.ts +28 -0
- package/dist/components/heading/heading.test.d.ts +0 -0
- package/dist/components/heading/index.d.ts +4 -0
- package/dist/components/helptext/helptext.d.ts +9 -0
- package/dist/components/helptext/helptext.test.d.ts +0 -0
- package/dist/components/helptext/index.d.ts +3 -0
- package/dist/components/icon/icon.d.ts +22 -0
- package/dist/components/icon/icon.test.d.ts +10 -0
- package/dist/components/icon/index.d.ts +3 -0
- package/dist/components/index.d.ts +45 -0
- package/dist/components/input-wrapper/index.d.ts +3 -0
- package/dist/components/input-wrapper/input-wrapper.d.ts +39 -0
- package/dist/components/input-wrapper/input-wrapper.test.d.ts +31 -0
- package/dist/components/link/index.d.ts +3 -0
- package/dist/components/link/link.d.ts +12 -0
- package/dist/components/link/link.test.d.ts +15 -0
- package/dist/components/linkcard/index.d.ts +4 -0
- package/dist/components/linkcard/linkcard.d.ts +19 -0
- package/dist/components/linkcard/linkcard.test.d.ts +9 -0
- package/dist/components/listbox/index.d.ts +4 -0
- package/dist/components/listbox/listbox.d.ts +64 -0
- package/dist/components/listbox/listbox.interaction.test.d.ts +10 -0
- package/dist/components/listbox/listbox.test.d.ts +10 -0
- package/dist/components/loader/index.d.ts +4 -0
- package/dist/components/loader/loader.d.ts +53 -0
- package/dist/components/loader/loader.test.d.ts +8 -0
- package/dist/components/messagebox/index.d.ts +4 -0
- package/dist/components/messagebox/messagebox.d.ts +21 -0
- package/dist/components/messagebox/messagebox.test.d.ts +8 -0
- package/dist/components/modal/index.d.ts +3 -0
- package/dist/components/modal/modal.d.ts +41 -0
- package/dist/components/progressbar/index.d.ts +4 -0
- package/dist/components/progressbar/progressbar.d.ts +49 -0
- package/dist/components/progressbar/progressbar.test.d.ts +8 -0
- package/dist/components/radiobutton/index.d.ts +3 -0
- package/dist/components/radiobutton/radiobutton.d.ts +24 -0
- package/dist/components/radiobutton/radiobutton.test.d.ts +28 -0
- package/dist/components/select/index.d.ts +4 -0
- package/dist/components/select/select.d.ts +48 -0
- package/dist/components/select/select.test.d.ts +21 -0
- package/dist/components/tabs/index.d.ts +5 -0
- package/dist/components/tabs/tabitem.d.ts +33 -0
- package/dist/components/tabs/tabs-context.d.ts +21 -0
- package/dist/components/tabs/tabs.d.ts +23 -0
- package/dist/components/tabs/tabs.test.d.ts +0 -0
- package/dist/components/tag/index.d.ts +4 -0
- package/dist/components/tag/tag.d.ts +44 -0
- package/dist/components/tag/tag.test.d.ts +8 -0
- package/dist/components/textarea/index.d.ts +3 -0
- package/dist/components/textarea/textarea.d.ts +16 -0
- package/dist/components/textarea/textarea.test.d.ts +27 -0
- package/dist/components/textinput/index.d.ts +3 -0
- package/dist/components/textinput/textinput.d.ts +21 -0
- package/dist/components/textinput/textinput.test.d.ts +32 -0
- package/dist/components/timepicker/index.d.ts +2 -0
- package/dist/components/timepicker/timepicker.d.ts +94 -0
- package/dist/components/timepicker/timepicker.test.d.ts +22 -0
- package/dist/consent.d.ts +1 -1
- package/dist/controllers/pkt-options-controller.d.ts +21 -0
- package/dist/controllers/pkt-slot-utils.d.ts +3 -0
- package/dist/datepicker.d.ts +1 -1
- package/dist/directives/slot-content.d.ts +128 -0
- package/dist/directives/slot-content.test.d.ts +0 -0
- package/dist/docs/backlink.d.ts +4 -0
- package/dist/docs/components/accordion.d.ts +5 -0
- package/dist/docs/components/alert.d.ts +7 -0
- package/dist/docs/components/backlink.d.ts +4 -0
- package/dist/docs/components/breadcrumbs.d.ts +8 -0
- package/dist/docs/components/button.d.ts +11 -0
- package/dist/docs/components/calendar.d.ts +4 -0
- package/dist/docs/components/card.d.ts +27 -0
- package/dist/docs/components/checkbox.d.ts +8 -0
- package/dist/docs/components/combobox.d.ts +11 -0
- package/dist/docs/components/comboboxdemo.d.ts +4 -0
- package/dist/docs/components/consent.d.ts +4 -0
- package/dist/docs/components/datepicker.d.ts +4 -0
- package/dist/docs/components/datepickermultiple.d.ts +4 -0
- package/dist/docs/components/form.d.ts +9 -0
- package/dist/docs/components/header-full.d.ts +23 -0
- package/dist/docs/components/header.d.ts +18 -0
- package/dist/docs/components/heading.d.ts +12 -0
- package/dist/docs/components/icon.d.ts +4 -0
- package/dist/docs/components/input-wrapper.d.ts +4 -0
- package/dist/docs/components/link.d.ts +4 -0
- package/dist/docs/components/linkcard.d.ts +4 -0
- package/dist/docs/components/loader.d.ts +4 -0
- package/dist/docs/components/messagebox.d.ts +4 -0
- package/dist/docs/components/modal.d.ts +14 -0
- package/dist/docs/components/progressbar.d.ts +9 -0
- package/dist/docs/components/radiobutton.d.ts +12 -0
- package/dist/docs/components/select.d.ts +10 -0
- package/dist/docs/components/slots.d.ts +35 -0
- package/dist/docs/components/tabs.d.ts +31 -0
- package/dist/docs/components/tag.d.ts +4 -0
- package/dist/docs/components/textarea.d.ts +4 -0
- package/dist/docs/components/textinput.d.ts +4 -0
- package/dist/docs/components/timepicker.d.ts +4 -0
- package/dist/docs/header.d.ts +14 -0
- package/dist/docs/punkt-docs.d.ts +12 -0
- package/dist/header.d.ts +1 -1
- package/dist/heading.d.ts +1 -1
- package/dist/helpers/converters.d.ts +9 -0
- package/dist/helptext.d.ts +1 -1
- package/dist/icon.d.ts +1 -1
- package/dist/index.d.ts +2 -1971
- package/dist/input-wrapper.d.ts +1 -1
- package/dist/link.d.ts +1 -1
- package/dist/linkcard.d.ts +1 -1
- package/dist/listbox.d.ts +1 -1
- package/dist/loader.d.ts +1 -1
- package/dist/messagebox.d.ts +1 -1
- package/dist/modal.d.ts +1 -1
- package/dist/progressbar.d.ts +1 -1
- package/dist/radiobutton.d.ts +1 -1
- package/dist/select.d.ts +1 -1
- package/dist/shared-types/aria.d.ts +65 -0
- package/dist/shared-types/booleanish.d.ts +13 -0
- package/dist/shared-types/calendar.d.ts +41 -0
- package/dist/shared-types/combobox.d.ts +34 -0
- package/dist/shared-types/datepicker.d.ts +46 -0
- package/dist/shared-types/form.d.ts +16 -0
- package/dist/shared-types/header.d.ts +88 -0
- package/dist/shared-types/heading.d.ts +9 -0
- package/dist/shared-types/index.d.ts +17 -0
- package/dist/shared-types/layout.d.ts +26 -0
- package/dist/shared-types/progressbar.d.ts +5 -0
- package/dist/shared-types/size.d.ts +18 -0
- package/dist/shared-types/skin.d.ts +24 -0
- package/dist/shared-types/timepicker.d.ts +20 -0
- package/dist/shared-utils/calendar/calendar-grid.d.ts +16 -0
- package/dist/shared-utils/calendar/date-validation.d.ts +22 -0
- package/dist/shared-utils/calendar/index.d.ts +10 -0
- package/dist/shared-utils/calendar/keyboard-navigation.d.ts +16 -0
- package/dist/shared-utils/calendar/selection-manager.d.ts +30 -0
- package/dist/shared-utils/combobox/index.d.ts +10 -0
- package/dist/shared-utils/combobox/input-utils.d.ts +38 -0
- package/dist/shared-utils/combobox/keyboard-navigation.d.ts +39 -0
- package/dist/shared-utils/combobox/option-utils.d.ts +50 -0
- package/dist/shared-utils/combobox/selection-manager.d.ts +71 -0
- package/dist/shared-utils/combobox/typeahead.d.ts +24 -0
- package/dist/shared-utils/date-utils.d.ts +138 -0
- package/dist/shared-utils/datepicker-utils.d.ts +73 -0
- package/dist/shared-utils/device-utils.d.ts +10 -0
- package/dist/shared-utils/timepicker/index.d.ts +6 -0
- package/dist/shared-utils/timepicker/options.d.ts +19 -0
- package/dist/shared-utils/timepicker/stepper.d.ts +20 -0
- package/dist/shared-utils/timepicker/time-utils.d.ts +19 -0
- package/dist/shared-utils/utils.d.ts +16 -0
- package/dist/shared-utils/value-utils.d.ts +17 -0
- package/dist/tabs.d.ts +1 -1
- package/dist/tag.d.ts +1 -1
- package/dist/tests/component-registry.d.ts +64 -0
- package/dist/tests/test-framework.d.ts +29 -0
- package/dist/textarea.d.ts +1 -1
- package/dist/textinput.d.ts +1 -1
- package/dist/timepicker.d.ts +1 -1
- package/dist/translations/no.json.d.ts +93 -0
- package/dist/types/index.d.ts +4 -0
- package/dist/types/size.d.ts +1 -0
- package/dist/types/typeUtils.d.ts +6 -0
- package/dist/utils/classutils.d.ts +12 -0
- package/package.json +3 -3
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { PktElement } from '../../base-elements/element';
|
|
2
|
+
import { ElementProps } from '../../types/typeUtils';
|
|
3
|
+
import { PktIconName } from '@oslokommune/punkt-assets/dist/icons/icon';
|
|
4
|
+
import { PropertyValues } from 'lit';
|
|
5
|
+
type Props = ElementProps<PktIcon, 'path' | 'name'>;
|
|
6
|
+
export declare class PktIcon extends PktElement<Props> {
|
|
7
|
+
path: string | undefined;
|
|
8
|
+
name: PktIconName;
|
|
9
|
+
private icon;
|
|
10
|
+
private _updatedProps;
|
|
11
|
+
connectedCallback(): void;
|
|
12
|
+
attributeChangedCallback(name: string, _old: string | null, value: string | null): Promise<void>;
|
|
13
|
+
protected updated(_changedProperties: PropertyValues): Promise<void>;
|
|
14
|
+
protected getIcon(name?: PktIconName): Promise<void>;
|
|
15
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
16
|
+
}
|
|
17
|
+
declare global {
|
|
18
|
+
interface HTMLElementTagNameMap {
|
|
19
|
+
'pkt-icon': PktIcon;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
import { PktIcon } from './icon';
|
|
3
|
+
export interface IconTestConfig extends BaseTestConfig {
|
|
4
|
+
name?: string;
|
|
5
|
+
path?: string;
|
|
6
|
+
}
|
|
7
|
+
export declare const createIconTest: (config?: IconTestConfig) => Promise<{
|
|
8
|
+
container: HTMLElement;
|
|
9
|
+
icon: PktIcon;
|
|
10
|
+
}>;
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export { PktAlert } from './alert';
|
|
2
|
+
export { PktAccordion, PktAccordionItem } from './accordion';
|
|
3
|
+
export { PktBackLink } from './backlink';
|
|
4
|
+
export { PktBreadcrumbs } from './breadcrumbs';
|
|
5
|
+
export { PktButton } from './button';
|
|
6
|
+
export { PktCalendar } from './calendar';
|
|
7
|
+
export { PktCard } from './card';
|
|
8
|
+
export { PktCombobox } from './combobox';
|
|
9
|
+
export { PktConsent } from './consent';
|
|
10
|
+
export { PktCheckbox } from './checkbox';
|
|
11
|
+
export { PktDateTags } from './datepicker/date-tags.js';
|
|
12
|
+
export { PktDatepicker } from './datepicker/datepicker.js';
|
|
13
|
+
export { PktHeader, PktHeaderService, PktHeaderUserMenu } from './header';
|
|
14
|
+
export { PktHelptext } from './helptext';
|
|
15
|
+
export { PktHeading } from './heading';
|
|
16
|
+
export { PktIcon } from './icon';
|
|
17
|
+
export { PktInputWrapper } from './input-wrapper';
|
|
18
|
+
export { PktLink } from './link';
|
|
19
|
+
export { PktLinkCard } from './linkcard';
|
|
20
|
+
export { PktLoader } from './loader';
|
|
21
|
+
export { PktMessagebox } from './messagebox';
|
|
22
|
+
export { PktModal } from './modal';
|
|
23
|
+
export { PktProgressbar } from './progressbar';
|
|
24
|
+
export { PktRadioButton } from './radiobutton';
|
|
25
|
+
export { PktRadioButton as PktRadiobutton } from './radiobutton';
|
|
26
|
+
export { PktTag } from './tag';
|
|
27
|
+
export { PktTabs, PktTabItem } from './tabs';
|
|
28
|
+
export { PktTextarea } from './textarea';
|
|
29
|
+
export { PktTextinput } from './textinput';
|
|
30
|
+
export { PktSelect } from './select';
|
|
31
|
+
export { PktTimepicker } from './timepicker';
|
|
32
|
+
export type { IPktAccordion, IPktAccordionItem, TPktAccordionSkin } from './accordion';
|
|
33
|
+
export type { IPktButton, TPktButtonMode, TPktButtonSize, TPktButtonColor, TPktButtonSkin, TPktButtonVariant, TPktButtonState, TPktButtonType, } from './button';
|
|
34
|
+
export type { User as IPktHeaderUser, Representing as IPktHeaderRepresenting, UserMenuItem as IPktHeaderUserMenuItem, THeaderMenu, TLogOutButtonPlacement as TPktHeaderLogOutButtonPlacement, THeaderPosition, THeaderScrollBehavior, TSlotMenuVariant, IPktHeader, } from './header';
|
|
35
|
+
export type { IPktProgressbar, TProgressbarRole, TProgressbarSkin, TProgressbarStatusPlacement, TProgressbarStatusType, TProgressbarTitlePosition, } from './progressbar';
|
|
36
|
+
export type { IPktCombobox, IPktComboboxOption, TPktComboboxTagPlacement, } from './combobox';
|
|
37
|
+
export type { IPktHeading, TPktHeadingSize, TPktHeadingLevel } from './heading';
|
|
38
|
+
export type { TTagSkin, TTagType } from './tag';
|
|
39
|
+
export type { IPktTabs, IPktTabItem, TSkin as TTabItemSkin } from './tabs';
|
|
40
|
+
export type { TSelectOption } from './select';
|
|
41
|
+
export type { IPktBackLink } from './backlink';
|
|
42
|
+
export type { IPktBreadcrumbs, IBreadcrumbItem } from './breadcrumbs';
|
|
43
|
+
export type { IPktLoader, TPktLoaderVariant } from './loader';
|
|
44
|
+
export type { IPktConsent } from './consent';
|
|
45
|
+
export type { IPktTimepicker } from './timepicker';
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { PktElementWithSlot } from '../../base-elements/element-with-slot';
|
|
2
|
+
import { PropertyValues } from 'lit';
|
|
3
|
+
import { ElementProps } from '../../types/typeUtils';
|
|
4
|
+
import { Booleanish } from '../../shared-types';
|
|
5
|
+
type TCounterPosition = 'top' | 'bottom';
|
|
6
|
+
type Props = ElementProps<PktInputWrapper, 'forId' | 'label' | 'helptext' | 'helptextDropdown' | 'helptextDropdownButton' | 'counter' | 'counterCurrent' | 'counterMaxLength' | 'optionalTag' | 'optionalText' | 'requiredTag' | 'requiredText' | 'tagText' | 'hasError' | 'errorMessage' | 'disabled' | 'inline' | 'ariaDescribedby' | 'hasFieldset' | 'useWrapper' | 'role'>;
|
|
7
|
+
export declare class PktInputWrapper extends PktElementWithSlot<Props> {
|
|
8
|
+
/**
|
|
9
|
+
* Element attributes
|
|
10
|
+
*/
|
|
11
|
+
forId: string;
|
|
12
|
+
label: string;
|
|
13
|
+
helptext: string | null;
|
|
14
|
+
helptextDropdown: string | null;
|
|
15
|
+
helptextDropdownButton: string | null;
|
|
16
|
+
counter: boolean;
|
|
17
|
+
counterCurrent: number;
|
|
18
|
+
counterMaxLength: number;
|
|
19
|
+
counterError: string | null;
|
|
20
|
+
counterPosition: TCounterPosition;
|
|
21
|
+
optionalTag: boolean;
|
|
22
|
+
optionalText: string;
|
|
23
|
+
requiredTag: boolean;
|
|
24
|
+
requiredText: string;
|
|
25
|
+
tagText: string | null;
|
|
26
|
+
hasError: boolean;
|
|
27
|
+
errorMessage: string;
|
|
28
|
+
disabled: boolean;
|
|
29
|
+
inline: boolean;
|
|
30
|
+
ariaDescribedby: string | undefined;
|
|
31
|
+
hasFieldset: boolean;
|
|
32
|
+
role: string | null;
|
|
33
|
+
useWrapper: Booleanish;
|
|
34
|
+
protected updated(changedProperties: PropertyValues): void;
|
|
35
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
36
|
+
private toggleDropdown;
|
|
37
|
+
private handleLabelClick;
|
|
38
|
+
}
|
|
39
|
+
export {};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
export interface InputWrapperTestConfig extends BaseTestConfig {
|
|
3
|
+
label?: string;
|
|
4
|
+
helptext?: string;
|
|
5
|
+
errorMessage?: string;
|
|
6
|
+
hasError?: boolean;
|
|
7
|
+
counter?: boolean;
|
|
8
|
+
counterCurrent?: number;
|
|
9
|
+
counterMaxLength?: number;
|
|
10
|
+
counterError?: boolean;
|
|
11
|
+
inline?: boolean;
|
|
12
|
+
useWrapper?: boolean;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
optionalTag?: boolean;
|
|
15
|
+
requiredTag?: boolean;
|
|
16
|
+
hasFieldset?: boolean;
|
|
17
|
+
inFieldset?: boolean;
|
|
18
|
+
readonly?: boolean;
|
|
19
|
+
forId?: string;
|
|
20
|
+
ariaDescribedBy?: string;
|
|
21
|
+
helptextDropdown?: string;
|
|
22
|
+
helptextDropdownButton?: string;
|
|
23
|
+
optionalText?: string;
|
|
24
|
+
requiredText?: string;
|
|
25
|
+
tagText?: string;
|
|
26
|
+
role?: string;
|
|
27
|
+
}
|
|
28
|
+
export declare const createInputWrapperTest: (config?: InputWrapperTestConfig) => Promise<{
|
|
29
|
+
container: HTMLElement;
|
|
30
|
+
wrapper: import('./input-wrapper').PktInputWrapper;
|
|
31
|
+
}>;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { PktElementWithSlot } from '../../base-elements/element-with-slot';
|
|
2
|
+
export declare class PktLink extends PktElementWithSlot {
|
|
3
|
+
/**
|
|
4
|
+
* Element attributes
|
|
5
|
+
*/
|
|
6
|
+
href: string;
|
|
7
|
+
iconName: string | undefined;
|
|
8
|
+
iconPosition: string | undefined;
|
|
9
|
+
external: boolean;
|
|
10
|
+
target: string | null;
|
|
11
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
12
|
+
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
export interface LinkTestConfig extends BaseTestConfig {
|
|
3
|
+
href?: string;
|
|
4
|
+
target?: string;
|
|
5
|
+
skin?: string;
|
|
6
|
+
variant?: string;
|
|
7
|
+
iconName?: string;
|
|
8
|
+
iconPosition?: string;
|
|
9
|
+
openInNewTab?: boolean;
|
|
10
|
+
external?: boolean;
|
|
11
|
+
}
|
|
12
|
+
export declare const createLinkTest: (config?: LinkTestConfig) => Promise<{
|
|
13
|
+
container: HTMLElement;
|
|
14
|
+
link: import('./link').PktLink;
|
|
15
|
+
}>;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { PktElementWithSlot } from '../../base-elements/element-with-slot';
|
|
2
|
+
export type TLinkCardSkin = 'normal' | 'no-padding' | 'blue' | 'beige' | 'green' | 'gray' | 'beige-outline' | 'gray-outline';
|
|
3
|
+
export interface IPktLinkCard {
|
|
4
|
+
title?: string;
|
|
5
|
+
href?: string;
|
|
6
|
+
iconName?: string;
|
|
7
|
+
external?: boolean;
|
|
8
|
+
openInNewTab?: boolean;
|
|
9
|
+
skin?: TLinkCardSkin;
|
|
10
|
+
}
|
|
11
|
+
export declare class PktLinkCard extends PktElementWithSlot implements IPktLinkCard {
|
|
12
|
+
title: string;
|
|
13
|
+
href: string;
|
|
14
|
+
iconName: string;
|
|
15
|
+
external: boolean;
|
|
16
|
+
openInNewTab: boolean;
|
|
17
|
+
skin: TLinkCardSkin;
|
|
18
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
19
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
import { PktLinkCard, IPktLinkCard } from './linkcard';
|
|
3
|
+
export interface LinkCardTestConfig extends IPktLinkCard, BaseTestConfig {
|
|
4
|
+
}
|
|
5
|
+
export declare const createLinkCardTest: (config?: LinkCardTestConfig) => Promise<{
|
|
6
|
+
container: HTMLElement;
|
|
7
|
+
linkCard: PktLinkCard;
|
|
8
|
+
link: HTMLAnchorElement;
|
|
9
|
+
}>;
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { PropertyValues } from 'lit';
|
|
2
|
+
import { PktElement } from '../../base-elements/element';
|
|
3
|
+
import { IPktComboboxOption } from '../../shared-types/combobox';
|
|
4
|
+
declare global {
|
|
5
|
+
interface HTMLElementTagNameMap {
|
|
6
|
+
'pkt-listbox': PktListbox;
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
export interface IPktListbox {
|
|
10
|
+
options: IPktComboboxOption[];
|
|
11
|
+
isOpen: boolean;
|
|
12
|
+
disabled: boolean;
|
|
13
|
+
includeSearch: boolean;
|
|
14
|
+
isMultiSelect: boolean;
|
|
15
|
+
allowUserInput: boolean;
|
|
16
|
+
maxIsReached: boolean;
|
|
17
|
+
customUserInput: string | null;
|
|
18
|
+
searchPlaceholder: string | null;
|
|
19
|
+
searchValue: string | null;
|
|
20
|
+
maxLength: number;
|
|
21
|
+
userMessage: string | null;
|
|
22
|
+
}
|
|
23
|
+
export declare class PktListbox extends PktElement implements IPktListbox {
|
|
24
|
+
id: string;
|
|
25
|
+
label: string | null;
|
|
26
|
+
options: IPktComboboxOption[];
|
|
27
|
+
isOpen: boolean;
|
|
28
|
+
disabled: boolean;
|
|
29
|
+
includeSearch: boolean;
|
|
30
|
+
isMultiSelect: boolean;
|
|
31
|
+
allowUserInput: boolean;
|
|
32
|
+
maxIsReached: boolean;
|
|
33
|
+
customUserInput: string | null;
|
|
34
|
+
searchPlaceholder: string | null;
|
|
35
|
+
searchValue: string | null;
|
|
36
|
+
maxLength: number;
|
|
37
|
+
userMessage: string | null;
|
|
38
|
+
private _selectedOptions;
|
|
39
|
+
private typeahead;
|
|
40
|
+
private _filteredOptions;
|
|
41
|
+
connectedCallback(): void;
|
|
42
|
+
disconnectedCallback(): void;
|
|
43
|
+
updated(changedProperties: PropertyValues): void;
|
|
44
|
+
attributeChangedCallback(name: string, _old: string | null, value: string | null): void;
|
|
45
|
+
private get _hasOptions();
|
|
46
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
47
|
+
private renderCheckboxOrCheckIcon;
|
|
48
|
+
private renderEmptyMessage;
|
|
49
|
+
private renderList;
|
|
50
|
+
private renderNewOptionBanner;
|
|
51
|
+
private renderMaximumReachedBanner;
|
|
52
|
+
private renderUserMessage;
|
|
53
|
+
private renderSearch;
|
|
54
|
+
private handleSearchInput;
|
|
55
|
+
private handleSearchKeydown;
|
|
56
|
+
private handleOptionKeydown;
|
|
57
|
+
focusFirstOrSelectedOption(): void;
|
|
58
|
+
private toggleOption;
|
|
59
|
+
private selectAll;
|
|
60
|
+
private closeOptions;
|
|
61
|
+
private tabClose;
|
|
62
|
+
filterOptions(): void;
|
|
63
|
+
private handleTypeAhead;
|
|
64
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
import { IPktListbox } from './listbox';
|
|
3
|
+
export interface ListboxTestConfig extends Partial<IPktListbox>, BaseTestConfig {
|
|
4
|
+
label?: string;
|
|
5
|
+
id?: string;
|
|
6
|
+
}
|
|
7
|
+
export declare const createListboxTest: (config?: ListboxTestConfig) => Promise<{
|
|
8
|
+
container: HTMLElement;
|
|
9
|
+
listbox: import('./listbox').PktListbox;
|
|
10
|
+
}>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
import { IPktListbox } from './listbox';
|
|
3
|
+
export interface ListboxTestConfig extends Partial<IPktListbox>, BaseTestConfig {
|
|
4
|
+
label?: string;
|
|
5
|
+
id?: string;
|
|
6
|
+
}
|
|
7
|
+
export declare const createListboxTest: (config?: ListboxTestConfig) => Promise<{
|
|
8
|
+
container: HTMLElement;
|
|
9
|
+
listbox: import('./listbox').PktListbox;
|
|
10
|
+
}>;
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { PktElementWithSlot } from '../../base-elements/element-with-slot';
|
|
2
|
+
import { TPktSize } from '../../types/size';
|
|
3
|
+
export type TPktLoaderVariant = 'blue' | 'rainbow' | 'shapes';
|
|
4
|
+
export interface IPktLoader {
|
|
5
|
+
/**
|
|
6
|
+
* The `delay` prop controls how much time the loading should be given before the loader is displayed.
|
|
7
|
+
* This is handy for situations where the load time might be so short that loader is not necessary.
|
|
8
|
+
* Delay time is in milliseconds.
|
|
9
|
+
*/
|
|
10
|
+
delay?: number;
|
|
11
|
+
/**
|
|
12
|
+
* The `inline` prop decides whether the loader should be displayed inline or not.
|
|
13
|
+
*/
|
|
14
|
+
inline?: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* The boolean 'isLoading' decides whether the loader or the children will be displayed.
|
|
17
|
+
* If set to false, the children will be displayed.
|
|
18
|
+
*/
|
|
19
|
+
isLoading?: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* The message to display when the loader is loading.
|
|
22
|
+
*/
|
|
23
|
+
message?: string | null;
|
|
24
|
+
/**
|
|
25
|
+
* The size of the loader. Default is "medium".
|
|
26
|
+
*/
|
|
27
|
+
size?: TPktSize;
|
|
28
|
+
/**
|
|
29
|
+
* The variant of the loader. Default is "shapes" which is the OSLO wave loader.
|
|
30
|
+
* Other variants are "blue" and "rainbow" which are spinner variants.
|
|
31
|
+
*/
|
|
32
|
+
variant?: TPktLoaderVariant;
|
|
33
|
+
/**
|
|
34
|
+
* Override path to loading animations.
|
|
35
|
+
*/
|
|
36
|
+
loadingAnimationPath?: string;
|
|
37
|
+
}
|
|
38
|
+
export declare class PktLoader extends PktElementWithSlot implements IPktLoader {
|
|
39
|
+
delay: number;
|
|
40
|
+
inline: boolean;
|
|
41
|
+
isLoading: boolean;
|
|
42
|
+
message: string | null;
|
|
43
|
+
size: TPktSize;
|
|
44
|
+
variant: TPktLoaderVariant;
|
|
45
|
+
loadingAnimationPath: string | undefined;
|
|
46
|
+
private _shouldDisplayLoader;
|
|
47
|
+
connectedCallback(): void;
|
|
48
|
+
updated(changedProperties: Map<string, unknown>): void;
|
|
49
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
50
|
+
private getVariant;
|
|
51
|
+
private setupLoader;
|
|
52
|
+
}
|
|
53
|
+
export default PktLoader;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
import { IPktLoader } from './loader';
|
|
3
|
+
export interface LoaderTestConfig extends Partial<IPktLoader>, BaseTestConfig {
|
|
4
|
+
}
|
|
5
|
+
export declare const createLoaderTest: (config?: LoaderTestConfig) => Promise<{
|
|
6
|
+
container: HTMLElement;
|
|
7
|
+
loader: import('./loader').PktLoader;
|
|
8
|
+
}>;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { PktElementWithSlot } from '../../base-elements/element-with-slot';
|
|
2
|
+
import { PropertyValues } from 'lit';
|
|
3
|
+
import { TMessageboxSkin } from '../../shared-types';
|
|
4
|
+
export type { TMessageboxSkin };
|
|
5
|
+
export interface IPktMessagebox {
|
|
6
|
+
skin?: TMessageboxSkin;
|
|
7
|
+
title?: string;
|
|
8
|
+
compact?: boolean;
|
|
9
|
+
closable?: boolean;
|
|
10
|
+
}
|
|
11
|
+
export declare class PktMessagebox extends PktElementWithSlot implements IPktMessagebox {
|
|
12
|
+
constructor();
|
|
13
|
+
closable: boolean;
|
|
14
|
+
compact: boolean;
|
|
15
|
+
title: string;
|
|
16
|
+
skin: TMessageboxSkin;
|
|
17
|
+
_isClosed: boolean;
|
|
18
|
+
protected updated(_changedProperties: PropertyValues): void;
|
|
19
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
20
|
+
private close;
|
|
21
|
+
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
import { IPktMessagebox } from './messagebox';
|
|
3
|
+
export interface MessageboxTestConfig extends Partial<IPktMessagebox>, BaseTestConfig {
|
|
4
|
+
}
|
|
5
|
+
export declare const createMessageboxTest: (config?: MessageboxTestConfig) => Promise<{
|
|
6
|
+
container: HTMLElement;
|
|
7
|
+
messagebox: import('./messagebox').PktMessagebox;
|
|
8
|
+
}>;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { PropertyValues } from 'lit';
|
|
2
|
+
import { PktElementWithSlot } from '../../base-elements/element-with-slot';
|
|
3
|
+
import { Ref } from 'lit/directives/ref.js';
|
|
4
|
+
import { TPktSize } from '../../types/size';
|
|
5
|
+
export interface IPktModal {
|
|
6
|
+
open?: boolean;
|
|
7
|
+
headingText?: string;
|
|
8
|
+
removePadding?: boolean;
|
|
9
|
+
hideCloseButton?: boolean;
|
|
10
|
+
closeOnBackdropClick?: boolean;
|
|
11
|
+
closeButtonSkin?: 'blue' | 'yellow-filled';
|
|
12
|
+
size?: TPktSize;
|
|
13
|
+
variant?: 'dialog' | 'drawer';
|
|
14
|
+
drawerPosition?: 'left' | 'right';
|
|
15
|
+
transparentBackdrop?: boolean;
|
|
16
|
+
}
|
|
17
|
+
export declare class PktModal extends PktElementWithSlot implements IPktModal {
|
|
18
|
+
open?: boolean;
|
|
19
|
+
headingText?: string;
|
|
20
|
+
removePadding?: boolean;
|
|
21
|
+
hideCloseButton?: boolean;
|
|
22
|
+
closeOnBackdropClick?: boolean;
|
|
23
|
+
closeButtonSkin?: 'blue' | 'yellow-filled';
|
|
24
|
+
size?: TPktSize;
|
|
25
|
+
variant?: 'dialog' | 'drawer';
|
|
26
|
+
drawerPosition?: 'left' | 'right';
|
|
27
|
+
transparentBackdrop?: boolean;
|
|
28
|
+
dialogRef: Ref<HTMLDialogElement>;
|
|
29
|
+
_isOpen: boolean;
|
|
30
|
+
constructor();
|
|
31
|
+
connectedCallback(): Promise<void>;
|
|
32
|
+
disconnectedCallback(): void;
|
|
33
|
+
protected updated(changedProperties: PropertyValues): void;
|
|
34
|
+
protected firstUpdated(_changedProperties: PropertyValues): Promise<void>;
|
|
35
|
+
private handleKeyDown;
|
|
36
|
+
private handleBackdropClick;
|
|
37
|
+
private isElementInViewport;
|
|
38
|
+
close: (event: Event, bypassNativeClose?: boolean) => void;
|
|
39
|
+
showModal: (event?: Event | null) => void;
|
|
40
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
41
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { default as PktProgressbar } from './progressbar';
|
|
2
|
+
export { PktProgressbar } from './progressbar';
|
|
3
|
+
export type { IPktProgressbar, TProgressbarRole, TProgressbarSkin, TProgressbarStatusPlacement, TProgressbarStatusType, TProgressbarTitlePosition, } from './progressbar';
|
|
4
|
+
export default PktProgressbar;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { PktElement } from '../../base-elements/element';
|
|
2
|
+
import { TAriaLive, TProgressbarRole, TProgressbarSkin, TProgressbarStatusPlacement, TProgressbarStatusType, TProgressbarTitlePosition } from '../../shared-types';
|
|
3
|
+
export type { TProgressbarRole, TProgressbarSkin, TProgressbarStatusPlacement, TProgressbarStatusType, TProgressbarTitlePosition };
|
|
4
|
+
export interface IPktProgressbar {
|
|
5
|
+
ariaLabel?: string | null;
|
|
6
|
+
ariaLabelledby?: string | null;
|
|
7
|
+
ariaLive?: TAriaLive | null;
|
|
8
|
+
ariaValueText?: string | null;
|
|
9
|
+
id?: string | null;
|
|
10
|
+
role?: TProgressbarRole;
|
|
11
|
+
skin?: TProgressbarSkin;
|
|
12
|
+
statusPlacement?: TProgressbarStatusPlacement;
|
|
13
|
+
statusType?: TProgressbarStatusType;
|
|
14
|
+
title?: string | null;
|
|
15
|
+
titlePosition?: TProgressbarTitlePosition;
|
|
16
|
+
valueCurrent: number;
|
|
17
|
+
valueMax?: number;
|
|
18
|
+
valueMin?: number;
|
|
19
|
+
}
|
|
20
|
+
export declare class PktProgressbar extends PktElement implements IPktProgressbar {
|
|
21
|
+
constructor();
|
|
22
|
+
ariaLabel: string | null;
|
|
23
|
+
ariaLabelledby: string | null;
|
|
24
|
+
ariaValueText: string | null;
|
|
25
|
+
ariaLive: TAriaLive;
|
|
26
|
+
id: string;
|
|
27
|
+
role: TProgressbarRole;
|
|
28
|
+
skin: TProgressbarSkin;
|
|
29
|
+
statusPlacement: TProgressbarStatusPlacement;
|
|
30
|
+
statusType: TProgressbarStatusType;
|
|
31
|
+
title: string;
|
|
32
|
+
titlePosition: TProgressbarTitlePosition;
|
|
33
|
+
valueCurrent: number;
|
|
34
|
+
valueMax: number;
|
|
35
|
+
valueMin: number;
|
|
36
|
+
private labelWidth;
|
|
37
|
+
private progressbarId;
|
|
38
|
+
private computedAriaLabelledby;
|
|
39
|
+
private computedAriaValueText;
|
|
40
|
+
private labelRef;
|
|
41
|
+
private progressBarRef;
|
|
42
|
+
firstUpdated(changedProperties: Map<string | number | symbol, unknown>): void;
|
|
43
|
+
updated(changedProperties: Map<string | number | symbol, unknown>): void;
|
|
44
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
45
|
+
private setComputedValues;
|
|
46
|
+
private syncAttributes;
|
|
47
|
+
private _handleAttribute;
|
|
48
|
+
}
|
|
49
|
+
export default PktProgressbar;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
import { IPktProgressbar } from './progressbar';
|
|
3
|
+
export interface ProgressbarTestConfig extends Partial<IPktProgressbar>, BaseTestConfig {
|
|
4
|
+
}
|
|
5
|
+
export declare const createProgressbarTest: (config?: ProgressbarTestConfig) => Promise<{
|
|
6
|
+
container: HTMLElement;
|
|
7
|
+
progressbar: import('./progressbar').PktProgressbar;
|
|
8
|
+
}>;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { PktInputElement } from '../../base-elements/input-element';
|
|
2
|
+
import { Ref } from 'lit/directives/ref.js';
|
|
3
|
+
import { ElementProps } from '../../types/typeUtils';
|
|
4
|
+
type Props = ElementProps<PktRadioButton, 'checkHelptext' | 'defaultChecked' | 'hasTile' | 'tagText' | 'optionalTag' | 'optionalText' | 'requiredTag' | 'requiredText'>;
|
|
5
|
+
export declare class PktRadioButton extends PktInputElement<Props> {
|
|
6
|
+
inputRef: Ref<HTMLInputElement>;
|
|
7
|
+
value: string;
|
|
8
|
+
checkHelptext: string | null;
|
|
9
|
+
defaultChecked: boolean;
|
|
10
|
+
hasTile: boolean;
|
|
11
|
+
checked: boolean | string | null;
|
|
12
|
+
type: string;
|
|
13
|
+
tagText: string | null;
|
|
14
|
+
optionalTag: boolean;
|
|
15
|
+
optionalText: string;
|
|
16
|
+
requiredTag: boolean;
|
|
17
|
+
requiredText: string;
|
|
18
|
+
_checked: boolean;
|
|
19
|
+
connectedCallback(): void;
|
|
20
|
+
attributeChangedCallback(name: string, _old: string | null, value: string | null): void;
|
|
21
|
+
render(): import('lit-html').TemplateResult<1>;
|
|
22
|
+
private toggleChecked;
|
|
23
|
+
}
|
|
24
|
+
export {};
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { BaseTestConfig } from '../../tests/test-framework';
|
|
2
|
+
export interface RadioButtonTestConfig extends BaseTestConfig {
|
|
3
|
+
value?: string;
|
|
4
|
+
checkHelptext?: string | null;
|
|
5
|
+
defaultChecked?: boolean;
|
|
6
|
+
hasTile?: boolean;
|
|
7
|
+
checked?: boolean | string | null;
|
|
8
|
+
type?: string;
|
|
9
|
+
tagText?: string | null;
|
|
10
|
+
optionalTag?: boolean;
|
|
11
|
+
optionalText?: string;
|
|
12
|
+
requiredTag?: boolean;
|
|
13
|
+
requiredText?: string;
|
|
14
|
+
id?: string;
|
|
15
|
+
name?: string;
|
|
16
|
+
label?: string;
|
|
17
|
+
disabled?: boolean;
|
|
18
|
+
readonly?: boolean;
|
|
19
|
+
required?: boolean;
|
|
20
|
+
hasError?: boolean;
|
|
21
|
+
inline?: boolean;
|
|
22
|
+
ariaDescribedBy?: string | null;
|
|
23
|
+
ariaLabelledby?: string | null;
|
|
24
|
+
}
|
|
25
|
+
export declare const createRadioButtonTest: (config?: RadioButtonTestConfig) => Promise<{
|
|
26
|
+
container: HTMLElement;
|
|
27
|
+
radiobutton: import('./radiobutton').PktRadioButton;
|
|
28
|
+
}>;
|