import { AnchorHTMLAttributes } from 'react';
import { Booleanish } from './shared-types';
import { ButtonHTMLAttributes } from 'react';
import { ChangeEvent } from 'react';
import { ChangeEventHandler } from 'react';
import { CSSProperties } from 'react';
import { FC } from 'react';
import { FocusEvent as FocusEvent_2 } from 'react';
import { ForwardRefExoticComponent } from 'react';
import { HTMLAttributes } from 'react';
import { HTMLProps } from 'react';
import { IDatepickerStrings } from './shared-types/datepicker';
import { InputHTMLAttributes } from 'react';
import { IPktComboboxOption } from './shared-types/combobox';
import { IPktConsent as IPktConsent_2 } from '@oslokommune/punkt-elements';
import { IPktHeading as IPktHeading_2 } from '@oslokommune/punkt-elements';
import { IPktLoader as IPktLoader_2 } from '@oslokommune/punkt-elements';
import { ITimepickerStrings } from './shared-types/timepicker';
import { JSX as JSX_2 } from 'react/jsx-runtime';
import { LegacyRef } from 'react';
import { LinkHTMLAttributes } from 'react';
import { MouseEvent as MouseEvent_2 } from 'react';
import { ReactElement } from 'react';
import { ReactNode } from 'react';
import { Ref } from 'react';
import { RefAttributes } from 'react';
import { RefObject } from 'react';
import { SelectHTMLAttributes } from 'react';
import { SyntheticEvent } from 'react';
import { TAccordionSkin } from './shared-types';
import { TAlertRole } from './shared-types';
import { TAlertSkin } from './shared-types';
import { TAriaLive } from './shared-types';
import { TCardSkin } from './shared-types';
import { TextareaHTMLAttributes } from 'react';
import { THeaderMenu } from './shared-types';
import { THeaderPosition } from './shared-types';
import { THeaderScrollBehavior } from './shared-types';
import { TLayout } from './shared-types';
import { TLogOutButtonPlacement } from './shared-types';
import { TMessageboxSkin } from './shared-types';
import { TPktComboboxDisplayValue } from './shared-types/combobox';
import { TPktComboboxTagPlacement } from './shared-types/combobox';
import { TProgressbarRole } from './shared-types';
import { TProgressbarSkin } from './shared-types';
import { TProgressbarStatusPlacement } from './shared-types';
import { TProgressbarStatusType } from './shared-types';
import { TProgressbarTitlePosition } from './shared-types';
import { TSlotMenuVariant } from './shared-types';

declare interface BasePktTagProps {
    skin?: 'blue' | 'blue-light' | 'blue-dark' | 'green' | 'red' | 'beige' | 'yellow' | 'grey' | 'gray';
    textStyle?: 'normal-text' | 'thin-text';
    size?: 'small' | 'medium' | 'large';
    closeTag?: boolean;
    iconName?: string;
    ariaLabel?: string;
    onClose?: () => void;
    children?: ReactNode;
}

declare interface ButtonPktTagProps extends BasePktTagProps, HTMLAttributes<HTMLButtonElement> {
    closeTag: true;
    type?: 'button' | 'submit' | 'reset';
}

declare interface Column {
    title: string;
    links?: Link[];
    text?: string;
}

declare type ExtendedLoader = IPktLoader_2 & PktElType;

/**
 * A selected file plus metadata used by the FileUpload UI.
 *
 * Notes:
 * - A `fileId` is generated automatically if omitted.
 * - `attributes.targetFilename` is the filename shown in the queue and may be updated by extensions (e.g. rename).
 */
export declare class FileItem implements FileItem {
    fileId: TFileId;
    file: File;
    attributes: Record<string, any>;
    constructor(file: File, fileId?: TFileId);
}

/**
 * Shared props for `PktFileUpload` (both `form` and `custom` strategies).
 *
 * The component can be used as:
 * - **controlled**: pass `value` + `onFilesChanged`
 * - **uncontrolled**: pass `defaultValue` (internal state is not stored; you still receive new lists via callbacks)
 */
declare interface IBaseFileUploadProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'checked' | 'size' | 'type' | 'value' | 'onChange' | 'width' | 'defaultValue'> {
    /** Called with the next file list when files are added/removed/updated. */
    onFilesChanged?: (files: TFileItemList) => void;
    /** Allow selecting/dropping multiple files. */
    multiple?: boolean;
    /** Controlled value (recommended). */
    value?: TFileItemList;
    /** Upload mode. Defaults to `"form"`. */
    uploadStrategy?: TUploadStrategy;
    /** Field name. Used for native input (`form`) or hidden ID inputs (`custom`). */
    name: string;
    /** Enable comment operation (disabled automatically in thumbnail view). */
    addCommentsEnabled?: boolean;
    /** Enable rename operation (disabled automatically in thumbnail view). */
    renameFilesEnabled?: boolean;
    /** Renderer for queue items (`filename`, `thumbnail`, or custom function). */
    itemRenderer?: keyof typeof ItemRenderers | TItemRenderer;
    /** Number of trailing characters to keep when truncating long filenames. */
    truncateTail?: number;
    /**
     * Called immediately when a file is added in `uploadStrategy="custom"`.
     * Use it to start uploading the file and update `transfers`.
     */
    onFileUploadRequested?: (fileItem: FileItem) => void;
    /** Uncontrolled initial value (use either `value` or `defaultValue`, not both). */
    defaultValue?: TFileItemList;
    /** Extra operations appended after built-ins (rename/comment). */
    extraOperations?: Array<TQueueItemExtension>;
    /** Stretch to full container width (drop zone + queue). */
    fullWidth?: boolean;
    /** Allowed formats for built-in validation (extensions like `pdf`, or MIME patterns like `image/*`). */
    allowedFormats?: string[];
    /** Custom message for invalid format. Use `{formats}` placeholder. */
    formatErrorMessage?: string;
    /** Max file size (e.g. `"5MB"` or bytes). */
    maxFileSize?: string | number;
    /** Custom message for size validation. Use `{maxSize}` placeholder. */
    sizeErrorMessage?: string;
    /** Optional additional validation hook (runs after built-in format/size checks). Return string to block. */
    onFileValidation?: (file: File) => string | null;
    /** External/programmatic error message shown under the component. */
    errorMessage?: string;
    /** External error flag (combined with internal validation errors). */
    hasError?: boolean;
    /** Disable the whole component (no interaction). */
    disabled?: boolean;
    /** Optional label/title (wraps the component in `PktInputWrapper`). */
    label?: string;
    /** Help text under the label. */
    helptext?: string | ReactNode;
    /** Show "Valgfritt" tag in wrapper. */
    optionalTag?: boolean;
    /** Show "Må fylles ut" tag in wrapper. */
    requiredTag?: boolean;
    /** Marks the upload as required. Native validation is used in `form`; submit validation in `custom`. */
    required?: boolean;
    /** Enable image preview modal (only applies to thumbnail renderer). */
    enableImagePreview?: boolean;
}

