@amsterdam/design-system-react 0.1.8 → 0.2.0

package/LICENSE.md

@@ -11,7 +11,7 @@ The Work is provided under the terms of this Licence when the Licensor (as
 defined below) has placed the following notice immediately following the
 copyright notice for the Work:
 
-    Licensed under the EUPL
+‘Licensed under the EUPL’
 
 or has expressed by any other means his willingness to license under the EUPL.
 

package/dist/Dialog/Dialog.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright (c) 2023 Gemeente Amsterdam
+ */
+import { DialogHTMLAttributes, PropsWithChildren, ReactNode } from 'react';
+export interface DialogProps extends PropsWithChildren<DialogHTMLAttributes<HTMLDialogElement>> {
+    actions?: ReactNode;
+}
+export declare const Dialog: import("react").ForwardRefExoticComponent<DialogProps & import("react").RefAttributes<HTMLDialogElement>>;

package/dist/Dialog/Dialog.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/Dialog/index.d.ts

@@ -0,0 +1,2 @@
+export { Dialog } from './Dialog';
+export type { DialogProps } from './Dialog';

package/dist/Grid/Grid.d.ts

@@ -10,7 +10,6 @@ export type GridColumnNumbers = {
     medium: GridColumnNumber;
     wide: GridColumnNumber;
 };
-type GridDensity = 'low' | 'high';
 type GridPaddingSize = 'small' | 'medium' | 'large';
 type GridPaddingVerticalProp = {
     paddingBottom?: never;
@@ -27,11 +26,14 @@ type GridPaddingTopAndBottomProps = {
 };
 export type GridProps = {
     /**
-     * The density of the grid: low (for websites) or high (for applications).
-     * Adjusts the pace with which columns get wider, and the start width as well.
-     * This is to be implemented more generally – it will be moved into a theme soon.
+     * Opts in to a less spacious layout.
+     * Decreases whitespace between columns and to the sides of the grid.
+     * This usually works well for applications.
+     * @todo Implement more generally – it will be moved into a theme soon.
      */
-    density?: GridDensity;
+    compact?: boolean;
+    /** The amount of vertical whitespace between rows of the grid. */
+    gapVertical?: 'small' | 'large';
 } & (GridPaddingVerticalProp | GridPaddingTopAndBottomProps) & PropsWithChildren<HTMLAttributes<HTMLDivElement>>;
 interface GridComponent extends ForwardRefExoticComponent<GridProps & RefAttributes<HTMLDivElement>> {
     Cell: typeof GridCell;

package/dist/Logo/Logo.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright (c) 2023 Gemeente Amsterdam
+ */
+import { ForwardRefExoticComponent, RefAttributes, SVGProps } from 'react';
+type LogoBrand = 'amsterdam' | 'ggd-amsterdam' | 'stadsarchief' | 'stadsbank-van-lening' | 'vga-verzekeringen';
+export interface LogoProps extends SVGProps<SVGSVGElement> {
+    brand?: LogoBrand;
+}
+export declare const Logo: ForwardRefExoticComponent<Omit<LogoProps, "ref"> & RefAttributes<SVGSVGElement>>;
+export {};

package/dist/Logo/Logo.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/Logo/brand/LogoAmsterdam.d.ts

@@ -0,0 +1,3 @@
+import { type SVGProps } from 'react';
+declare const LogoAmsterdam: import("react").ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+export default LogoAmsterdam;

package/dist/Logo/brand/LogoGgdAmsterdam.d.ts

@@ -0,0 +1,3 @@
+import { type SVGProps } from 'react';
+declare const LogoGgdAmsterdam: import("react").ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+export default LogoGgdAmsterdam;

package/dist/Logo/brand/LogoStadsarchief.d.ts

@@ -0,0 +1,3 @@
+import { type SVGProps } from 'react';
+declare const LogoStadsarchief: import("react").ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+export default LogoStadsarchief;

package/dist/Logo/brand/LogoStadsbankVanLening.d.ts

@@ -0,0 +1,3 @@
+import { type SVGProps } from 'react';
+declare const LogoStadsbankVanLening: import("react").ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+export default LogoStadsbankVanLening;

package/dist/Logo/brand/LogoVgaVerzekeringen.d.ts

@@ -0,0 +1,3 @@
+import { type SVGProps } from 'react';
+declare const LogoVgaVerzekeringen: import("react").ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+export default LogoVgaVerzekeringen;

package/dist/Logo/brand/index.d.ts

@@ -0,0 +1,5 @@
+export { default as LogoAmsterdam } from './LogoAmsterdam';
+export { default as LogoGgdAmsterdam } from './LogoGgdAmsterdam';
+export { default as LogoStadsarchief } from './LogoStadsarchief';
+export { default as LogoStadsbankVanLening } from './LogoStadsbankVanLening';
+export { default as LogoVgaVerzekeringen } from './LogoVgaVerzekeringen';

package/dist/Logo/index.d.ts

@@ -0,0 +1,2 @@
+export { Logo } from './Logo';
+export type { LogoProps } from './Logo';

package/dist/PageMenu/PageMenu.d.ts

@@ -3,7 +3,13 @@
  * Copyright (c) 2023 Gemeente Amsterdam
  */
 import { AnchorHTMLAttributes, ButtonHTMLAttributes, ForwardRefExoticComponent, HTMLAttributes, PropsWithChildren, RefAttributes } from 'react';
-type PageMenuProps = PropsWithChildren<HTMLAttributes<HTMLUListElement>>;
+type PageMenuProps = {
+    /**
+     * Whether the page menu’s items align to its end.
+     * If the menu itself aligns to the end of its container, you should set this to `true`.
+     */
+    alignEnd?: boolean;
+} & PropsWithChildren<HTMLAttributes<HTMLUListElement>>;
 interface PageMenuComponent extends ForwardRefExoticComponent<PageMenuProps & RefAttributes<HTMLElement>> {
     Link: typeof PageMenuLink;
     Button: typeof PageMenuButton;