@utrecht/component-library-react 1.0.0-alpha.99 → 1.0.0

package/dist/Accordion.d.ts

@@ -0,0 +1,48 @@
+import { ForwardedRef, HTMLAttributes, RefObject } from 'react';
+export interface AccordionSectionProps extends HTMLAttributes<HTMLDivElement> {
+    headingLevel?: number;
+    label: string;
+    body: any;
+    expanded?: boolean;
+    disabled?: boolean;
+    section?: boolean;
+    onActivate?: Function;
+    onButtonFocus?: Function;
+    onButtonBlur?: Function;
+    buttonRef?: RefObject<HTMLButtonElement>;
+}
+export declare const AccordionSection: import("react").ForwardRefExoticComponent<AccordionSectionProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface AccordionProps extends HTMLAttributes<HTMLDivElement> {
+    headingLevel?: number;
+    heading?: string;
+    group?: false;
+}
+export declare const Accordion: import("react").ForwardRefExoticComponent<AccordionProps & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export declare const useAccordion: <T>(sections: T[], ref: RefObject<HTMLDivElement | undefined>) => {
+    ref: RefObject<HTMLDivElement | undefined>;
+    refs: RefObject<HTMLDivElement>[];
+    buttonRefs: RefObject<HTMLButtonElement>[];
+    activeElement: null;
+    sections: T[];
+    focusNextSection: (activeElement: RefObject<HTMLDivElement>) => void;
+    focusFirstSection: () => void;
+    focusPreviousSection: (activeElement: RefObject<HTMLDivElement>) => void;
+    focusLastSection: () => void;
+};
+export interface AccordionSectionProviderProps {
+    defaultExpanded?: boolean;
+    expanded?: boolean;
+}
+export declare const useAccordionSection: ({ defaultExpanded, expanded }: AccordionSectionProviderProps, ref: ForwardedRef<HTMLDivElement>) => {
+    ref: ForwardedRef<HTMLDivElement>;
+    expanded: boolean;
+};
+export interface AccordionProviderProps {
+    sections: AccordionSectionProps[];
+}
+export declare const AccordionProvider: {
+    ({ sections }: AccordionProviderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/Alert.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 Robbert Broersma
+ */
+import { HTMLAttributes, ReactNode } from 'react';
+export type AlertType = 'info' | 'ok' | 'warning' | 'error';
+export interface AlertProps extends HTMLAttributes<HTMLDivElement> {
+    icon?: ReactNode;
+    type?: string | AlertType;
+}
+export declare const Alert: import("react").ForwardRefExoticComponent<AlertProps & {
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/AlertDialog.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 Robbert Broersma
+ */
+import { DialogHTMLAttributes, ReactNode } from 'react';
+export type AlertDialogType = 'error' | 'info' | 'warning';
+export interface AlertDialogProps extends DialogHTMLAttributes<HTMLDialogElement> {
+    icon?: ReactNode;
+    type?: string | AlertDialogType;
+}
+export declare const AlertDialog: import("react").ForwardRefExoticComponent<AlertDialogProps & {
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLDialogElement>>;

package/dist/Article.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 Robbert Broersma
+ */
+import { HTMLAttributes } from 'react';
+export type ArticleProps = HTMLAttributes<HTMLElement>;
+export declare const Article: import("react").ForwardRefExoticComponent<ArticleProps & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLElement>>;

package/dist/Backdrop.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 Robbert Broersma
+ */
+import { HTMLAttributes } from 'react';
+export type BackdropProps = HTMLAttributes<HTMLDivElement>;
+export declare const Backdrop: import("react").ForwardRefExoticComponent<BackdropProps & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/BadgeCounter.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2023 Gemeente Utrecht
+ * Copyright (c) 2023 Frameless B.V.
+ */
+import { HTMLAttributes } from 'react';
+export interface BadgeCounterProps extends HTMLAttributes<HTMLElement> {
+    value?: string;
+}
+export declare const BadgeCounter: import("react").ForwardRefExoticComponent<BadgeCounterProps & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLElement | HTMLDataElement>>;

package/dist/BadgeList.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 Robbert Broersma
+ */
+import { HTMLAttributes } from 'react';
+export type BadgeListProps = HTMLAttributes<HTMLDivElement>;
+export declare const BadgeList: import("react").ForwardRefExoticComponent<BadgeListProps & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/BreadcrumbNav.d.ts

@@ -0,0 +1,31 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 Robbert Broersma
+ */
+import { ComponentType, HTMLAttributes, ReactNode } from 'react';
+export interface BreadcrumbNavProps extends HTMLAttributes<HTMLElement> {
+    appearance?: string;
+    headingLevel?: number;
+    label?: ReactNode | ReactNode[];
+}
+export declare const BreadcrumbNav: import("react").ForwardRefExoticComponent<BreadcrumbNavProps & {
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLOListElement>>;
+export declare const BreadcrumbNavItem: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLLIElement> & {
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLLIElement>>;
+export type BreadcrumbNavSeparatorProps = HTMLAttributes<HTMLLIElement>;
+export declare const BreadcrumbNavSeparator: import("react").ForwardRefExoticComponent<BreadcrumbNavSeparatorProps & {
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLLIElement>>;
+export interface BreadcrumbNavLinkProps extends HTMLAttributes<HTMLElement> {
+    current?: boolean;
+    disabled?: boolean;
+    href: string;
+    rel?: string;
+    index?: number;
+    Link?: ComponentType<any>;
+}
+export declare const BreadcrumbNavLink: import("react").ForwardRefExoticComponent<BreadcrumbNavLinkProps & {
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLAnchorElement>>;

package/dist/{cjs/Button.d.ts → Button.d.ts}

@@ -1,24 +1,28 @@
-import { ButtonHTMLAttributes } from 'react';
-export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
-    appearance?: string;
-    busy?: boolean;
-}
-export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
-export declare const PrimaryActionButton: {
-    ({ ...args }: {
-        [x: string]: any;
-    }): JSX.Element;
-    displayName: string;
-};
-export declare const SecondaryActionButton: {
-    ({ ...args }: {
-        [x: string]: any;
-    }): JSX.Element;
-    displayName: string;
-};
-export declare const SubtleButton: {
-    ({ ...args }: {
-        [x: string]: any;
-    }): JSX.Element;
-    displayName: string;
-};
+import { ButtonHTMLAttributes } from 'react';
+export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    appearance?: string;
+    busy?: boolean;
+    hint?: string;
+    pressed?: boolean;
+}
+export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLButtonElement>>;
+export declare const PrimaryActionButton: {
+    ({ ...args }: {
+        [x: string]: any;
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const SecondaryActionButton: {
+    ({ ...args }: {
+        [x: string]: any;
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const SubtleButton: {
+    ({ ...args }: {
+        [x: string]: any;
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/ButtonGroup.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 Robbert Broersma
+ */
+import { HTMLAttributes, ReactNode } from 'react';
+export type ButtonGroupProps = HTMLAttributes<HTMLParagraphElement>;
+export declare const ButtonGroup: import("react").ForwardRefExoticComponent<ButtonGroupProps & {
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLParagraphElement>>;

package/dist/ButtonLink.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 Gemeente Utrecht
+ * Copyright (c) 2021 Robbert Broersma
+ */
+import { AnchorHTMLAttributes } from 'react';
+export interface ButtonLinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'placeholder'> {
+    appearance?: string;
+    external?: boolean;
+    placeholder?: boolean;
+}
+export declare const ButtonLink: import("react").ForwardRefExoticComponent<ButtonLinkProps & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLAnchorElement>>;

package/dist/Calendar/CalendarButton.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { ButtonProps } from '../Button';
+export interface CalendarButtonProps extends ButtonProps {
+}
+export declare const CalendarButton: React.FC<CalendarButtonProps>;

package/dist/Calendar/CalendarIcon.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface CalendarIconProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
+    children?: React.ReactNode;
+}
+export declare const CalendarIcon: React.FC<CalendarIconProps>;

package/dist/Calendar/CalendarNavigation.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface CalendarNavigationProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
+    children?: React.ReactNode;
+}
+export declare const CalendarNavigation: React.FC<CalendarNavigationProps>;

package/dist/Calendar/CalendarNavigationButtons.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { CalendarButtonProps } from './CalendarButton';
+interface CalendarNavigationButtonsProps extends CalendarButtonProps {
+    onPreviousClick?: React.MouseEventHandler<HTMLButtonElement>;
+    onNextClick?: React.MouseEventHandler<HTMLButtonElement>;
+    previousIcon?: any;
+    nextIcon?: any;
+    previousTitle?: string;
+    nextTitle?: string;
+    children?: React.ReactNode;
+}
+export declare const CalendarNavigationButtons: React.FC<CalendarNavigationButtonsProps>;
+export {};

package/dist/Calendar/CalendarNavigationLabel.d.ts

@@ -0,0 +1,4 @@
+import { FC, TimeHTMLAttributes } from 'react';
+type CalendarNavigationLabelProps = TimeHTMLAttributes<HTMLTimeElement>;
+export declare const CalendarNavigationLabel: FC<CalendarNavigationLabelProps>;
+export {};

package/dist/Calendar/CalendarTableDaysContainer.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface CalendarTableDaysContainerProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement> {
+    children?: React.ReactNode;
+}
+export declare const CalendarTableDaysContainer: React.FC<CalendarTableDaysContainerProps>;

package/dist/Calendar/CalendarTableDaysItem.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface CalendarTableDaysItemProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement> {
+    children?: React.ReactNode;
+}
+export declare const CalendarTableDaysItem: React.FC<CalendarTableDaysItemProps>;

package/dist/Calendar/CalendarTableDaysItemDay.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { CalendarButtonProps } from './CalendarButton';
+export interface CalendarTableDaysItemDayProps extends CalendarButtonProps {
+    day: string;
+    dayOutOfTheMonth?: boolean;
+    isToday: boolean;
+    emphasis?: boolean;
+    selected?: boolean;
+    disabled?: boolean;
+}
+export declare const CalendarTableDaysItemDay: React.FC<CalendarTableDaysItemDayProps>;

package/dist/Calendar/CalendarTableWeeksContainer.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const CalendarTableWeeksContainer: React.FC<{
+    children?: React.ReactNode;
+}>;

package/dist/Calendar/CalendarTableWeeksItem.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface CalendarTableWeeksItemProps extends React.DetailedHTMLProps<React.ThHTMLAttributes<HTMLTableCellElement>, HTMLTableCellElement> {
+    children?: React.ReactNode;
+}
+export declare const CalendarTableWeeksItem: React.FC<CalendarTableWeeksItemProps>;

package/dist/Calendar/IconArrowLeft.d.ts

@@ -0,0 +1,7 @@
+import { SVGProps } from 'react';
+interface SVGRProps {
+    title?: string;
+    titleId?: string;
+}
+export declare const IconArrowLeft: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Calendar/IconArrowLeftDouble.d.ts

@@ -0,0 +1,7 @@
+import { SVGProps } from 'react';
+interface SVGRProps {
+    title?: string;
+    titleId?: string;
+}
+export declare const IconArrowLeftDouble: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Calendar/IconArrowRight.d.ts

@@ -0,0 +1,7 @@
+import { SVGProps } from 'react';
+interface SVGRProps {
+    title?: string;
+    titleId?: string;
+}
+export declare const IconArrowRight: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Calendar/IconArrowRightDouble.d.ts

@@ -0,0 +1,7 @@
+import { SVGProps } from 'react';
+interface SVGRProps {
+    title?: string;
+    titleId?: string;
+}
+export declare const IconArrowRightDouble: ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Calendar/index.d.ts

@@ -0,0 +1,42 @@
+import { Locale } from 'date-fns';
+import { FC } from 'react';
+export type Events = {
+    date: string;
+    emphasis?: boolean;
+    selected?: boolean;
+    disabled?: boolean;
+};
+export interface CalendarProps {
+    /**
+     * `onCalendarClick` It's a callback function that returns the selected date, triggered when you click on the day
+     *
+     * */
+    onCalendarClick: (date: string) => void;
+    /**
+     * `events` An array of event objects that contain some properties that allow you to change the calendar day style base on your value
+     * `{date?: Date; emphasis?: boolean; selected?: boolean; disabled?: boolean;}`
+     *
+     * */
+    events?: Events[];
+    /**
+     * `currentDate` The default value is `new Date()`, but you can provide a different date
+     *   https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date
+     * */
+    currentDate?: Date;
+    /**
+     * `locale` to change the calendar language by using 'date-fns/locale'
+     *  `import { nl, enUS } from 'date-fns/locale';`
+     * */
+    locale?: Locale;
+    previousYearButtonTitle?: string;
+    nextYearButtonTitle?: string;
+    previousMonthButtonTitle?: string;
+    nextMonthButtonTitle?: string;
+    minDate?: Date;
+    maxDate?: Date;
+}
+/**
+ * Calendar Component
+ * powered by date-fns, so that make it easy to use the `date-fns` date functions & locale
+ * */
+export declare const Calendar: FC<CalendarProps>;

package/dist/Calendar.d.ts

@@ -0,0 +1,2 @@
+export type { CalendarProps } from './Calendar/index';
+export { Calendar } from './Calendar/index';