declare interface IBreadcrumbs {
    text: string;
    href: string;
}

declare interface ICardTag {
    skin?: TTagSkin;
    iconName?: string;
    ariaLabel?: string;
    text: string;
}

/** Props for `uploadStrategy="form"` (native file input submission). */
declare interface IFileInputFileUploadProps extends IBaseFileUploadProps, Omit<HTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'defaultValue'> {
    uploadStrategy?: 'form';
    onFileUploadRequested?: never;
}

/**
 * Props for `uploadStrategy="custom"` (upload handled externally).
 *
 * Requirements:
 * - `transfers` must be provided (to render status/progress)
 * - `onFileUploadRequested` is called for each added file
 */
declare interface ImmediateFileUploadProps extends IBaseFileUploadProps {
    id: string;
    uploadStrategy: 'custom';
    transfers: Array<TFileTransfer>;
    onFileUploadRequested: (fileItem: FileItem) => void;
    onTransferCancelled?: (fileItemId: string) => void;
}

declare interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
    /** The input's label */
    label?: string;
    /** The input's id */
    id: string;
}

export declare interface IPktAccordion {
    compact?: boolean;
    /**
     * @default skin: "borderless"
     */
    skin?: TPktAccordionSkin;
    /**
     * @description A unique identifier to connect the accordion with a heading
     */
    ariaLabelledBy?: string;
    children?: ReactNode;
    name?: string;
    className?: string;
}

export declare interface IPktAccordionItem {
    defaultOpen?: boolean;
    id: string;
    title: string | ReactNode;
    skin?: TPktAccordionSkin_2;
    compact?: boolean;
    isOpen?: boolean;
    children?: ReactNode;
    name?: string;
    className?: string;
    onClick?: (e: MouseEvent_2<HTMLDetailsElement>) => void;
    onToggle?: (e: SyntheticEvent<HTMLDetailsElement>) => void;
}

export declare interface IPktAlert extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
    skin?: TAlertSkin;
    closeAlert?: boolean;
    title?: ReactNode;
    date?: string;
    ariaLive?: TAriaLive;
    compact?: boolean;
    role?: TAlertRole;
    onClose?: (e: CustomEvent) => void;
}

export declare interface IPktBackLink extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'> {
    href?: string;
    text?: string;
    ariaLabel?: string;
    renderLink?: (args: {
        href: string;
        className: string;
        children: ReactNode;
        props: AnchorHTMLAttributes<HTMLAnchorElement>;
    }) => ReactNode;
    ref?: Ref<HTMLElement>;
}

export declare interface IPktBreadcrumbs extends AnchorHTMLAttributes<HTMLAnchorElement> {
    breadcrumbs: IBreadcrumbs[];
    navigationType?: 'router' | 'anchor';
    renderLink?: (args: {
        href: string;
        className: string;
        children: ReactNode;
        props: AnchorHTMLAttributes<HTMLAnchorElement>;
    }) => ReactNode;
}

export declare interface IPktButton extends ButtonHTMLAttributes<HTMLButtonElement> {
    iconName?: string;
    secondIconName?: string;
    iconPath?: string;
    secondIconPath?: string;
    mode?: 'light' | 'dark';
    size?: 'small' | 'medium' | 'large';
    fullWidth?: boolean;
    fullWidthOnMobile?: boolean;
    color?: 'blue' | 'blue-outline' | 'green' | 'green-outline' | 'green-dark' | 'green-dark-outline' | 'beige-light' | 'beige-dark-outline' | 'yellow' | 'yellow-outline' | 'red' | 'red-outline';
    skin?: 'primary' | 'secondary' | 'tertiary';
    variant?: 'label-only' | 'icon-left' | 'icon-right' | 'icon-only' | 'icons-right-and-left';
    state?: 'normal' | 'focus' | 'hover' | 'active';
    type?: 'button' | 'submit' | 'reset';
    isLoading?: boolean;
    loadingAnimationPath?: string;
}

declare interface IPktCalendar {
    selected?: string[];
    multiple?: boolean;
    maxMultiple?: number;
    range?: boolean;
    earliest?: string | null;
    latest?: string | null;
    excludedates?: Date[] | string[];
    excludeweekdays?: string[];
    weeknumbers?: boolean;
    withcontrols?: boolean;
    currentmonth?: Date | string | null;
    today?: string;
    strings?: IPktCalendarStrings;
    onDateSelected?: (selected: string[]) => void;
    onClose?: () => void;
    id?: string;
    className?: string;
}

