@transferwise/components 0.0.0-experimental-215a547 → 0.0.0-experimental-0dbf5cd

package/build/types/info/Info.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { SizeSmall, SizeLarge } from '../common';
 import { PopoverPreferredPlacement } from '../popover';
-export interface Props {
+export interface InfoProps {
     'aria-label'?: string;
     /**
      * Extra classes applied to Info
@@ -29,6 +29,6 @@ export interface Props {
      */
     preferredPlacement?: PopoverPreferredPlacement;
 }
-declare const Info: ({ className, content, onClick, presentation, size, title, "aria-label": ariaLabel, preferredPlacement, }: Props) => import("react").JSX.Element;
+declare const Info: ({ className, content, onClick, presentation, size, title, "aria-label": ariaLabel, preferredPlacement, }: InfoProps) => import("react").JSX.Element;
 export default Info;
 //# sourceMappingURL=Info.d.ts.map

package/build/types/info/Info.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Info.d.ts","sourceRoot":"","sources":["../../../src/info/Info.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAkB,SAAS,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAEjE,OAAgB,EAAE,yBAAyB,EAAE,MAAM,YAAY,CAAC;AAKhE,MAAM,WAAW,KAAK;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACnC;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC7B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,kBAAkB,CAAC,EAAE,yBAAyB,CAAC;CAChD;AAED,QAAA,MAAM,IAAI,6GASP,KAAK,gCAiDP,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Info.d.ts","sourceRoot":"","sources":["../../../src/info/Info.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAkB,SAAS,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAEjE,OAAgB,EAAE,yBAAyB,EAAE,MAAM,YAAY,CAAC;AAKhE,MAAM,WAAW,SAAS;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACnC;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC7B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,kBAAkB,CAAC,EAAE,yBAAyB,CAAC;CAChD;AAED,QAAA,MAAM,IAAI,6GASP,SAAS,gCAiDX,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/build/types/info/index.d.ts

@@ -1,4 +1,4 @@
 export { InfoPresentation } from './infoPresentations';
 export { default } from './Info';
-export type { Props as InfoProps } from './Info';
+export type { InfoProps } from './Info';
 //# sourceMappingURL=index.d.ts.map

package/build/types/info/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/info/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACjC,YAAY,EAAE,KAAK,IAAI,SAAS,EAAE,MAAM,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/info/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACjC,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/components",
-  "version": "0.0.0-experimental-215a547",
+  "version": "0.0.0-experimental-0dbf5cd",
   "description": "Neptune React components",
   "license": "Apache-2.0",
   "repository": {
@@ -93,8 +93,8 @@
     "react-intl": "^6.6.6",
     "rollup": "^4.17.2",
     "storybook": "^8.1.10",
-    "@transferwise/less-config": "3.1.0",
     "@wise/components-theming": "1.3.0",
+    "@transferwise/less-config": "3.1.0",
     "@transferwise/neptune-css": "14.10.0"
   },
   "peerDependencies": {

package/src/dateInput/DateInput.story.tsx

@@ -1,13 +1,10 @@
 import { Meta, StoryObj } from '@storybook/react';
 import { userEvent, within } from '@storybook/test';
-import * as React from 'react';
 
 import { DateInput, DateMode, Info, InlineAlert, Title, Typography } from '..';
 import { lorem10, storyConfig } from '../test-utils';
 
-import { DateInputProps } from './DateInput';
-
-export default {
+const meta = {
   component: DateInput,
   title: 'Forms/DateInput',
   args: {
@@ -20,16 +17,24 @@ export default {
   tags: ['autodocs'],
 } satisfies Meta<typeof DateInput>;
 
-type Story = StoryObj<DateInputProps>;
+export default meta;
 
-export const Basic: StoryObj = {};
+type Story = StoryObj<typeof meta>;
 
-Basic.play = async ({ canvasElement }) => {
-  const canvas = within(canvasElement);
-  await userEvent.click(canvas.getByRole('button'));
-};
+export const Basic = {
+  args: {
+    onChange: () => {},
+  },
+  play: async ({ canvasElement }) => {
+    const canvas = within(canvasElement);
+    await userEvent.click(canvas.getByRole('button'));
+  },
+} satisfies Story;
 
-export const WithLabel: Story = {
+export const WithLabel = {
+  args: {
+    onChange: () => {},
+  },
   render: (args) => {
     const id1 = 'date-input-group-label-1';
     const label = 'Date of Birth';
@@ -71,11 +76,11 @@ export const WithLabel: Story = {
       </>
     );
   },
-};
+} satisfies Story;
 
-export const BasicMobile: Story = storyConfig(Basic, { variants: ['mobile'] });
+export const BasicMobile = storyConfig(Basic, { variants: ['mobile'] });
 
-export const InputError: Story = {
+export const InputError = {
   ...Basic,
   render: (args) => (
     <div className="form-group has-error">
@@ -83,6 +88,6 @@ export const InputError: Story = {
       <InlineAlert type="error">{lorem10}</InlineAlert>
     </div>
   ),
-};
+} satisfies Story;
 
-export const InputErrorMobile: Story = storyConfig(InputError, { variants: ['mobile'] });
+export const InputErrorMobile = storyConfig(InputError, { variants: ['mobile'] });

package/src/info/Info.story.tsx

@@ -5,7 +5,7 @@ import { lorem10, storyConfig } from '../test-utils';
 
 import Info, { InfoPresentation } from '.';
 
-export default {
+const meta = {
   component: Info,
   title: 'Dialogs/Info',
   args: {
@@ -20,16 +20,18 @@ export default {
   ),
 } satisfies Meta<typeof Info>;
 
-type Story = StoryObj<typeof Info>;
+export default meta;
 
-export const Basic: Story = storyConfig(
+type Story = StoryObj<typeof meta>;
+
+export const Basic = storyConfig<typeof meta>(
   {},
   {
     variants: ['default', 'dark', 'rtl'],
   },
 );
 
-export const OpenedPopover: Story = {
+export const OpenedPopover = {
   parameters: {
     chromatic: {
       delay: 1000,
@@ -39,15 +41,19 @@ export const OpenedPopover: Story = {
     const canvas = within(canvasElement);
     await userEvent.click(canvas.getByRole('button'));
   },
-};
+} satisfies Story;
 
-export const OpenedPopoverMobile: Story = storyConfig(OpenedPopover, { variants: ['mobile'] });
+export const OpenedPopoverMobile = storyConfig(OpenedPopover, {
+  variants: ['mobile'],
+});
 
-export const OpenedModal: Story = {
+export const OpenedModal = {
   ...OpenedPopover,
   args: {
     presentation: InfoPresentation.MODAL,
   },
-};
+} satisfies Story;
 
-export const OpenedModalMobile: Story = storyConfig(OpenedModal, { variants: ['mobile'] });
+export const OpenedModalMobile = storyConfig(OpenedModal, {
+  variants: ['mobile'],
+});

package/src/info/Info.tsx

@@ -10,7 +10,7 @@ import Popover, { PopoverPreferredPlacement } from '../popover';
 import messages from './Info.messages';
 import { InfoPresentation } from './infoPresentations';
 
-export interface Props {
+export interface InfoProps {
   'aria-label'?: string;
   /**
    * Extra classes applied to Info
@@ -48,7 +48,7 @@ const Info = ({
   title = undefined,
   'aria-label': ariaLabel,
   preferredPlacement = Position.BOTTOM,
-}: Props) => {
+}: InfoProps) => {
   const intl = useIntl();
   const [open, setOpen] = useState(false);
   ariaLabel ??= intl.formatMessage(messages.ariaLabel);

package/src/info/index.ts

@@ -1,3 +1,3 @@
 export { InfoPresentation } from './infoPresentations';
 export { default } from './Info';
-export type { Props as InfoProps } from './Info';
+export type { InfoProps } from './Info';