@mirohq/design-system-callout 1.2.15 → 1.3.0-fix-stitches-types.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/main.js +4 -10
  2. package/dist/main.js.map +1 -1
  3. package/dist/module.js +1 -1
  4. package/dist/module.js.map +1 -1
  5. package/dist/types.d.ts +27 -7
  6. package/package.json +6 -6
package/dist/main.js CHANGED
@@ -1,7 +1,5 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
3
  var jsxRuntime = require('react/jsx-runtime');
6
4
  var React = require('react');
7
5
  var designSystemPrimitive = require('@mirohq/design-system-primitive');
@@ -10,10 +8,6 @@ var designSystemIcons = require('@mirohq/design-system-icons');
10
8
  var designSystemTypography = require('@mirohq/design-system-typography');
11
9
  var designSystemIconButton = require('@mirohq/design-system-icon-button');
12
10
 
13
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
14
-
15
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
16
-
17
11
  const StyledCallout = designSystemStitches.styled(designSystemPrimitive.Primitive.div, {
18
12
  position: "relative",
19
13
  gap: "$150",
@@ -114,18 +108,18 @@ const iconVariant = {
114
108
  information: /* @__PURE__ */ jsxRuntime.jsx(designSystemIcons.IconInformationMarkCircle, {}),
115
109
  default: /* @__PURE__ */ jsxRuntime.jsx(designSystemIcons.IconCheckMark, {})
116
110
  };
117
- const IconSlot = React__default["default"].forwardRef(({ children, ...restProps }, forwardRef) => {
111
+ const IconSlot = React.forwardRef(({ children, ...restProps }, forwardRef) => {
118
112
  var _a;
119
113
  const { variant } = useCalloutContext();
120
114
  let formattedChildren = children;
121
- if (React__default["default"].Children.count(children) < 1) {
115
+ if (React.Children.count(children) < 1) {
122
116
  formattedChildren = (_a = iconVariant[variant]) != null ? _a : iconVariant.default;
123
117
  }
124
118
  return /* @__PURE__ */ jsxRuntime.jsx(StyledIconSlot, { ...restProps, ref: forwardRef, variant, children: formattedChildren });
125
119
  });
126
120
 
127
121
  const StyledTitle = designSystemStitches.styled(designSystemTypography.Heading, { lineHeight: "$300" });
128
- const Title = React__default["default"].forwardRef(
122
+ const Title = React.forwardRef(
129
123
  ({ level = 4, ...props }, forwardRef) => /* @__PURE__ */ jsxRuntime.jsx(StyledTitle, { ...props, ref: forwardRef, level, styledAs: "h4" })
130
124
  );
131
125
  Title.displayName = "Callout.Title";
@@ -155,7 +149,7 @@ const DismissButton = (props) => /* @__PURE__ */ jsxRuntime.jsx(
155
149
  );
156
150
  DismissButton.displayName = "Callout.DismissButton";
157
151
 
158
- const Callout = React__default["default"].forwardRef(
152
+ const Callout = React.forwardRef(
159
153
  ({
160
154
  dismissed,
161
155
  dismissible = true,
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"main.js","sources":["../src/callout.styled.tsx","../src/partials/content.tsx","../src/partials/description.tsx","../src/hooks/use-callout-context.tsx","../src/partials/icon-slot.styled.ts","../src/partials/icon-slot.tsx","../src/partials/title.tsx","../src/partials/actions.tsx","../src/partials/dismiss-button.tsx","../src/callout.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledCallout = styled(Primitive.div, {\n position: 'relative',\n gap: '$150',\n padding: '$200',\n borderWidth: '$sm',\n borderStyle: 'solid',\n borderRadius: '$75',\n display: 'grid',\n justifyContent: 'center',\n gridTemplateColumns: 'auto 1fr',\n gridTemplateAreas: `'icon content'`,\n variants: {\n variant: {\n information: {\n backgroundColor: '$background-primary-subtle',\n borderColor: '$border-primary-subtle',\n },\n warning: {\n backgroundColor: '$background-warning-subtle',\n borderColor: '$border-warning-subtle',\n },\n danger: {\n backgroundColor: '$background-danger-subtle',\n borderColor: '$border-danger-subtle',\n },\n success: {\n backgroundColor: '$background-success-subtle',\n borderColor: '$border-success-subtle',\n },\n },\n dismissible: {\n true: {\n padding: '$200 $400 $200 $200',\n },\n false: {\n gridTemplateColumns: 'auto 1fr',\n gridTemplateAreas: `'icon content'`,\n },\n },\n },\n})\n\nexport type StyledCalloutProps = ComponentPropsWithRef<typeof StyledCallout>\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Content = styled(Primitive.div, {\n display: 'flex',\n flexDirection: 'column',\n gap: '$25',\n maxWidth: '48em',\n gridArea: 'content',\n})\n\nContent.displayName = 'Callout.Content'\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Description = styled(Primitive.div, {\n color: '$text-neutrals',\n fontSize: '$175',\n lineHeight: '$400',\n marginTop: '$25',\n})\n\nDescription.displayName = 'Callout.Description'\n","import { createContext, useContext } from 'react'\n\nimport type { StyledCalloutProps } from '../callout.styled'\n\ninterface CalloutProps {\n variant?: StyledCalloutProps['variant']\n}\n\ninterface CalloutContextProps extends CalloutProps {}\n\nexport interface CalloutProviderProps extends CalloutContextProps {\n children: React.ReactNode\n}\n\nconst CalloutContext = createContext<CalloutContextProps>({} as any)\n\nexport const CalloutProvider = ({\n children,\n ...restProps\n}: CalloutProviderProps): JSX.Element => (\n <CalloutContext.Provider\n value={{\n ...restProps,\n }}\n >\n {children}\n </CalloutContext.Provider>\n)\n\nexport const useCalloutContext = (): CalloutContextProps =>\n useContext(CalloutContext)\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledIconSlot = styled(Primitive.div, {\n variants: {\n variant: {\n information: {\n color: '$icon-primary',\n },\n warning: {\n color: '$icon-warning',\n },\n danger: {\n color: '$icon-danger',\n },\n success: {\n color: '$icon-success',\n },\n },\n },\n})\n","import React from 'react'\nimport type { ElementRef, ComponentPropsWithRef } from 'react'\nimport {\n IconCheckMark,\n IconExclamationPointCircle,\n IconInformationMarkCircle,\n} from '@mirohq/design-system-icons'\n\nimport { useCalloutContext } from '../hooks/use-callout-context'\nimport { StyledIconSlot } from './icon-slot.styled'\n\nexport type StyledIconSlotProps = ComponentPropsWithRef<typeof StyledIconSlot>\n\nexport interface IconSlotProps extends StyledIconSlotProps {\n /**\n * The icon.\n */\n children?: React.ReactNode\n}\n\nconst iconVariant = {\n success: <IconCheckMark />,\n warning: <IconExclamationPointCircle />,\n danger: <IconExclamationPointCircle />,\n information: <IconInformationMarkCircle />,\n default: <IconCheckMark />,\n}\n\nexport const IconSlot = React.forwardRef<\n ElementRef<typeof StyledIconSlot>,\n IconSlotProps\n>(({ children, ...restProps }, forwardRef) => {\n const { variant } = useCalloutContext()\n\n let formattedChildren = children\n if (React.Children.count(children) < 1) {\n formattedChildren =\n iconVariant[variant as keyof typeof iconVariant] ?? iconVariant.default\n }\n\n return (\n <StyledIconSlot {...restProps} ref={forwardRef} variant={variant}>\n {formattedChildren}\n </StyledIconSlot>\n )\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Heading } from '@mirohq/design-system-typography'\nimport type { HeadingProps } from '@mirohq/design-system-typography'\n\nconst StyledTitle = styled(Heading, { lineHeight: '$300' })\n\nexport interface TitleProps extends Omit<HeadingProps, 'level' | 'styledAs'> {\n level?: HeadingProps['level']\n}\n\nexport const Title = React.forwardRef<ElementRef<typeof Heading>, TitleProps>(\n ({ level = 4, ...props }, forwardRef) => (\n <StyledTitle {...props} ref={forwardRef} level={level} styledAs='h4' />\n )\n)\n\nTitle.displayName = 'Callout.Title'\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Actions = styled(Primitive.div, {\n gridColumn: 'content',\n gridRow: -1,\n display: 'flex',\n gap: '$100',\n})\n\nActions.displayName = 'Callout.Actions'\n","import { styled } from '@mirohq/design-system-stitches'\nimport { IconButton } from '@mirohq/design-system-icon-button'\nimport type { IconButtonProps } from '@mirohq/design-system-icon-button'\nimport { IconCross } from '@mirohq/design-system-icons'\n\nconst StyledDismissButton = styled(IconButton, {\n position: 'absolute',\n right: '$50',\n top: '$50',\n})\n\nexport const DismissButton = (props: IconButtonProps): React.ReactNode => (\n <StyledDismissButton\n variant='ghost'\n size='medium'\n data-testid='dismiss-button'\n {...props}\n >\n <IconCross />\n </StyledDismissButton>\n)\n\nDismissButton.displayName = 'Callout.DismissButton'\n","import React, { useState } from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\n\nimport { StyledCallout } from './callout.styled'\nimport type { StyledCalloutProps } from './callout.styled'\nimport { Content } from './partials/content'\nimport { Description } from './partials/description'\nimport { IconSlot } from './partials/icon-slot'\nimport { Title } from './partials/title'\nimport { Actions } from './partials/actions'\nimport { CalloutProvider } from './hooks/use-callout-context'\nimport { DismissButton } from './partials/dismiss-button'\n\ninterface DismissibleProps {\n /**\n * Whether or not the component is dismissed (hidden)\n */\n dismissed?: boolean\n\n /**\n * Callback invoked once dismiss button is clicked\n */\n onDismiss?: () => void\n\n /**\n * aria-label for the dismiss button\n */\n dismissLabel: string\n}\n\nexport type CalloutProps = (Omit<StyledCalloutProps, 'dismissible'> & {\n /**\n * Change the component style.\n */\n variant: StyledCalloutProps['variant']\n\n /**\n * Whether or not the component should display dismiss button\n * @default true\n */\n dismissible?: boolean\n}) &\n (\n | DismissibleProps // uncontrolled\n | Required<DismissibleProps> // controlled\n | ({ dismissible?: false } & { [K in keyof DismissibleProps]?: never })\n )\n\nexport const Callout = React.forwardRef<\n ElementRef<typeof StyledCallout>,\n CalloutProps\n>(\n (\n {\n dismissed,\n dismissible = true,\n onDismiss,\n dismissLabel,\n children,\n variant,\n ...props\n },\n forwardRef\n ) => {\n const [internalDismissed, setInternalDismissed] = useState<boolean>(\n dismissed ?? false\n )\n\n if (dismissed ?? internalDismissed) {\n return null\n }\n\n const handleDismissed = (): void => {\n setInternalDismissed(true)\n onDismiss?.()\n }\n\n return (\n <CalloutProvider variant={variant}>\n <StyledCallout\n {...props}\n ref={forwardRef}\n variant={variant}\n dismissible={dismissible}\n role='alert'\n >\n {children}\n {dismissible && onDismiss != null && dismissLabel?.length > 0 && (\n <DismissButton\n aria-label={dismissLabel}\n onPress={handleDismissed}\n />\n )}\n </StyledCallout>\n </CalloutProvider>\n )\n }\n) as ForwardRefExoticComponent<CalloutProps> & Partials\n\nexport interface Partials {\n Content: typeof Content\n Description: typeof Description\n IconSlot: typeof IconSlot\n Title: typeof Title\n Actions: typeof Actions\n}\n\nCallout.Content = Content\nCallout.Description = Description\nCallout.IconSlot = IconSlot\nCallout.Title = Title\nCallout.Actions = Actions\n"],"names":["styled","Primitive","createContext","jsx","useContext","IconCheckMark","IconExclamationPointCircle","IconInformationMarkCircle","React","Heading","IconButton","IconCross","useState","jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"main.js","sources":["../src/callout.styled.tsx","../src/partials/content.tsx","../src/partials/description.tsx","../src/hooks/use-callout-context.tsx","../src/partials/icon-slot.styled.ts","../src/partials/icon-slot.tsx","../src/partials/title.tsx","../src/partials/actions.tsx","../src/partials/dismiss-button.tsx","../src/callout.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledCallout = styled(Primitive.div, {\n position: 'relative',\n gap: '$150',\n padding: '$200',\n borderWidth: '$sm',\n borderStyle: 'solid',\n borderRadius: '$75',\n display: 'grid',\n justifyContent: 'center',\n gridTemplateColumns: 'auto 1fr',\n gridTemplateAreas: `'icon content'`,\n variants: {\n variant: {\n information: {\n backgroundColor: '$background-primary-subtle',\n borderColor: '$border-primary-subtle',\n },\n warning: {\n backgroundColor: '$background-warning-subtle',\n borderColor: '$border-warning-subtle',\n },\n danger: {\n backgroundColor: '$background-danger-subtle',\n borderColor: '$border-danger-subtle',\n },\n success: {\n backgroundColor: '$background-success-subtle',\n borderColor: '$border-success-subtle',\n },\n },\n dismissible: {\n true: {\n padding: '$200 $400 $200 $200',\n },\n false: {\n gridTemplateColumns: 'auto 1fr',\n gridTemplateAreas: `'icon content'`,\n },\n },\n },\n})\n\nexport type StyledCalloutProps = ComponentPropsWithRef<typeof StyledCallout>\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Content = styled(Primitive.div, {\n display: 'flex',\n flexDirection: 'column',\n gap: '$25',\n maxWidth: '48em',\n gridArea: 'content',\n})\n\nContent.displayName = 'Callout.Content'\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Description = styled(Primitive.div, {\n color: '$text-neutrals',\n fontSize: '$175',\n lineHeight: '$400',\n marginTop: '$25',\n})\n\nDescription.displayName = 'Callout.Description'\n","import { createContext, useContext } from 'react'\n\nimport type { StyledCalloutProps } from '../callout.styled'\n\ninterface CalloutProps {\n variant?: StyledCalloutProps['variant']\n}\n\ninterface CalloutContextProps extends CalloutProps {}\n\nexport interface CalloutProviderProps extends CalloutContextProps {\n children: React.ReactNode\n}\n\nconst CalloutContext = createContext<CalloutContextProps>({} as any)\n\nexport const CalloutProvider = ({\n children,\n ...restProps\n}: CalloutProviderProps): JSX.Element => (\n <CalloutContext.Provider\n value={{\n ...restProps,\n }}\n >\n {children}\n </CalloutContext.Provider>\n)\n\nexport const useCalloutContext = (): CalloutContextProps =>\n useContext(CalloutContext)\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledIconSlot = styled(Primitive.div, {\n variants: {\n variant: {\n information: {\n color: '$icon-primary',\n },\n warning: {\n color: '$icon-warning',\n },\n danger: {\n color: '$icon-danger',\n },\n success: {\n color: '$icon-success',\n },\n },\n },\n})\n","import React from 'react'\nimport type { ElementRef, ComponentPropsWithRef } from 'react'\nimport {\n IconCheckMark,\n IconExclamationPointCircle,\n IconInformationMarkCircle,\n} from '@mirohq/design-system-icons'\n\nimport { useCalloutContext } from '../hooks/use-callout-context'\nimport { StyledIconSlot } from './icon-slot.styled'\n\nexport type StyledIconSlotProps = ComponentPropsWithRef<typeof StyledIconSlot>\n\nexport interface IconSlotProps extends StyledIconSlotProps {\n /**\n * The icon.\n */\n children?: React.ReactNode\n}\n\nconst iconVariant = {\n success: <IconCheckMark />,\n warning: <IconExclamationPointCircle />,\n danger: <IconExclamationPointCircle />,\n information: <IconInformationMarkCircle />,\n default: <IconCheckMark />,\n}\n\nexport const IconSlot = React.forwardRef<\n ElementRef<typeof StyledIconSlot>,\n IconSlotProps\n>(({ children, ...restProps }, forwardRef) => {\n const { variant } = useCalloutContext()\n\n let formattedChildren = children\n if (React.Children.count(children) < 1) {\n formattedChildren =\n iconVariant[variant as keyof typeof iconVariant] ?? iconVariant.default\n }\n\n return (\n <StyledIconSlot {...restProps} ref={forwardRef} variant={variant}>\n {formattedChildren}\n </StyledIconSlot>\n )\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Heading } from '@mirohq/design-system-typography'\nimport type { HeadingProps } from '@mirohq/design-system-typography'\n\nconst StyledTitle = styled(Heading, { lineHeight: '$300' })\n\nexport interface TitleProps extends Omit<HeadingProps, 'level' | 'styledAs'> {\n level?: HeadingProps['level']\n}\n\nexport const Title = React.forwardRef<ElementRef<typeof Heading>, TitleProps>(\n ({ level = 4, ...props }, forwardRef) => (\n <StyledTitle {...props} ref={forwardRef} level={level} styledAs='h4' />\n )\n)\n\nTitle.displayName = 'Callout.Title'\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Actions = styled(Primitive.div, {\n gridColumn: 'content',\n gridRow: -1,\n display: 'flex',\n gap: '$100',\n})\n\nActions.displayName = 'Callout.Actions'\n","import { styled } from '@mirohq/design-system-stitches'\nimport { IconButton } from '@mirohq/design-system-icon-button'\nimport type { IconButtonProps } from '@mirohq/design-system-icon-button'\nimport { IconCross } from '@mirohq/design-system-icons'\n\nconst StyledDismissButton = styled(IconButton, {\n position: 'absolute',\n right: '$50',\n top: '$50',\n})\n\nexport const DismissButton = (props: IconButtonProps): React.ReactNode => (\n <StyledDismissButton\n variant='ghost'\n size='medium'\n data-testid='dismiss-button'\n {...props}\n >\n <IconCross />\n </StyledDismissButton>\n)\n\nDismissButton.displayName = 'Callout.DismissButton'\n","import React, { useState } from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\n\nimport { StyledCallout } from './callout.styled'\nimport type { StyledCalloutProps } from './callout.styled'\nimport { Content } from './partials/content'\nimport { Description } from './partials/description'\nimport { IconSlot } from './partials/icon-slot'\nimport { Title } from './partials/title'\nimport { Actions } from './partials/actions'\nimport { CalloutProvider } from './hooks/use-callout-context'\nimport { DismissButton } from './partials/dismiss-button'\n\ninterface DismissibleProps {\n /**\n * Whether or not the component is dismissed (hidden)\n */\n dismissed?: boolean\n\n /**\n * Callback invoked once dismiss button is clicked\n */\n onDismiss?: () => void\n\n /**\n * aria-label for the dismiss button\n */\n dismissLabel: string\n}\n\nexport type CalloutProps = (Omit<StyledCalloutProps, 'dismissible'> & {\n /**\n * Change the component style.\n */\n variant: StyledCalloutProps['variant']\n\n /**\n * Whether or not the component should display dismiss button\n * @default true\n */\n dismissible?: boolean\n}) &\n (\n | DismissibleProps // uncontrolled\n | Required<DismissibleProps> // controlled\n | ({ dismissible?: false } & { [K in keyof DismissibleProps]?: never })\n )\n\nexport const Callout = React.forwardRef<\n ElementRef<typeof StyledCallout>,\n CalloutProps\n>(\n (\n {\n dismissed,\n dismissible = true,\n onDismiss,\n dismissLabel,\n children,\n variant,\n ...props\n },\n forwardRef\n ) => {\n const [internalDismissed, setInternalDismissed] = useState<boolean>(\n dismissed ?? false\n )\n\n if (dismissed ?? internalDismissed) {\n return null\n }\n\n const handleDismissed = (): void => {\n setInternalDismissed(true)\n onDismiss?.()\n }\n\n return (\n <CalloutProvider variant={variant}>\n <StyledCallout\n {...props}\n ref={forwardRef}\n variant={variant}\n dismissible={dismissible}\n role='alert'\n >\n {children}\n {dismissible && onDismiss != null && dismissLabel?.length > 0 && (\n <DismissButton\n aria-label={dismissLabel}\n onPress={handleDismissed}\n />\n )}\n </StyledCallout>\n </CalloutProvider>\n )\n }\n) as ForwardRefExoticComponent<CalloutProps> & Partials\n\nexport interface Partials {\n Content: typeof Content\n Description: typeof Description\n IconSlot: typeof IconSlot\n Title: typeof Title\n Actions: typeof Actions\n}\n\nCallout.Content = Content\nCallout.Description = Description\nCallout.IconSlot = IconSlot\nCallout.Title = Title\nCallout.Actions = Actions\n"],"names":["styled","Primitive","createContext","jsx","useContext","IconCheckMark","IconExclamationPointCircle","IconInformationMarkCircle","Heading","IconButton","IconCross","useState","jsxs"],"mappings":"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"}
package/dist/module.js CHANGED
@@ -2,7 +2,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import React, { createContext, useContext, useState } from 'react';
3
3
  import { Primitive } from '@mirohq/design-system-primitive';
4
4
  import { styled } from '@mirohq/design-system-stitches';
5
- import { IconCheckMark, IconExclamationPointCircle, IconInformationMarkCircle, IconCross } from '@mirohq/design-system-icons';
5
+ import { IconCheckMark, IconInformationMarkCircle, IconExclamationPointCircle, IconCross } from '@mirohq/design-system-icons';
6
6
  import { Heading } from '@mirohq/design-system-typography';
7
7
  import { IconButton } from '@mirohq/design-system-icon-button';
8
8
 
package/dist/module.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"module.js","sources":["../src/callout.styled.tsx","../src/partials/content.tsx","../src/partials/description.tsx","../src/hooks/use-callout-context.tsx","../src/partials/icon-slot.styled.ts","../src/partials/icon-slot.tsx","../src/partials/title.tsx","../src/partials/actions.tsx","../src/partials/dismiss-button.tsx","../src/callout.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledCallout = styled(Primitive.div, {\n position: 'relative',\n gap: '$150',\n padding: '$200',\n borderWidth: '$sm',\n borderStyle: 'solid',\n borderRadius: '$75',\n display: 'grid',\n justifyContent: 'center',\n gridTemplateColumns: 'auto 1fr',\n gridTemplateAreas: `'icon content'`,\n variants: {\n variant: {\n information: {\n backgroundColor: '$background-primary-subtle',\n borderColor: '$border-primary-subtle',\n },\n warning: {\n backgroundColor: '$background-warning-subtle',\n borderColor: '$border-warning-subtle',\n },\n danger: {\n backgroundColor: '$background-danger-subtle',\n borderColor: '$border-danger-subtle',\n },\n success: {\n backgroundColor: '$background-success-subtle',\n borderColor: '$border-success-subtle',\n },\n },\n dismissible: {\n true: {\n padding: '$200 $400 $200 $200',\n },\n false: {\n gridTemplateColumns: 'auto 1fr',\n gridTemplateAreas: `'icon content'`,\n },\n },\n },\n})\n\nexport type StyledCalloutProps = ComponentPropsWithRef<typeof StyledCallout>\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Content = styled(Primitive.div, {\n display: 'flex',\n flexDirection: 'column',\n gap: '$25',\n maxWidth: '48em',\n gridArea: 'content',\n})\n\nContent.displayName = 'Callout.Content'\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Description = styled(Primitive.div, {\n color: '$text-neutrals',\n fontSize: '$175',\n lineHeight: '$400',\n marginTop: '$25',\n})\n\nDescription.displayName = 'Callout.Description'\n","import { createContext, useContext } from 'react'\n\nimport type { StyledCalloutProps } from '../callout.styled'\n\ninterface CalloutProps {\n variant?: StyledCalloutProps['variant']\n}\n\ninterface CalloutContextProps extends CalloutProps {}\n\nexport interface CalloutProviderProps extends CalloutContextProps {\n children: React.ReactNode\n}\n\nconst CalloutContext = createContext<CalloutContextProps>({} as any)\n\nexport const CalloutProvider = ({\n children,\n ...restProps\n}: CalloutProviderProps): JSX.Element => (\n <CalloutContext.Provider\n value={{\n ...restProps,\n }}\n >\n {children}\n </CalloutContext.Provider>\n)\n\nexport const useCalloutContext = (): CalloutContextProps =>\n useContext(CalloutContext)\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledIconSlot = styled(Primitive.div, {\n variants: {\n variant: {\n information: {\n color: '$icon-primary',\n },\n warning: {\n color: '$icon-warning',\n },\n danger: {\n color: '$icon-danger',\n },\n success: {\n color: '$icon-success',\n },\n },\n },\n})\n","import React from 'react'\nimport type { ElementRef, ComponentPropsWithRef } from 'react'\nimport {\n IconCheckMark,\n IconExclamationPointCircle,\n IconInformationMarkCircle,\n} from '@mirohq/design-system-icons'\n\nimport { useCalloutContext } from '../hooks/use-callout-context'\nimport { StyledIconSlot } from './icon-slot.styled'\n\nexport type StyledIconSlotProps = ComponentPropsWithRef<typeof StyledIconSlot>\n\nexport interface IconSlotProps extends StyledIconSlotProps {\n /**\n * The icon.\n */\n children?: React.ReactNode\n}\n\nconst iconVariant = {\n success: <IconCheckMark />,\n warning: <IconExclamationPointCircle />,\n danger: <IconExclamationPointCircle />,\n information: <IconInformationMarkCircle />,\n default: <IconCheckMark />,\n}\n\nexport const IconSlot = React.forwardRef<\n ElementRef<typeof StyledIconSlot>,\n IconSlotProps\n>(({ children, ...restProps }, forwardRef) => {\n const { variant } = useCalloutContext()\n\n let formattedChildren = children\n if (React.Children.count(children) < 1) {\n formattedChildren =\n iconVariant[variant as keyof typeof iconVariant] ?? iconVariant.default\n }\n\n return (\n <StyledIconSlot {...restProps} ref={forwardRef} variant={variant}>\n {formattedChildren}\n </StyledIconSlot>\n )\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Heading } from '@mirohq/design-system-typography'\nimport type { HeadingProps } from '@mirohq/design-system-typography'\n\nconst StyledTitle = styled(Heading, { lineHeight: '$300' })\n\nexport interface TitleProps extends Omit<HeadingProps, 'level' | 'styledAs'> {\n level?: HeadingProps['level']\n}\n\nexport const Title = React.forwardRef<ElementRef<typeof Heading>, TitleProps>(\n ({ level = 4, ...props }, forwardRef) => (\n <StyledTitle {...props} ref={forwardRef} level={level} styledAs='h4' />\n )\n)\n\nTitle.displayName = 'Callout.Title'\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Actions = styled(Primitive.div, {\n gridColumn: 'content',\n gridRow: -1,\n display: 'flex',\n gap: '$100',\n})\n\nActions.displayName = 'Callout.Actions'\n","import { styled } from '@mirohq/design-system-stitches'\nimport { IconButton } from '@mirohq/design-system-icon-button'\nimport type { IconButtonProps } from '@mirohq/design-system-icon-button'\nimport { IconCross } from '@mirohq/design-system-icons'\n\nconst StyledDismissButton = styled(IconButton, {\n position: 'absolute',\n right: '$50',\n top: '$50',\n})\n\nexport const DismissButton = (props: IconButtonProps): React.ReactNode => (\n <StyledDismissButton\n variant='ghost'\n size='medium'\n data-testid='dismiss-button'\n {...props}\n >\n <IconCross />\n </StyledDismissButton>\n)\n\nDismissButton.displayName = 'Callout.DismissButton'\n","import React, { useState } from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\n\nimport { StyledCallout } from './callout.styled'\nimport type { StyledCalloutProps } from './callout.styled'\nimport { Content } from './partials/content'\nimport { Description } from './partials/description'\nimport { IconSlot } from './partials/icon-slot'\nimport { Title } from './partials/title'\nimport { Actions } from './partials/actions'\nimport { CalloutProvider } from './hooks/use-callout-context'\nimport { DismissButton } from './partials/dismiss-button'\n\ninterface DismissibleProps {\n /**\n * Whether or not the component is dismissed (hidden)\n */\n dismissed?: boolean\n\n /**\n * Callback invoked once dismiss button is clicked\n */\n onDismiss?: () => void\n\n /**\n * aria-label for the dismiss button\n */\n dismissLabel: string\n}\n\nexport type CalloutProps = (Omit<StyledCalloutProps, 'dismissible'> & {\n /**\n * Change the component style.\n */\n variant: StyledCalloutProps['variant']\n\n /**\n * Whether or not the component should display dismiss button\n * @default true\n */\n dismissible?: boolean\n}) &\n (\n | DismissibleProps // uncontrolled\n | Required<DismissibleProps> // controlled\n | ({ dismissible?: false } & { [K in keyof DismissibleProps]?: never })\n )\n\nexport const Callout = React.forwardRef<\n ElementRef<typeof StyledCallout>,\n CalloutProps\n>(\n (\n {\n dismissed,\n dismissible = true,\n onDismiss,\n dismissLabel,\n children,\n variant,\n ...props\n },\n forwardRef\n ) => {\n const [internalDismissed, setInternalDismissed] = useState<boolean>(\n dismissed ?? false\n )\n\n if (dismissed ?? internalDismissed) {\n return null\n }\n\n const handleDismissed = (): void => {\n setInternalDismissed(true)\n onDismiss?.()\n }\n\n return (\n <CalloutProvider variant={variant}>\n <StyledCallout\n {...props}\n ref={forwardRef}\n variant={variant}\n dismissible={dismissible}\n role='alert'\n >\n {children}\n {dismissible && onDismiss != null && dismissLabel?.length > 0 && (\n <DismissButton\n aria-label={dismissLabel}\n onPress={handleDismissed}\n />\n )}\n </StyledCallout>\n </CalloutProvider>\n )\n }\n) as ForwardRefExoticComponent<CalloutProps> & Partials\n\nexport interface Partials {\n Content: typeof Content\n Description: typeof Description\n IconSlot: typeof IconSlot\n Title: typeof Title\n Actions: typeof Actions\n}\n\nCallout.Content = Content\nCallout.Description = Description\nCallout.IconSlot = IconSlot\nCallout.Title = Title\nCallout.Actions = Actions\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"module.js","sources":["../src/callout.styled.tsx","../src/partials/content.tsx","../src/partials/description.tsx","../src/hooks/use-callout-context.tsx","../src/partials/icon-slot.styled.ts","../src/partials/icon-slot.tsx","../src/partials/title.tsx","../src/partials/actions.tsx","../src/partials/dismiss-button.tsx","../src/callout.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledCallout = styled(Primitive.div, {\n position: 'relative',\n gap: '$150',\n padding: '$200',\n borderWidth: '$sm',\n borderStyle: 'solid',\n borderRadius: '$75',\n display: 'grid',\n justifyContent: 'center',\n gridTemplateColumns: 'auto 1fr',\n gridTemplateAreas: `'icon content'`,\n variants: {\n variant: {\n information: {\n backgroundColor: '$background-primary-subtle',\n borderColor: '$border-primary-subtle',\n },\n warning: {\n backgroundColor: '$background-warning-subtle',\n borderColor: '$border-warning-subtle',\n },\n danger: {\n backgroundColor: '$background-danger-subtle',\n borderColor: '$border-danger-subtle',\n },\n success: {\n backgroundColor: '$background-success-subtle',\n borderColor: '$border-success-subtle',\n },\n },\n dismissible: {\n true: {\n padding: '$200 $400 $200 $200',\n },\n false: {\n gridTemplateColumns: 'auto 1fr',\n gridTemplateAreas: `'icon content'`,\n },\n },\n },\n})\n\nexport type StyledCalloutProps = ComponentPropsWithRef<typeof StyledCallout>\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Content = styled(Primitive.div, {\n display: 'flex',\n flexDirection: 'column',\n gap: '$25',\n maxWidth: '48em',\n gridArea: 'content',\n})\n\nContent.displayName = 'Callout.Content'\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Description = styled(Primitive.div, {\n color: '$text-neutrals',\n fontSize: '$175',\n lineHeight: '$400',\n marginTop: '$25',\n})\n\nDescription.displayName = 'Callout.Description'\n","import { createContext, useContext } from 'react'\n\nimport type { StyledCalloutProps } from '../callout.styled'\n\ninterface CalloutProps {\n variant?: StyledCalloutProps['variant']\n}\n\ninterface CalloutContextProps extends CalloutProps {}\n\nexport interface CalloutProviderProps extends CalloutContextProps {\n children: React.ReactNode\n}\n\nconst CalloutContext = createContext<CalloutContextProps>({} as any)\n\nexport const CalloutProvider = ({\n children,\n ...restProps\n}: CalloutProviderProps): JSX.Element => (\n <CalloutContext.Provider\n value={{\n ...restProps,\n }}\n >\n {children}\n </CalloutContext.Provider>\n)\n\nexport const useCalloutContext = (): CalloutContextProps =>\n useContext(CalloutContext)\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledIconSlot = styled(Primitive.div, {\n variants: {\n variant: {\n information: {\n color: '$icon-primary',\n },\n warning: {\n color: '$icon-warning',\n },\n danger: {\n color: '$icon-danger',\n },\n success: {\n color: '$icon-success',\n },\n },\n },\n})\n","import React from 'react'\nimport type { ElementRef, ComponentPropsWithRef } from 'react'\nimport {\n IconCheckMark,\n IconExclamationPointCircle,\n IconInformationMarkCircle,\n} from '@mirohq/design-system-icons'\n\nimport { useCalloutContext } from '../hooks/use-callout-context'\nimport { StyledIconSlot } from './icon-slot.styled'\n\nexport type StyledIconSlotProps = ComponentPropsWithRef<typeof StyledIconSlot>\n\nexport interface IconSlotProps extends StyledIconSlotProps {\n /**\n * The icon.\n */\n children?: React.ReactNode\n}\n\nconst iconVariant = {\n success: <IconCheckMark />,\n warning: <IconExclamationPointCircle />,\n danger: <IconExclamationPointCircle />,\n information: <IconInformationMarkCircle />,\n default: <IconCheckMark />,\n}\n\nexport const IconSlot = React.forwardRef<\n ElementRef<typeof StyledIconSlot>,\n IconSlotProps\n>(({ children, ...restProps }, forwardRef) => {\n const { variant } = useCalloutContext()\n\n let formattedChildren = children\n if (React.Children.count(children) < 1) {\n formattedChildren =\n iconVariant[variant as keyof typeof iconVariant] ?? iconVariant.default\n }\n\n return (\n <StyledIconSlot {...restProps} ref={forwardRef} variant={variant}>\n {formattedChildren}\n </StyledIconSlot>\n )\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\nimport { styled } from '@mirohq/design-system-stitches'\nimport { Heading } from '@mirohq/design-system-typography'\nimport type { HeadingProps } from '@mirohq/design-system-typography'\n\nconst StyledTitle = styled(Heading, { lineHeight: '$300' })\n\nexport interface TitleProps extends Omit<HeadingProps, 'level' | 'styledAs'> {\n level?: HeadingProps['level']\n}\n\nexport const Title = React.forwardRef<ElementRef<typeof Heading>, TitleProps>(\n ({ level = 4, ...props }, forwardRef) => (\n <StyledTitle {...props} ref={forwardRef} level={level} styledAs='h4' />\n )\n)\n\nTitle.displayName = 'Callout.Title'\n","import { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const Actions = styled(Primitive.div, {\n gridColumn: 'content',\n gridRow: -1,\n display: 'flex',\n gap: '$100',\n})\n\nActions.displayName = 'Callout.Actions'\n","import { styled } from '@mirohq/design-system-stitches'\nimport { IconButton } from '@mirohq/design-system-icon-button'\nimport type { IconButtonProps } from '@mirohq/design-system-icon-button'\nimport { IconCross } from '@mirohq/design-system-icons'\n\nconst StyledDismissButton = styled(IconButton, {\n position: 'absolute',\n right: '$50',\n top: '$50',\n})\n\nexport const DismissButton = (props: IconButtonProps): React.ReactNode => (\n <StyledDismissButton\n variant='ghost'\n size='medium'\n data-testid='dismiss-button'\n {...props}\n >\n <IconCross />\n </StyledDismissButton>\n)\n\nDismissButton.displayName = 'Callout.DismissButton'\n","import React, { useState } from 'react'\nimport type { ElementRef, ForwardRefExoticComponent } from 'react'\n\nimport { StyledCallout } from './callout.styled'\nimport type { StyledCalloutProps } from './callout.styled'\nimport { Content } from './partials/content'\nimport { Description } from './partials/description'\nimport { IconSlot } from './partials/icon-slot'\nimport { Title } from './partials/title'\nimport { Actions } from './partials/actions'\nimport { CalloutProvider } from './hooks/use-callout-context'\nimport { DismissButton } from './partials/dismiss-button'\n\ninterface DismissibleProps {\n /**\n * Whether or not the component is dismissed (hidden)\n */\n dismissed?: boolean\n\n /**\n * Callback invoked once dismiss button is clicked\n */\n onDismiss?: () => void\n\n /**\n * aria-label for the dismiss button\n */\n dismissLabel: string\n}\n\nexport type CalloutProps = (Omit<StyledCalloutProps, 'dismissible'> & {\n /**\n * Change the component style.\n */\n variant: StyledCalloutProps['variant']\n\n /**\n * Whether or not the component should display dismiss button\n * @default true\n */\n dismissible?: boolean\n}) &\n (\n | DismissibleProps // uncontrolled\n | Required<DismissibleProps> // controlled\n | ({ dismissible?: false } & { [K in keyof DismissibleProps]?: never })\n )\n\nexport const Callout = React.forwardRef<\n ElementRef<typeof StyledCallout>,\n CalloutProps\n>(\n (\n {\n dismissed,\n dismissible = true,\n onDismiss,\n dismissLabel,\n children,\n variant,\n ...props\n },\n forwardRef\n ) => {\n const [internalDismissed, setInternalDismissed] = useState<boolean>(\n dismissed ?? false\n )\n\n if (dismissed ?? internalDismissed) {\n return null\n }\n\n const handleDismissed = (): void => {\n setInternalDismissed(true)\n onDismiss?.()\n }\n\n return (\n <CalloutProvider variant={variant}>\n <StyledCallout\n {...props}\n ref={forwardRef}\n variant={variant}\n dismissible={dismissible}\n role='alert'\n >\n {children}\n {dismissible && onDismiss != null && dismissLabel?.length > 0 && (\n <DismissButton\n aria-label={dismissLabel}\n onPress={handleDismissed}\n />\n )}\n </StyledCallout>\n </CalloutProvider>\n )\n }\n) as ForwardRefExoticComponent<CalloutProps> & Partials\n\nexport interface Partials {\n Content: typeof Content\n Description: typeof Description\n IconSlot: typeof IconSlot\n Title: typeof Title\n Actions: typeof Actions\n}\n\nCallout.Content = Content\nCallout.Description = Description\nCallout.IconSlot = IconSlot\nCallout.Title = Title\nCallout.Actions = Actions\n"],"names":[],"mappings":"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"}
package/dist/types.d.ts CHANGED
@@ -1,11 +1,30 @@
1
1
  import * as react from 'react';
2
2
  import react__default, { ComponentPropsWithRef, ForwardRefExoticComponent } from 'react';
3
- import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
4
3
  import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
5
4
  import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
6
5
  import { HeadingProps } from '@mirohq/design-system-typography';
7
6
 
8
- declare const StyledCallout: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, "variant" | "dismissible"> & _stitches_react_types_styled_component.TransformProps<{
7
+ /* Utilities */
8
+ /* ========================================================================== */
9
+
10
+ /** Returns a string with the given prefix followed by the given values. */
11
+ type Prefixed<K extends string, T> = `${K}${Extract<T, boolean | number | string>}`
12
+
13
+ type TransformProps<Props, Media> = {
14
+ [K in keyof Props]: (
15
+ | Props[K]
16
+ | (
17
+ & {
18
+ [KMedia in Prefixed<'@', 'initial' | keyof Media>]?: Props[K]
19
+ }
20
+ & {
21
+ [KMedia in string]: Props[K]
22
+ }
23
+ )
24
+ )
25
+ }
26
+
27
+ declare const StyledCallout: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, "variant" | "dismissible"> & TransformProps<{
9
28
  variant?: "information" | "warning" | "danger" | "success" | undefined;
10
29
  dismissible?: boolean | "true" | "false" | undefined;
11
30
  }, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {
@@ -14,11 +33,11 @@ declare const StyledCallout: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_d
14
33
  }, {}>;
15
34
  type StyledCalloutProps = ComponentPropsWithRef<typeof StyledCallout>;
16
35
 
17
- declare const Content: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
36
+ declare const Content: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
18
37
 
19
- declare const Description: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
38
+ declare const Description: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
20
39
 
21
- declare const StyledIconSlot: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, "variant"> & _stitches_react_types_styled_component.TransformProps<{
40
+ declare const StyledIconSlot: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, "variant"> & TransformProps<{
22
41
  variant?: "information" | "warning" | "danger" | "success" | undefined;
23
42
  }, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {
24
43
  variant?: "information" | "warning" | "danger" | "success" | undefined;
@@ -38,7 +57,7 @@ interface TitleProps extends Omit<HeadingProps, 'level' | 'styledAs'> {
38
57
  }
39
58
  declare const Title: react__default.ForwardRefExoticComponent<Omit<TitleProps, "ref"> & react__default.RefAttributes<HTMLHeadingElement>>;
40
59
 
41
- declare const Actions: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
60
+ declare const Actions: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
42
61
 
43
62
  interface DismissibleProps {
44
63
  /**
@@ -78,4 +97,5 @@ interface Partials {
78
97
  Actions: typeof Actions;
79
98
  }
80
99
 
81
- export { Callout, CalloutProps };
100
+ export { Callout };
101
+ export type { CalloutProps };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mirohq/design-system-callout",
3
- "version": "1.2.15",
3
+ "version": "1.3.0-fix-stitches-types.1",
4
4
  "description": "",
5
5
  "author": "Miro",
6
6
  "source": "src/index.ts",
@@ -26,11 +26,11 @@
26
26
  "react": "^16.14 || ^17 || ^18 || ^19"
27
27
  },
28
28
  "dependencies": {
29
- "@mirohq/design-system-icon-button": "^4.1.4",
30
- "@mirohq/design-system-icons": "^1.27.1",
31
- "@mirohq/design-system-primitive": "^2.1.0",
32
- "@mirohq/design-system-stitches": "^3.1.2",
33
- "@mirohq/design-system-typography": "^1.2.1"
29
+ "@mirohq/design-system-icon-button": "^4.2.0-fix-stitches-types.1",
30
+ "@mirohq/design-system-icons": "^1.28.0-fix-stitches-types.1",
31
+ "@mirohq/design-system-primitive": "^2.2.0-fix-stitches-types.1",
32
+ "@mirohq/design-system-stitches": "^3.2.0-fix-stitches-types.1",
33
+ "@mirohq/design-system-typography": "^1.3.0-fix-stitches-types.1"
34
34
  },
35
35
  "scripts": {
36
36
  "build": "rollup -c ../../../rollup.config.js",