declare interface IPktCalendarStrings {
    month?: string;
    year?: string;
    days?: string[];
    daysShort?: string[];
    months?: string[];
    week?: string;
    prevMonth?: string;
    nextMonth?: string;
}

export declare interface IPktCard extends Omit<HTMLAttributes<HTMLElement>, 'title'> {
    ariaLabel?: string;
    metaLead?: string | null;
    borderOnHover?: boolean;
    metaTrail?: string | null;
    layout?: TLayout;
    heading?: string;
    headingLevel?: THeadingLevel;
    image?: {
        src: string;
        alt: string;
    };
    imageShape?: TCardImageShape;
    clickCardLink?: string | null;
    padding?: TCardPadding;
    openLinkInNewTab?: boolean;
    skin?: TCardSkin;
    subheading?: string;
    tagPosition?: TCardTagPosition;
    tags?: ICardTag[];
    children?: ReactNode;
    ref?: Ref<HTMLDivElement>;
}

export declare interface IPktCheckbox extends InputHTMLAttributes<HTMLInputElement> {
    id: string;
    hasTile?: boolean;
    disabled?: boolean;
    label?: string;
    checkHelptext?: ReactNode | ReactNode[] | string;
    hasError?: boolean;
    defaultChecked?: boolean;
    checked?: boolean;
    indeterminate?: boolean;
    value?: string;
    isSwitch?: boolean;
    hideLabel?: boolean;
    labelPosition?: 'right' | 'left';
    optionalTag?: boolean;
    optionalText?: string;
    requiredTag?: boolean;
    requiredText?: string;
    tagText?: string | null;
    onChange?: ChangeEventHandler<HTMLInputElement>;
}

export declare interface IPktCombobox {
    value?: string | string[];
    defaultValue?: string | string[];
    options?: IPktComboboxOption[];
    defaultOptions?: IPktComboboxOption[];
    multiple?: boolean;
    maxlength?: number;
    typeahead?: boolean;
    includeSearch?: boolean;
    allowUserInput?: boolean;
    displayValueAs?: TPktComboboxDisplayValue;
    tagPlacement?: TPktComboboxTagPlacement;
    searchPlaceholder?: string;
    name?: string;
    id?: string;
    disabled?: boolean;
    required?: boolean;
    placeholder?: string;
    label?: string;
    helptext?: string | ReactNode;
    helptextDropdown?: string | ReactNode;
    helptextDropdownButton?: string;
    hasError?: boolean;
    errorMessage?: string | ReactNode;
    fullwidth?: boolean;
    requiredTag?: boolean;
    requiredText?: string;
    optionalTag?: boolean;
    optionalText?: string;
    tagText?: string;
    useWrapper?: boolean;
    onChange?: ChangeEventHandler<HTMLInputElement>;
    onValueChange?: (values: string[]) => void;
    className?: string;
    children?: ReactNode;
}

declare interface IPktConsent extends IPktConsent_2 {
    ref?: LegacyRef<HTMLDivElement>;
    onToggleConsent?: (e: CustomEvent) => void;
}

export declare interface IPktDatepicker extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
    id: string;
    label: string;
    value?: string | string[];
    dateformat?: string;
    multiple?: boolean;
    maxlength?: number;
    range?: boolean;
    showRangeLabels?: boolean;
    weeknumbers?: boolean;
    withcontrols?: boolean;
    excludedates?: string[];
    excludeweekdays?: string[];
    currentmonth?: string;
    today?: string;
    calendarOpen?: boolean;
    timezone?: string;
    fullwidth?: boolean;
    hasFieldset?: boolean;
    inline?: boolean;
    helptext?: string | ReactNode;
    helptextDropdown?: string | ReactNode;
    helptextDropdownButton?: string;
    hasError?: boolean;
    errorMessage?: string | ReactNode;
    optionalTag?: boolean;
    optionalText?: string;
    requiredTag?: boolean;
    requiredText?: string;
    tagText?: string;
    useWrapper?: boolean;
    strings?: IDatepickerStrings;
    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
    onValueChange?: (values: string[]) => void;
    className?: string;
}

export declare type IPktFileUpload = IFileInputFileUploadProps | ImmediateFileUploadProps;

export declare interface IPktFooter extends HTMLAttributes<HTMLDivElement> {
    columnOne: Column;
    columnTwo: Column;
    socialLinks?: SocialLink[];
    personvernOgInfoLink?: string;
    tilgjengelighetLink?: string;
    openLinksInNewTab?: boolean;
    includeConsent?: boolean;
    hotjarId?: string | null;
    googleAnalyticsId?: string | null;
    devMode?: boolean;
    cookieDomain?: string | null;
    cookieSecure?: string | null;
    cookieExpiryDays?: string | null;
    onToggleConsent?: (e: CustomEvent) => void;
}

export declare interface IPktFooterSimple extends HTMLAttributes<HTMLDivElement> {
    links?: Array<{
        href: string;
        text: string;
        external?: boolean;
        openInNewTab?: boolean;
    }>;
    personvernOgInfoLink?: string;
    tilgjengelighetLink?: string;
    openLinksInNewTab?: boolean;
    includeConsent?: boolean;
    hotjarId?: string | null;
    googleAnalyticsId?: string | null;
    devMode?: boolean;
    cookieDomain?: string | null;
    cookieSecure?: string | null;
    cookieExpiryDays?: string | null;
    onToggleConsent?: (e: CustomEvent) => void;
}

