@altinn/altinn-components 0.2.0 → 0.2.1

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [0.2.1](https://github.com/Altinn/altinn-components/compare/v0.2.0...v0.2.1) (2024-11-06)
+
+
+### Bug Fixes
+
+* export members and add use client if needed for next support ([#26](https://github.com/Altinn/altinn-components/issues/26)) ([cb2c52e](https://github.com/Altinn/altinn-components/commit/cb2c52e8f8bd3b2633b439285bb8f4e5dc36d2ed))
+
 ## [0.2.0](https://github.com/Altinn/altinn-components/compare/v0.1.0...v0.2.0) (2024-11-06)
 
 

package/lib/components/Avatar/AvatarGroup.tsx

@@ -1,3 +1,4 @@
+'use client';
 import cx from 'classnames';
 import { useMemo } from 'react';
 import { Avatar, type AvatarProps, type AvatarSize, type AvatarType } from '.';

package/lib/components/ContextMenu/index.ts

@@ -0,0 +1 @@
+export * from './ContextMenu';

package/lib/components/Dialog/Dialog.tsx

@@ -10,7 +10,7 @@ import { DialogHeader } from './DialogHeader';
 import { DialogSeenBy, type DialogSeenByProps } from './DialogSeenBy';
 
 import type { ReactNode } from 'react';
-import { DialogAction, type DialogActionButtonProps } from './DialogAction';
+import { type DialogActionButtonProps, DialogActions } from './DialogActions.tsx';
 import type { DialogRecipientProps, DialogSenderProps } from './DialogHeadings.tsx';
 import { DialogHistory, type DialogHistoryProps } from './DialogHistory';
 import { type DialogBackButtonProps, DialogNav } from './DialogNav';
@@ -87,7 +87,7 @@ export const Dialog = ({
         <DialogBodyBase>
           <DialogContent updatedAt={updatedAt} updatedByName={updatedByName} summary={summary} body={body} />
           {attachments && <DialogAttachments {...attachments} />}
-          {actions?.length > 0 && <DialogAction items={actions} />}
+          {actions?.length > 0 && <DialogActions items={actions} />}
           <MetaBase>
             {seenBy && <DialogSeenBy {...seenBy} />}
             {activityLog && <DialogActivityLog {...activityLog} />}

package/lib/components/Dialog/{DialogAction.stories.ts → DialogActions.stories.ts}

@@ -1,23 +1,25 @@
 import type { Meta, StoryObj } from '@storybook/react';
-import { DialogAction } from './DialogAction';
+import { DialogActions } from './DialogActions';
 
 const meta = {
-  title: 'Dialog/Sections/DialogAction',
-  component: DialogAction,
+  title: 'Dialog/Sections/DialogActions',
+  component: DialogActions,
   tags: ['autodocs'],
   args: {
     items: [
       {
         label: 'Primary',
         priority: 'primary',
+        id: 'primary',
       },
       {
         label: 'Secondary',
         priority: 'secondary',
+        id: 'secondary',
       },
     ],
   },
-} satisfies Meta<typeof DialogAction>;
+} satisfies Meta<typeof DialogActions>;
 
 export default meta;
 type Story = StoryObj<typeof meta>;
@@ -34,18 +36,22 @@ export const MultipleButtons: Story = {
   args: {
     items: [
       {
+        id: 'primary',
         label: 'Primary',
         priority: 'primary',
       },
       {
+        id: 'secondary-1',
         label: 'Secondary',
         priority: 'secondary',
       },
       {
+        id: 'tertiary-1',
         label: 'Third action',
         priority: 'tertiary',
       },
       {
+        id: 'tertiary-2',
         label: 'Fourth action',
         priority: 'tertiary',
       },

package/lib/components/Dialog/{DialogAction.tsx → DialogActions.tsx}

@@ -1,3 +1,4 @@
+'use client';
 import { type MouseEventHandler, useMemo, useState } from 'react';
 import { Button, ComboButton } from '../Button';
 import { Menu, type MenuItemProps } from '../Menu';
@@ -13,14 +14,14 @@ export interface DialogActionButtonProps {
   loading?: boolean;
 }
 
-export interface DialogActionProps {
+export interface DialogActionsProps {
   /** List of actions */
   items: DialogActionButtonProps[];
   /** How many actions to display before turning into a ComboButton */
   maxItems?: number;
 }
 
-export const DialogAction = ({ items, maxItems = 2 }: DialogActionProps) => {
+export const DialogActions = ({ items, maxItems = 2 }: DialogActionsProps) => {
   const [expanded, setExpanded] = useState<boolean>(false);
   const sortedItems = useMemo(() => {
     return (items || []).sort((a, b) => {

package/lib/components/Dialog/DialogHeaderBase.tsx

@@ -1,10 +1,10 @@
 import type { ReactNode } from 'react';
 import styles from './dialogHeaderBase.module.css';
 
-export interface DialogHeaderProps {
+export interface DialogHeaderBaseProps {
   children?: ReactNode;
 }
 
-export const DialogHeaderBase = ({ children }: DialogHeaderProps) => {
+export const DialogHeaderBase = ({ children }: DialogHeaderBaseProps) => {
   return <header className={styles.header}>{children}</header>;
 };

package/lib/components/Dialog/index.ts

@@ -1,2 +1,24 @@
+export * from './Dialog';
+export * from './DialogList';
 export * from './DialogMetadata';
 export * from './DialogListItem';
+export * from './DialogListItemBase';
+export * from './DialogActions.tsx';
+export * from './DialogActivityLog';
+export * from './DialogArticleBase';
+export * from './DialogBase';
+export * from './DialogBodyBase';
+export * from './DialogBorder';
+export * from './DialogContent';
+export * from './DialogFooter';
+export * from './DialogHeader';
+export * from './DialogHeaderBase';
+export * from './DialogHeadings';
+export * from './DialogHistory';
+export * from './DialogNav';
+export * from './DialogSectionBase';
+export * from './DialogSeenBy';
+export * from './DialogSelect';
+export * from './DialogStatus';
+export * from './DialogTitle';
+export * from './DialogTouchedBy';

package/lib/components/List/index.ts

@@ -2,3 +2,5 @@ export * from './ListItemBase';
 export * from './ListItem';
 export * from './ListBase';
 export * from './List';
+export * from './ListItemLabel';
+export * from './ListItemMedia';

package/lib/components/Menu/useClickOutside.ts

@@ -1,3 +1,4 @@
+'use client';
 import { type RefObject, useEffect } from 'react';
 
 export const useClickOutside = (ref: RefObject<HTMLDivElement>, callback: () => void) => {

package/lib/components/Menu/useEscapeKey.ts

@@ -1,3 +1,4 @@
+'use client';
 import { useEffect } from 'react';
 
 export const useEscapeKey = (onEscape: () => void): void => {

package/lib/components/Meta/index.ts

@@ -1,6 +1,8 @@
 export * from './MetaBase';
 export * from './MetaList';
 export * from './MetaItemBase';
+export * from './MetaItemMedia';
+export * from './MetaItemLabel';
 export * from './MetaItem';
 export * from './MetaProgress';
 export * from './MetaTimestamp';

package/lib/components/index.ts

@@ -1,10 +1,15 @@
+export * from './Attachment';
 export * from './Avatar';
-export * from './Button';
 export * from './Badge';
+export * from './Button';
+export * from './ContextMenu';
+export * from './Dialog';
 export * from './Header';
+export * from './History';
 export * from './Icon';
 export * from './Layout';
 export * from './List';
 export * from './Menu';
 export * from './Meta';
 export * from './Toolbar';
+export * from './Typography';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@altinn/altinn-components",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "main": "lib/index.ts",
   "description": "Reusable react components",
   "publishConfig": {