export declare interface IPktHeader {
    children?: ReactNode;
    /** Additional CSS class name(s) to apply to the header */
    className?: string;
    /** Set dark mode on the header */
    'data-mode'?: 'dark';
    /** Hide the Oslo logo. Default: false (logo is shown) */
    hideLogo?: boolean;
    /** Link URL for the logo */
    logoLink?: string;
    /** Callback when logo is clicked */
    logoClick?: (event: MouseEvent_2) => void;
    /** Name of the service displayed in the header */
    serviceName?: string;
    /** Link URL for the service name */
    serviceLink?: string;
    /** Callback when service name is clicked */
    serviceClick?: (event: MouseEvent_2) => void;
    /** Use compact header height */
    compact?: boolean;
    /** User object with name, shortname, and lastLoggedIn */
    user?: User;
    /** User menu items displayed in the dropdown */
    userMenu?: UserMenuItem[];
    /** Representing object with name, shortname, and orgNumber */
    representing?: Representing;
    /** Whether the user can change representation. Shows "Endre organisasjon" button */
    canChangeRepresentation?: boolean;
    /** Callback when user clicks "Endre organisasjon" */
    changeRepresentation?: () => void;
    /** @deprecated Use userMenu instead. Will show console.warn if used. */
    userMenuFooter?: UserMenuFooterItem[];
    /** @deprecated userOptions is no longer available. Use userMenu instead. */
    userOptions?: UserMenuItem[];
    /** Where to show the logout button: 'userMenu', 'header', 'both', or 'none' */
    logOutButtonPlacement?: TLogOutButtonPlacement;
    /** Callback when user clicks logout */
    logOut?: () => void;
    /** Show search input in the header */
    showSearch?: boolean;
    /** Callback when user submits search (presses Enter) */
    onSearch?: (query: string) => void;
    /** Callback when search input value changes */
    onSearchChange?: (query: string) => void;
    /** Controlled value for the search input */
    searchValue?: string;
    /** Placeholder text for the search input. Default: "Søk" */
    searchPlaceholder?: string;
    /** Custom breakpoint for responsive behavior (grid layout) in pixels. Default: 1024 */
    mobileBreakpoint?: number;
    /** Custom breakpoint for tablet responsive behavior (interaction pattern) in pixels. Default: 1280 */
    tabletBreakpoint?: number;
    /** Which menu is initially open */
    openedMenu?: THeaderMenu;
    /** Header position. 'fixed' fixes to top of viewport, 'relative' follows document flow. Default: 'fixed' */
    position?: THeaderPosition;
    /** Scroll behavior. 'hide' hides header on scroll down, 'none' keeps it visible. Default: 'hide' */
    scrollBehavior?: THeaderScrollBehavior;
    /** Variant for the slot menu button in tablet/mobile mode. Default: 'icon-only' */
    slotMenuVariant?: TSlotMenuVariant;
    /** Text for the slot menu button in tablet/mobile mode. Default: 'Meny' */
    slotMenuText?: string;
}

export declare type IPktHeaderService = IPktHeader;

declare interface IPktHeading extends IPktHeading_2 {
    children?: ReactNode | ReactNode[];
    ref?: LegacyRef<HTMLElement>;
}

declare interface IPktHelptextProps extends HTMLAttributes<HTMLDivElement> {
    helptext?: string | ReactNode | ReactNode[];
    helptextDropdown?: string | ReactNode | ReactNode[];
    helptextDropdownButton?: string;
    forId?: string;
    ref?: LegacyRef<HTMLDivElement>;
    onToggleHelpText?: (e: CustomEvent) => void;
}

declare interface IPktIcon extends PktElType {
    name?: string;
    path?: string;
    'aria-hidden'?: Booleanish | undefined;
}

export declare interface IPktInputWrapper extends RefAttributes<HTMLElement> {
    forId: string;
    label: string;
    helptext?: string | ReactNode;
    helptextDropdown?: string | ReactNode;
    helptextDropdownButton?: string;
    counter?: boolean;
    counterCurrent?: number;
    counterMaxLength?: number;
    optionalTag?: boolean;
    optionalText?: string;
    requiredTag?: boolean;
    requiredText?: string;
    tagText?: string | null;
    hasError?: boolean;
    errorMessage?: string | ReactNode;
    disabled?: boolean;
    inline?: boolean;
    ariaDescribedby?: string;
    useWrapper?: boolean;
    children?: ReactNode;
    className?: string;
    hasFieldset?: boolean;
    role?: string;
    counterPosition?: 'top' | 'bottom';
}

declare interface IPktLink extends LinkHTMLAttributes<HTMLAnchorElement> {
    href?: string;
    iconName?: string | undefined;
    className?: string | undefined;
    iconPosition?: string | undefined;
    external?: boolean;
    target?: string | undefined;
}

export declare interface IPktLinkCard extends Omit<HTMLAttributes<HTMLAnchorElement>, 'title'> {
    skin?: 'normal' | 'no-padding' | 'blue' | 'beige' | 'green' | 'gray' | 'beige-outline' | 'gray-outline';
    title?: string;
    href?: string;
    iconName?: string;
    openInNewTab?: boolean;
    external?: boolean;
    children?: ReactNode;
}

export declare interface IPktLoader extends ExtendedLoader {
}

export declare interface IPktMessagebox extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
    skin?: TMessageboxSkin;
    title?: ReactNode;
    compact?: boolean;
    closable?: boolean;
    onClose?: () => void;
}

export declare interface IPktModal extends Omit<HTMLAttributes<HTMLDialogElement>, 'onClose' | 'open'> {
    open?: boolean;
    headingText?: string;
    hideCloseButton?: boolean;
    closeOnBackdropClick?: boolean;
    size?: 'small' | 'medium' | 'large' | 'fit-content';
    removePadding?: boolean;
    closeButtonSkin?: 'blue' | 'yellow-filled';
    variant?: 'dialog' | 'drawer';
    drawerPosition?: 'left' | 'right';
    transparentBackdrop?: boolean;
    onClose?: () => void;
    children?: ReactNode;
    ref?: Ref<HTMLDialogElement>;
}

export declare interface IPktProgressbar extends Omit<HTMLAttributes<HTMLDivElement>, 'role' | 'title'> {
    ariaLabel?: string | null;
    ariaLabelledby?: string | null;
    ariaLive?: TAriaLive;
    ariaValueText?: string | null;
    id?: string;
    role?: TProgressbarRole;
    skin?: TProgressbarSkin;
    statusPlacement?: TProgressbarStatusPlacement;
    statusType?: TProgressbarStatusType;
    title?: string | null;
    titlePosition?: TProgressbarTitlePosition;
    valueCurrent: number;
    valueMax?: number;
    valueMin?: number;
    ref?: Ref<HTMLDivElement>;
}

export declare interface IPktRadioButton extends InputHTMLAttributes<HTMLInputElement> {
    id: string;
    name: string;
    label: string;
    hasTile?: boolean;
    disabled?: boolean;
    checkHelptext?: ReactNode | ReactNode[] | string;
    defaultChecked?: boolean;
    checked?: boolean;
    hasError?: boolean;
    value?: string;
    optionalTag?: boolean;
    optionalText?: string;
    requiredTag?: boolean;
    requiredText?: string;
    tagText?: string | null;
    onChange?: ChangeEventHandler<HTMLInputElement>;
}

declare interface IPktSelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
    ariaDescribedby?: string;
    ariaLabelledby?: string;
    children?: ReactNode | ReactNode[];
    disabled?: boolean;
    errorMessage?: string | ReactNode | ReactNode[];
    hasError?: boolean;
    helptext?: string | ReactNode | ReactNode[];
    helptextDropdown?: string | ReactNode | ReactNode[];
    helptextDropdownButton?: string;
    id: string;
    inline?: boolean;
    fullwidth?: boolean;
    label: string;
    name?: string;
    optionalTag?: boolean;
    optionalText?: string;
    requiredTag?: boolean;
    requiredText?: string;
    tagText?: string | null;
    options?: Array<{
        value: string;
        label: string;
        disabled?: boolean;
    }>;
}

export declare interface IPktStep {
    /**
     * Step content. Can be a string, a React component or an element.
     */
    children?: ReactNode;
    /**
     * Additional class names
     */
    className?: string;
    /**
     * Step status. Can be 'completed', 'incomplete' or 'current'
     */
    status: TStepStatus;
    /**
     * Title of the step
     */
    title: string;
}

export declare interface IPktStepper extends HTMLAttributes<HTMLOListElement> {
    /**
     * The index of the current active step
     */
    activeStep: number;
    /**
     * Children of the Stepper must be Step items. Either an Array of Step items or a single Step item.
     */
    children: ReactElement<IPktStep>[] | ReactElement<IPktStep>;
    /**
     * Additional class names
     */
    className?: string;
    /**
     * Boolean to hide the content of non-active steps content
     * @default true
     */
    hideNonActiveStepsContent?: boolean;
    /**
     * Boolean to hide the content and title of non-active steps
     * @default false
     */
    hideNonActiveSteps?: boolean;
    /**
     * Orientation of the stepper.
     * @default vertical
     */
    orientation?: 'horizontal' | 'vertical';
}

export declare interface IPktTab {
    text: string;
    href?: string;
    action?: (index: number) => void;
    disabled?: boolean;
    icon?: string;
    controls?: string;
    tag?: {
        text: string;
        skin: TSkin | undefined;
    };
    active?: boolean;
}

declare interface IPktTabItem {
    children: ReactNode;
    active?: boolean;
    disabled?: boolean;
    href?: string;
    onClick?: (event: MouseEvent_2) => void;
    icon?: string;
    controls?: string;
    tag?: string;
    tagSkin?: TSkin_2;
    index?: number;
}

declare interface IPktTabs {
    arrowNav?: boolean;
    disableArrowNav?: boolean;
    tabs?: IPktTab[];
    onTabSelected?: (index: number) => void;
    children?: ReactNode;
}

export declare type IPktTag = ButtonPktTagProps | SpanPktTagProps;

export declare interface IPktTextarea extends TextareaHTMLAttributes<HTMLTextAreaElement> {
    id: string;
    ariaDescribedby?: string;
    ariaLabelledby?: string;
    counter?: boolean;
    counterMaxLength?: number;
    disabled?: boolean;
    errorMessage?: string | ReactNode | ReactNode[];
    hasError?: boolean;
    helptext?: string | ReactNode | ReactNode[];
    helptextDropdown?: string | ReactNode | ReactNode[];
    helptextDropdownButton?: string;
    inline?: boolean;
    fullwidth?: boolean;
    label: string;
    name?: string;
    optionalTag?: boolean;
    optionalText?: string;
    requiredTag?: boolean;
    requiredText?: string;
    tagText?: string | null;
    placeholder?: string;
    rows?: number;
    useWrapper?: boolean;
    value?: string;
    autocomplete?: string;
    minLength?: number;
    maxLength?: number;
    readOnly?: boolean;
    required?: boolean;
    skipForwardTestid?: boolean;
    onChange?: ChangeEventHandler<HTMLTextAreaElement>;
}

export declare interface IPktTextinput extends InputHTMLAttributes<HTMLInputElement> {
    id: string;
    ariaDescribedby?: string;
    ariaLabelledby?: string;
    autocomplete?: string;
    counter?: boolean;
    counterMaxLength?: number;
    disabled?: boolean;
    errorMessage?: string | ReactNode | ReactNode[];
    hasError?: boolean;
    helptext?: string | ReactNode | ReactNode[];
    helptextDropdown?: string | ReactNode | ReactNode[];
    helptextDropdownButton?: string;
    iconNameRight?: string;
    inline?: boolean;
    fullwidth?: boolean;
    label: string;
    name?: string;
    optionalTag?: boolean;
    optionalText?: string;
    requiredTag?: boolean;
    requiredText?: string;
    tagText?: string | null;
    placeholder?: string;
    prefix?: string;
    suffix?: string;
    type?: string;
    useWrapper?: boolean;
    value?: string;
    omitSearchIcon?: boolean;
    min?: number | string;
    max?: number | string;
    minLength?: number;
    maxLength?: number;
    step?: string;
    size?: number;
    readonly?: boolean;
    required?: boolean;
    dataTestid?: string;
    onChange?: ChangeEventHandler<HTMLInputElement>;
    skipForwardTestid?: boolean;
}

/**
 * Props for {@link PktTimepicker}: a React time picker with `HH:MM`, aligned with Elements `pkt-timepicker`.
 *
 * The value is submitted via a hidden `input type="time"`; hour/minute fields are the editing UI. Use `value`
 * or `defaultValue` for controlled vs. uncontrolled mode.
 */
export declare interface IPktTimepicker extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'min' | 'max' | 'step' | 'onFocus' | 'onBlur'> {
    /** Unique id; used for hour, minute, popup, and hidden input ids. */
    id: string;
    /** Visible label (InputWrapper). */
    label: string;
    /** Controlled value (`HH:MM`). */
    value?: string;
    /** Initial value when the component is uncontrolled. */
    defaultValue?: string;
    /**
     * Earliest valid time (`HH:MM`). May be a number or string (HTML attribute / RHF).
     * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time}
     */
    min?: string | number;
    /**
     * Latest valid time (`HH:MM`). May be a number or string (HTML attribute / RHF).
     */
    max?: string | number;
    /**
     * Step in **seconds** (e.g. `60` = 1 min, `300` = 5 min). Must be a valid multiple (same rules as Elements).
     * @default 60
     */
    step?: number;
    /** Hides the clock button and popup; shows a static clock icon. */
    hidePicker?: boolean;
    /** Shows previous/next step buttons instead of the popup. */
    stepArrows?: boolean;
    /** Full width (`pkt-timepicker--fullwidth`). */
    fullwidth?: boolean;
    /** Form field name on the hidden `input`; falls back to `id` if omitted. */
    name?: string;
    /** Help text above the field. */
    helptext?: string | ReactNode;
    /** Expandable help text (dropdown). */
    helptextDropdown?: string | ReactNode;
    /** Button label for expandable help text. */
    helptextDropdownButton?: string;
    /** Forces error state on the wrapper. */
    hasError?: boolean;
    /** Error message below the field. */
    errorMessage?: string | ReactNode;
    /** Shows an "optional" tag. */
    optionalTag?: boolean;
    /** Label text for the optional tag. */
    optionalText?: string;
    /** Shows a "required" tag. */
    requiredTag?: boolean;
    /** Label text for the required tag. */
    requiredText?: string;
    /** Extra tag next to the label. */
    tagText?: string | null;
    /** Inline layout in InputWrapper. */
    inline?: boolean;
    /** Show visible label and help text (`false` = screen-reader-only label). */
    useWrapper?: boolean;
    /** Passed through to InputWrapper as `aria-describedby`. */
    ariaDescribedby?: string;
    /** Copy for hours, minutes, buttons, and popup. */
    strings?: ITimepickerStrings;
    /** Change event from the hidden input (`e.target.value` is `HH:MM`). */
    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
    /** Input events while typing or using spinners. */
    onInput?: (e: ChangeEvent<HTMLInputElement>) => void;
    /** Callback with the committed `HH:MM` string. */
    onValueChange?: (value: string) => void;
    /**
     * Fires when focus enters this control from outside (not when moving only between hour and minute).
     * Implemented on the root wrapper; spinbuttons must allow focus to bubble so this runs.
     */
    onFocus?: (e: FocusEvent_2<Element>) => void;
    /** Focus leaves the whole component. */
    onBlur?: (e: FocusEvent_2<Element>) => void;
    /** Extra class names on the root (`pkt-timepicker`). */
    className?: string;
}

declare interface ISearch extends HTMLProps<HTMLInputElement> {
    appearance?: 'local' | 'local-with-button' | 'global';
    disabled?: boolean;
    fullwidth?: boolean;
    id: string;
    label?: string;
    name?: string;
    placeholder?: string;
    suggestions?: SearchSuggestion[];
    value?: string | undefined;
    onSearch?: (value: string) => void;
    onSuggestionClick?: (index: number) => void;
    action?: string;
    method?: 'get' | 'post' | 'dialog';
}

declare interface ISearchForm extends ISearch {
    action?: string;
    method?: 'get' | 'post' | 'dialog';
}

declare interface ISearchInput extends ISearch {
    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
    disabled?: boolean;
}

declare interface ITableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {
    className?: string;
    children: ReactNode;
}

declare interface ITableDataCellProps extends HTMLAttributes<HTMLTableCellElement> {
    className?: string;
    children?: ReactNode;
    dataLabel?: string;
}

declare interface ITableHeaderCellProps extends HTMLAttributes<HTMLTableCellElement> {
    className?: string;
    children: ReactNode;
}

declare interface ITableHeaderProps extends HTMLAttributes<HTMLTableSectionElement> {
    className?: string;
    children: ReactNode;
}

declare interface ITableProps extends HTMLAttributes<HTMLTableElement> {
    compact?: boolean;
    skin?: 'basic' | 'zebra-blue';
    responsiveView?: boolean;
    className?: string;
    children: ReactNode;
}

declare interface ITableRowProps extends HTMLAttributes<HTMLTableRowElement> {
    className?: string;
    children: ReactNode;
}

export declare const ItemRenderers: Record<string, TItemRenderer>;

declare interface Link {
    href: string;
    text: string;
    external?: boolean;
    openInNewTab?: boolean;
}

export declare const PktAccordion: ForwardRefExoticComponent<IPktAccordion & RefAttributes<HTMLDivElement>>;

export declare const PktAccordionItem: ForwardRefExoticComponent<IPktAccordionItem & RefAttributes<HTMLDetailsElement>>;

export declare const PktAlert: FC<IPktAlert>;

export declare const PktBackLink: ForwardRefExoticComponent<Omit<IPktBackLink, "ref"> & RefAttributes<HTMLElement>>;

export declare const PktBreadcrumbs: ForwardRefExoticComponent<IPktBreadcrumbs & RefAttributes<HTMLAnchorElement>>;

export declare const PktButton: ForwardRefExoticComponent<IPktButton & RefAttributes<HTMLButtonElement>>;

export declare const PktCalendar: ForwardRefExoticComponent<IPktCalendar & RefAttributes<PktCalendarHandle>>;

declare interface PktCalendarHandle {
    handleDateSelect: (selectedDate: Date | null) => void;
    addToSelected: (selectedDate: Date) => void;
    removeFromSelected: (selectedDate: Date) => void;
    toggleSelected: (selectedDate: Date) => void;
    focusOnCurrentDate: () => void;
    close: () => void;
}

export declare const PktCard: ForwardRefExoticComponent<Omit<IPktCard, "ref"> & RefAttributes<HTMLDivElement>>;

export declare const PktCheckbox: ForwardRefExoticComponent<IPktCheckbox & RefAttributes<HTMLInputElement>>;

export declare const PktCombobox: ForwardRefExoticComponent<IPktCombobox & RefAttributes<HTMLDivElement>>;

export declare const PktConsent: ForwardRefExoticComponent<IPktConsent>;

export declare const PktDatepicker: ForwardRefExoticComponent<IPktDatepicker & RefAttributes<HTMLDivElement>>;

declare interface PktElType extends HTMLAttributes<HTMLElement> {
    className?: string;
    style?: CSSProperties;
    children?: string | ReactNode | ReactNode[];
    ref?: RefObject<HTMLElement> | LegacyRef<HTMLElement>;
    id?: string;
}

export declare const PktFileUpload: FC<IPktFileUpload>;

export declare const PktFooter: FC<IPktFooter>;

export declare const PktFooterSimple: FC<IPktFooterSimple>;

/**
 * PktHeader - Main header component for Oslo kommune services
 *
 * This component provides a complete header solution with:
 * - Logo and service name
 * - User menu with login/logout functionality
 * - Search functionality
 * - Responsive mobile menu
 * - Fixed positioning with scroll-to-hide
 *
 * TODO: Add `type` prop to switch between `service` and `global` header types
 */
export declare const PktHeader: ForwardRefExoticComponent<IPktHeader & RefAttributes<HTMLDivElement>>;

export declare const PktHeaderService: ForwardRefExoticComponent<IPktHeader & RefAttributes<HTMLDivElement>>;

export declare const PktHeading: FC<IPktHeading>;

export declare const PktHelptext: FC<IPktHelptextProps>;

export declare const PktIcon: FC<IPktIcon>;

/**
 * Input component
 * @param {string} label - Label for the input
 * @param {string} id - Id for the input
 * @param {string} validationMessage - Validation message for the input
 * @param {InputHTMLAttributes<HTMLInputElement>} props - Other props to pass to the input
 * @returns {ReactElement} - React element
 *
 * @example
 * <Input label="First name" id="firstName" validationMessage="First name is required" />
 *
 */
export declare const PktInput: ForwardRefExoticComponent<InputProps & RefAttributes<HTMLInputElement>>;

export declare const PktInputWrapper: ForwardRefExoticComponent<Omit<IPktInputWrapper, "ref"> & RefAttributes<HTMLDivElement>>;

export declare const PktLink: FC<IPktLink>;

export declare const PktLinkCard: {
    ({ children, skin, title, href, iconName, openInNewTab, external, className, ...props }: IPktLinkCard): JSX_2.Element;
    displayName: string;
};

export declare const PktLoader: FC<IPktLoader>;

export declare const PktMessagebox: FC<IPktMessagebox>;

export declare const PktModal: ForwardRefExoticComponent<Omit<IPktModal, "ref"> & RefAttributes<HTMLDialogElement>>;

export declare const PktProgressbar: ForwardRefExoticComponent<Omit<IPktProgressbar, "ref"> & RefAttributes<HTMLDivElement>>;

export declare const PktRadioButton: ForwardRefExoticComponent<IPktRadioButton & RefAttributes<HTMLInputElement>>;

export declare const PktSearchInput: ForwardRefExoticComponent<(Omit<ISearchForm, "ref"> | Omit<ISearchInput, "ref">) & RefAttributes<HTMLInputElement>>;

export declare const PktSelect: ForwardRefExoticComponent<IPktSelectProps & RefAttributes<HTMLSelectElement>>;

export declare const PktStep: ({ children, className, status, title }: IPktStep) => JSX_2.Element;

export declare const PktStepper: ForwardRefExoticComponent<IPktStepper & RefAttributes<HTMLOListElement>>;

export declare const PktTabItem: ForwardRefExoticComponent<IPktTabItem & RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;

export declare const PktTable: ({ className, compact, skin, responsiveView, children, ...props }: ITableProps) => JSX_2.Element;

export declare const PktTableBody: ({ id, children, className, ...props }: ITableBodyProps) => JSX_2.Element;

export declare const PktTableDataCell: ({ children, className, dataLabel, ...props }: ITableDataCellProps) => JSX_2.Element;

export declare const PktTableHeader: ({ className, children, ...props }: ITableHeaderProps) => JSX_2.Element;

export declare const PktTableHeaderCell: ({ className, children, ...props }: ITableHeaderCellProps) => JSX_2.Element;

export declare const PktTableRow: ({ className, children, ...props }: ITableRowProps) => JSX_2.Element;

export declare const PktTabs: ForwardRefExoticComponent<IPktTabs & RefAttributes<HTMLDivElement>>;

export declare const PktTag: ForwardRefExoticComponent<(ButtonPktTagProps | SpanPktTagProps) & RefAttributes<HTMLButtonElement | HTMLSpanElement>>;

export declare const PktTextarea: ForwardRefExoticComponent<IPktTextarea & RefAttributes<HTMLTextAreaElement>>;

export declare const PktTextinput: ForwardRefExoticComponent<IPktTextinput & RefAttributes<HTMLInputElement>>;

export declare const PktTimepicker: ForwardRefExoticComponent<IPktTimepicker & RefAttributes<HTMLDivElement>>;

/** Representing object for header components */
declare interface Representing {
    name: string;
    /** @deprecated shortname is deprecated and will be removed in a future version */
    shortname?: string;
    orgNumber?: string | number;
}

declare interface SearchSuggestion {
    title?: string;
    text?: string;
    href?: string;
    onClick?: () => void;
}

declare interface SocialLink {
    href: string;
    iconName?: string;
    language?: string;
    openInNewTab?: boolean;
}

declare interface SpanPktTagProps extends BasePktTagProps, HTMLAttributes<HTMLSpanElement> {
    closeTag?: false | undefined;
    onClose?: undefined;
    type?: undefined;
}

declare type TCardImageShape = 'square' | 'round';

declare type TCardPadding = 'none' | 'default';

declare type TCardTagPosition = 'top' | 'bottom';

export declare type TFileAndTransfer = FileItem & Pick<TFileTransfer, 'progress' | 'errorMessage' | 'showProgress' | 'lastProgress'>;

export declare type TFileAttribute<T> = {
    get: (fileId: TFileId) => T | undefined;
    set: (fileId: TFileId, attributeValue: T | undefined) => void;
};

export declare type TFileAttributes = <T>(attributeName: string) => TFileAttribute<T>;

/** Unique identifier assigned to each selected file. */
export declare type TFileId = string;

/** The value type for `PktFileUpload` (`value` / `defaultValue`). */
export declare type TFileItemList = Array<FileItem>;

/**
 * Transfer status for a file when using `uploadStrategy="custom"`.
 *
 * - `progress`: `0..1` during upload, or a state (`queued`, `done`, `error`, `canceled`)
 * - `showProgress`: if false, UI uses indeterminate "Laster opp..." style instead of progress bar
 * - `lastProgress`: used to render a "failed at X%" bar when an upload errors
 */
export declare type TFileTransfer = {
    fileId: TFileId;
    progress: number | 'done' | 'error' | 'canceled' | 'queued';
    errorMessage?: string;
    showProgress?: boolean;
    lastProgress?: number;
};

declare type THeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;

/**
 * Custom renderer for how a queue item is displayed (e.g. filename vs thumbnail grid).
 *
 * Must return a renderable React element (or `null`).
 */
export declare type TItemRenderer = (props: {
    transferItem: TFileAndTransfer;
    queueItemOperations: Array<TQueueItemOperation>;
    onPreviewClick?: () => void;
}) => ReactElement | null;

declare type TPktAccordionSkin = TAccordionSkin;

declare type TPktAccordionSkin_2 = TAccordionSkin;

/** Factory that produces a queue item operation given access to file attributes. */
export declare type TQueueItemExtension = (attributes: TFileAttributes) => TQueueItemOperation;

/**
 * An operation that can be attached to a queue item (rename, comment, remove, etc).
 *
 * An operation may:
 * - be a simple action (`onClick`)
 * - render inline UI (e.g. rename)
 * - render extended UI (e.g. comments)
 * - render hidden inputs for form submission (`renderHidden`)
 */
export declare type TQueueItemOperation = {
    title: string | ((fileItem: FileItem) => string);
    ariaLabel?: string | ((fileItem: FileItem) => string);
    onClick?: (transferItem: FileItem) => void;
    renderInlineUI?: (fileItem: FileItem, closeOperationUi: () => void) => ReactNode;
    renderExtendedUI?: (fileItem: FileItem, closeOperationUi: () => void) => ReactNode;
    renderContent?: (fileItem: FileItem, activateOperation?: () => void, isOperationActive?: boolean) => ReactNode;
    renderHidden?: (fileItem: FileItem) => ReactNode;
    symbol: symbol;
};

declare type TSkin = 'blue' | 'green' | 'red' | 'beige' | 'yellow' | 'grey' | 'gray' | 'blue-light';

declare type TSkin_2 = IPktTag['skin'];

declare type TStepStatus = 'completed' | 'incomplete' | 'current';

declare type TTagSkin = 'blue' | 'blue-light' | 'blue-dark' | 'green' | 'red' | 'beige' | 'yellow' | 'grey' | 'gray';

export declare type TTransferItemInProgress = TFileAndTransfer & {
    progress: number;
};

/** Upload mode: `form` posts the files on submit, `custom` posts file IDs and uploads separately. */
export declare type TUploadStrategy = 'custom' | 'form';

/** User object for header components */
declare interface User {
    name: string;
    /** @deprecated shortname is deprecated and will be removed in a future version */
    shortname?: string;
    lastLoggedIn?: string | Date;
}

/** @deprecated Use UserMenuItem instead */
declare interface UserMenuFooterItem {
    title: string;
    target: string | (() => void);
}

/** User menu item for header components */
declare interface UserMenuItem {
    iconName?: string;
    title: string;
    target: string | (() => void);
}

export { }