@mirohq/design-system-typography 0.2.12 → 0.3.0-margins.0

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 +64 -19
  2. package/dist/main.js.map +1 -1
  3. package/dist/module.js +64 -19
  4. package/dist/module.js.map +1 -1
  5. package/dist/types.d.ts +479 -16
  6. package/package.json +2 -2
package/dist/main.js CHANGED
@@ -11,11 +11,10 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
 
13
13
  const styles = {
14
- all: "unset",
15
14
  display: "block",
16
15
  fontFamily: "Formular, sans-serif",
17
- margin: 0,
18
16
  color: "$text-neutrals",
17
+ fontStyle: "normal",
19
18
  fontWeight: 500,
20
19
  variants: {
21
20
  level: {
@@ -63,26 +62,51 @@ const Heading = React__default["default"].forwardRef(
63
62
  }
64
63
  );
65
64
 
65
+ const textStyles = {
66
+ default: {
67
+ lineHeight: 1.5
68
+ },
69
+ size: {
70
+ normal: {
71
+ fontSize: "$200"
72
+ },
73
+ small: {
74
+ fontSize: "$175"
75
+ },
76
+ mini: {
77
+ fontSize: "$150"
78
+ }
79
+ },
80
+ weight: {
81
+ normal: {
82
+ fontWeight: 400
83
+ },
84
+ bold: {
85
+ fontWeight: 650
86
+ }
87
+ }
88
+ };
89
+
66
90
  const StyledText = designSystemStitches.styled(designSystemPrimitive.Primitive.span, {
67
- lineHeight: 1.5,
91
+ ...textStyles.default,
68
92
  variants: {
69
93
  size: {
70
94
  normal: {
71
- fontSize: "$200"
95
+ ...textStyles.size.normal
72
96
  },
73
97
  small: {
74
- fontSize: "$175"
98
+ ...textStyles.size.small
75
99
  },
76
100
  mini: {
77
- fontSize: "$150"
101
+ ...textStyles.size.mini
78
102
  }
79
103
  },
80
104
  weight: {
81
105
  normal: {
82
- fontWeight: 400
106
+ ...textStyles.weight.normal
83
107
  },
84
108
  bold: {
85
- fontWeight: 650
109
+ ...textStyles.weight.bold
86
110
  }
87
111
  }
88
112
  }
@@ -97,20 +121,41 @@ const Text = React__default["default"].forwardRef(
97
121
  })
98
122
  );
99
123
 
100
- const StyledParagraph = designSystemStitches.styled(StyledText, {
101
- margin: 0,
102
- "&:not(:last-child)": {
103
- marginBottom: "$200"
124
+ const StyledParagraph = designSystemStitches.styled(designSystemPrimitive.Primitive.p, {
125
+ ...textStyles.default,
126
+ variants: {
127
+ size: {
128
+ normal: {
129
+ ...textStyles.size.normal
130
+ },
131
+ small: {
132
+ ...textStyles.size.small
133
+ },
134
+ mini: {
135
+ ...textStyles.size.mini
136
+ }
137
+ },
138
+ weight: {
139
+ normal: {
140
+ ...textStyles.weight.normal
141
+ },
142
+ bold: {
143
+ ...textStyles.weight.bold
144
+ }
145
+ }
104
146
  }
105
147
  });
106
148
 
107
- const Paragraph = React__default["default"].forwardRef(({ size, weight, children, ...restProps }, forwardRef) => /* @__PURE__ */ React__default["default"].createElement(StyledParagraph, {
108
- ref: forwardRef,
109
- size,
110
- weight,
111
- asChild: true,
112
- ...restProps
113
- }, /* @__PURE__ */ React__default["default"].createElement("p", null, children)));
149
+ const Paragraph = React__default["default"].forwardRef(
150
+ ({ size, weight, children, ...restProps }, forwardRef) => /* @__PURE__ */ React__default["default"].createElement(StyledParagraph, {
151
+ size,
152
+ weight,
153
+ asChild: true,
154
+ ...restProps
155
+ }, /* @__PURE__ */ React__default["default"].createElement("p", {
156
+ ref: forwardRef
157
+ }, children))
158
+ );
114
159
 
115
160
  exports.Heading = Heading;
116
161
  exports.Paragraph = Paragraph;
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"main.js","sources":["../src/heading.styled.tsx","../src/heading.tsx","../src/text.styled.ts","../src/text.tsx","../src/paragraph.styled.ts","../src/paragraph.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport type { ComponentPropsWithRef } from 'react'\n\nconst styles = {\n all: 'unset',\n display: 'block',\n fontFamily: 'Formular, sans-serif',\n margin: 0,\n color: '$text-neutrals',\n fontWeight: 500,\n variants: {\n level: {\n 1: {\n lineHeight: 1.2,\n fontSize: '$400',\n },\n 2: {\n lineHeight: 1.35,\n fontSize: '$300',\n },\n 3: {\n lineHeight: 1.4,\n fontSize: '$250',\n },\n 4: {\n lineHeight: 1.5,\n fontSize: '$200',\n },\n },\n },\n}\n\nexport const H1 = styled(Primitive.h1, styles)\nexport const H2 = styled(Primitive.h2, styles)\nexport const H3 = styled(Primitive.h3, styles)\nexport const H4 = styled(Primitive.h4, styles)\n\nexport type StyledHeadingProps = ComponentPropsWithRef<typeof H1>\n","import type { ElementRef } from 'react'\nimport React from 'react'\n\nimport * as Styled from './heading.styled'\nimport type { StyledHeadingProps } from './heading.styled'\n\ntype Level = 1 | 2 | 3 | 4\ntype Tags = 'h1' | 'h2' | 'h3' | 'h4'\n\nexport interface HeadingProps extends StyledHeadingProps {\n /**\n * The sematic heading level used in the HTML markup.\n */\n level: Level\n\n /**\n * The way the sematic tag looks, it changes the styling of the heading.\n */\n styledAs?: Tags\n}\n\nexport const Heading = React.forwardRef<ElementRef<Tags>, HeadingProps>(\n ({ level, styledAs, children, ...props }, forwardRef) => {\n const HeadingLevel = Styled[`H${level}`]\n const styledAsLevel =\n styledAs !== undefined ? (+styledAs.replace('h', '') as Level) : styledAs\n return (\n <HeadingLevel {...props} level={styledAsLevel ?? level} ref={forwardRef}>\n {children}\n </HeadingLevel>\n )\n }\n)\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledText = styled(Primitive.span, {\n lineHeight: 1.5,\n variants: {\n size: {\n normal: {\n fontSize: '$200',\n },\n small: {\n fontSize: '$175',\n },\n mini: {\n fontSize: '$150',\n },\n },\n weight: {\n normal: {\n fontWeight: 400,\n },\n bold: {\n fontWeight: 650,\n },\n },\n },\n})\n\nexport type StyledTextProps = ComponentPropsWithRef<typeof StyledText>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledText } from './text.styled'\nimport type { StyledTextProps } from './text.styled'\n\nexport interface TextProps extends StyledTextProps {\n /**\n * The content.\n */\n children: React.ReactNode\n\n /**\n * Change the text font-size.\n */\n size?: StyledTextProps['size']\n\n /**\n * Change the text font-weight.\n */\n weight?: StyledTextProps['weight']\n}\n\nexport const Text = React.forwardRef<ElementRef<typeof StyledText>, TextProps>(\n ({ size, weight, ...restProps }, forwardRef) => (\n <StyledText ref={forwardRef} size={size} weight={weight} {...restProps} />\n )\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { StyledText } from './text.styled'\n\nexport const StyledParagraph = styled(StyledText, {\n margin: 0,\n\n '&:not(:last-child)': {\n marginBottom: '$200',\n },\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledParagraph } from './paragraph.styled'\nimport type { TextProps } from './text'\n\nexport interface ParagraphProps extends TextProps {\n /**\n * The content.\n */\n children: React.ReactNode\n\n /**\n * Change the paragraph font-size.\n */\n size?: TextProps['size']\n\n /**\n * Change the paragraph font-weight.\n */\n weight?: TextProps['weight']\n}\n\nexport const Paragraph = React.forwardRef<\n ElementRef<typeof StyledParagraph>,\n ParagraphProps\n>(({ size, weight, children, ...restProps }, forwardRef) => (\n <StyledParagraph\n ref={forwardRef}\n size={size}\n weight={weight}\n asChild\n {...restProps}\n >\n <p>{children}</p>\n </StyledParagraph>\n))\n"],"names":["styled","Primitive","React"],"mappings":"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"}
1
+ {"version":3,"file":"main.js","sources":["../src/heading.styled.tsx","../src/heading.tsx","../src/styles.ts","../src/text.styled.ts","../src/text.tsx","../src/paragraph.styled.ts","../src/paragraph.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport type { ComponentPropsWithRef } from 'react'\n\nconst styles = {\n display: 'block',\n fontFamily: 'Formular, sans-serif',\n color: '$text-neutrals',\n fontStyle: 'normal',\n fontWeight: 500,\n variants: {\n level: {\n 1: {\n lineHeight: 1.2,\n fontSize: '$400',\n },\n 2: {\n lineHeight: 1.35,\n fontSize: '$300',\n },\n 3: {\n lineHeight: 1.4,\n fontSize: '$250',\n },\n 4: {\n lineHeight: 1.5,\n fontSize: '$200',\n },\n },\n },\n}\n\nexport const H1 = styled(Primitive.h1, styles)\nexport const H2 = styled(Primitive.h2, styles)\nexport const H3 = styled(Primitive.h3, styles)\nexport const H4 = styled(Primitive.h4, styles)\n\nexport type StyledHeadingProps = ComponentPropsWithRef<typeof H1>\n","import type { ElementRef } from 'react'\nimport React from 'react'\n\nimport * as Styled from './heading.styled'\nimport type { StyledHeadingProps } from './heading.styled'\n\ntype Level = 1 | 2 | 3 | 4\ntype Tags = 'h1' | 'h2' | 'h3' | 'h4'\n\nexport interface HeadingProps extends StyledHeadingProps {\n /**\n * The sematic heading level used in the HTML markup.\n */\n level: Level\n\n /**\n * The way the sematic tag looks, it changes the styling of the heading.\n */\n styledAs?: Tags\n}\n\nexport const Heading = React.forwardRef<ElementRef<Tags>, HeadingProps>(\n ({ level, styledAs, children, ...props }, forwardRef) => {\n const HeadingLevel = Styled[`H${level}`]\n const styledAsLevel =\n styledAs !== undefined ? (+styledAs.replace('h', '') as Level) : styledAs\n return (\n <HeadingLevel {...props} level={styledAsLevel ?? level} ref={forwardRef}>\n {children}\n </HeadingLevel>\n )\n }\n)\n","export const textStyles = {\n default: {\n lineHeight: 1.5,\n },\n size: {\n normal: {\n fontSize: '$200',\n },\n small: {\n fontSize: '$175',\n },\n mini: {\n fontSize: '$150',\n },\n },\n weight: {\n normal: {\n fontWeight: 400,\n },\n bold: {\n fontWeight: 650,\n },\n },\n}\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nimport { textStyles } from './styles'\n\nexport const StyledText = styled(Primitive.span, {\n ...textStyles.default,\n\n variants: {\n size: {\n normal: {\n ...textStyles.size.normal,\n },\n small: {\n ...textStyles.size.small,\n },\n mini: {\n ...textStyles.size.mini,\n },\n },\n weight: {\n normal: {\n ...textStyles.weight.normal,\n },\n bold: {\n ...textStyles.weight.bold,\n },\n },\n },\n})\n\nexport type StyledTextProps = ComponentPropsWithRef<typeof StyledText>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledText } from './text.styled'\nimport type { StyledTextProps } from './text.styled'\n\nexport interface TextProps extends StyledTextProps {\n /**\n * The content.\n */\n children: React.ReactNode\n\n /**\n * Change the text font-size.\n */\n size?: StyledTextProps['size']\n\n /**\n * Change the text font-weight.\n */\n weight?: StyledTextProps['weight']\n}\n\nexport const Text = React.forwardRef<ElementRef<typeof StyledText>, TextProps>(\n ({ size, weight, ...restProps }, forwardRef) => (\n <StyledText ref={forwardRef} size={size} weight={weight} {...restProps} />\n )\n)\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nimport { textStyles } from './styles'\n\nexport const StyledParagraph = styled(Primitive.p, {\n ...textStyles.default,\n\n variants: {\n size: {\n normal: {\n ...textStyles.size.normal,\n },\n small: {\n ...textStyles.size.small,\n },\n mini: {\n ...textStyles.size.mini,\n },\n },\n weight: {\n normal: {\n ...textStyles.weight.normal,\n },\n bold: {\n ...textStyles.weight.bold,\n },\n },\n },\n})\n\nexport type StyledParagraphProps = ComponentPropsWithRef<typeof StyledParagraph>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledParagraphProps } from './paragraph.styled'\nimport { StyledParagraph } from './paragraph.styled'\n\nexport interface ParagraphProps extends StyledParagraphProps {\n /**\n * The content.\n */\n children: React.ReactNode\n\n /**\n * Change the paragraph font-size.\n */\n size?: StyledParagraphProps['size']\n\n /**\n * Change the paragraph font-weight.\n */\n weight?: StyledParagraphProps['weight']\n}\n\nexport const Paragraph = React.forwardRef<ElementRef<'p'>, ParagraphProps>(\n ({ size, weight, children, ...restProps }, forwardRef) => (\n <StyledParagraph size={size} weight={weight} asChild {...restProps}>\n <p ref={forwardRef}>{children}</p>\n </StyledParagraph>\n )\n)\n"],"names":["styled","Primitive","React"],"mappings":";;;;;;;;;;;;AAIA,MAAM,MAAS,GAAA;AAAA,EACb,OAAS,EAAA,OAAA;AAAA,EACT,UAAY,EAAA,sBAAA;AAAA,EACZ,KAAO,EAAA,gBAAA;AAAA,EACP,SAAW,EAAA,QAAA;AAAA,EACX,UAAY,EAAA,GAAA;AAAA,EACZ,QAAU,EAAA;AAAA,IACR,KAAO,EAAA;AAAA,MACL,CAAG,EAAA;AAAA,QACD,UAAY,EAAA,GAAA;AAAA,QACZ,QAAU,EAAA,MAAA;AAAA,OACZ;AAAA,MACA,CAAG,EAAA;AAAA,QACD,UAAY,EAAA,IAAA;AAAA,QACZ,QAAU,EAAA,MAAA;AAAA,OACZ;AAAA,MACA,CAAG,EAAA;AAAA,QACD,UAAY,EAAA,GAAA;AAAA,QACZ,QAAU,EAAA,MAAA;AAAA,OACZ;AAAA,MACA,CAAG,EAAA;AAAA,QACD,UAAY,EAAA,GAAA;AAAA,QACZ,QAAU,EAAA,MAAA;AAAA,OACZ;AAAA,KACF;AAAA,GACF;AACF,CAAA,CAAA;AAEO,MAAM,EAAK,GAAAA,2BAAA,CAAOC,+BAAU,CAAA,EAAA,EAAI,MAAM,CAAA,CAAA;AACtC,MAAM,EAAK,GAAAD,2BAAA,CAAOC,+BAAU,CAAA,EAAA,EAAI,MAAM,CAAA,CAAA;AACtC,MAAM,EAAK,GAAAD,2BAAA,CAAOC,+BAAU,CAAA,EAAA,EAAI,MAAM,CAAA,CAAA;AACtC,MAAM,EAAK,GAAAD,2BAAA,CAAOC,+BAAU,CAAA,EAAA,EAAI,MAAM,CAAA;;;;;;;;;;ACdtC,MAAM,UAAUC,yBAAM,CAAA,UAAA;AAAA,EAC3B,CAAC,EAAE,KAAA,EAAO,UAAU,QAAa,EAAA,GAAA,KAAA,IAAS,UAAe,KAAA;AACvD,IAAM,MAAA,YAAA,GAAe,OAAO,CAAI,CAAA,EAAA,KAAA,CAAA,CAAA,CAAA,CAAA;AAChC,IAAM,MAAA,aAAA,GACJ,aAAa,KAAa,CAAA,GAAA,CAAC,SAAS,OAAQ,CAAA,GAAA,EAAK,EAAE,CAAc,GAAA,QAAA,CAAA;AACnE,IAAA,uBACGA,yBAAA,CAAA,aAAA,CAAA,YAAA,EAAA;AAAA,MAAc,GAAG,KAAA;AAAA,MAAO,OAAO,aAAiB,IAAA,IAAA,GAAA,aAAA,GAAA,KAAA;AAAA,MAAO,GAAK,EAAA,UAAA;AAAA,KAAA,EAC1D,QACH,CAAA,CAAA;AAAA,GAEJ;AACF;;AChCO,MAAM,UAAa,GAAA;AAAA,EACxB,OAAS,EAAA;AAAA,IACP,UAAY,EAAA,GAAA;AAAA,GACd;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,MAAQ,EAAA;AAAA,MACN,QAAU,EAAA,MAAA;AAAA,KACZ;AAAA,IACA,KAAO,EAAA;AAAA,MACL,QAAU,EAAA,MAAA;AAAA,KACZ;AAAA,IACA,IAAM,EAAA;AAAA,MACJ,QAAU,EAAA,MAAA;AAAA,KACZ;AAAA,GACF;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,MAAQ,EAAA;AAAA,MACN,UAAY,EAAA,GAAA;AAAA,KACd;AAAA,IACA,IAAM,EAAA;AAAA,MACJ,UAAY,EAAA,GAAA;AAAA,KACd;AAAA,GACF;AACF,CAAA;;ACjBa,MAAA,UAAA,GAAaF,2BAAO,CAAAC,+BAAA,CAAU,IAAM,EAAA;AAAA,EAC/C,GAAG,UAAW,CAAA,OAAA;AAAA,EAEd,QAAU,EAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,MAAQ,EAAA;AAAA,QACN,GAAG,WAAW,IAAK,CAAA,MAAA;AAAA,OACrB;AAAA,MACA,KAAO,EAAA;AAAA,QACL,GAAG,WAAW,IAAK,CAAA,KAAA;AAAA,OACrB;AAAA,MACA,IAAM,EAAA;AAAA,QACJ,GAAG,WAAW,IAAK,CAAA,IAAA;AAAA,OACrB;AAAA,KACF;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,MAAQ,EAAA;AAAA,QACN,GAAG,WAAW,MAAO,CAAA,MAAA;AAAA,OACvB;AAAA,MACA,IAAM,EAAA;AAAA,QACJ,GAAG,WAAW,MAAO,CAAA,IAAA;AAAA,OACvB;AAAA,KACF;AAAA,GACF;AACF,CAAC,CAAA;;ACPM,MAAM,OAAOC,yBAAM,CAAA,UAAA;AAAA,EACxB,CAAC,EAAE,IAAA,EAAM,WAAW,SAAU,EAAA,EAAG,+BAC9BA,yBAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IAAW,GAAK,EAAA,UAAA;AAAA,IAAY,IAAA;AAAA,IAAY,MAAA;AAAA,IAAiB,GAAG,SAAA;AAAA,GAAW,CAAA;AAE5E;;ACrBa,MAAA,eAAA,GAAkBF,2BAAO,CAAAC,+BAAA,CAAU,CAAG,EAAA;AAAA,EACjD,GAAG,UAAW,CAAA,OAAA;AAAA,EAEd,QAAU,EAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,MAAQ,EAAA;AAAA,QACN,GAAG,WAAW,IAAK,CAAA,MAAA;AAAA,OACrB;AAAA,MACA,KAAO,EAAA;AAAA,QACL,GAAG,WAAW,IAAK,CAAA,KAAA;AAAA,OACrB;AAAA,MACA,IAAM,EAAA;AAAA,QACJ,GAAG,WAAW,IAAK,CAAA,IAAA;AAAA,OACrB;AAAA,KACF;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,MAAQ,EAAA;AAAA,QACN,GAAG,WAAW,MAAO,CAAA,MAAA;AAAA,OACvB;AAAA,MACA,IAAM,EAAA;AAAA,QACJ,GAAG,WAAW,MAAO,CAAA,IAAA;AAAA,OACvB;AAAA,KACF;AAAA,GACF;AACF,CAAC,CAAA;;ACPM,MAAM,YAAYC,yBAAM,CAAA,UAAA;AAAA,EAC7B,CAAC,EAAE,IAAM,EAAA,MAAA,EAAQ,aAAa,SAAU,EAAA,EAAG,+BACxCA,yBAAA,CAAA,aAAA,CAAA,eAAA,EAAA;AAAA,IAAgB,IAAA;AAAA,IAAY,MAAA;AAAA,IAAgB,OAAO,EAAA,IAAA;AAAA,IAAE,GAAG,SAAA;AAAA,GAAA,kBACtDA,yBAAA,CAAA,aAAA,CAAA,GAAA,EAAA;AAAA,IAAE,GAAK,EAAA,UAAA;AAAA,GAAA,EAAa,QAAS,CAChC,CAAA;AAEJ;;;;;;"}
package/dist/module.js CHANGED
@@ -3,11 +3,10 @@ import { styled } from '@mirohq/design-system-stitches';
3
3
  import { Primitive } from '@mirohq/design-system-primitive';
4
4
 
5
5
  const styles = {
6
- all: "unset",
7
6
  display: "block",
8
7
  fontFamily: "Formular, sans-serif",
9
- margin: 0,
10
8
  color: "$text-neutrals",
9
+ fontStyle: "normal",
11
10
  fontWeight: 500,
12
11
  variants: {
13
12
  level: {
@@ -55,26 +54,51 @@ const Heading = React.forwardRef(
55
54
  }
56
55
  );
57
56
 
57
+ const textStyles = {
58
+ default: {
59
+ lineHeight: 1.5
60
+ },
61
+ size: {
62
+ normal: {
63
+ fontSize: "$200"
64
+ },
65
+ small: {
66
+ fontSize: "$175"
67
+ },
68
+ mini: {
69
+ fontSize: "$150"
70
+ }
71
+ },
72
+ weight: {
73
+ normal: {
74
+ fontWeight: 400
75
+ },
76
+ bold: {
77
+ fontWeight: 650
78
+ }
79
+ }
80
+ };
81
+
58
82
  const StyledText = styled(Primitive.span, {
59
- lineHeight: 1.5,
83
+ ...textStyles.default,
60
84
  variants: {
61
85
  size: {
62
86
  normal: {
63
- fontSize: "$200"
87
+ ...textStyles.size.normal
64
88
  },
65
89
  small: {
66
- fontSize: "$175"
90
+ ...textStyles.size.small
67
91
  },
68
92
  mini: {
69
- fontSize: "$150"
93
+ ...textStyles.size.mini
70
94
  }
71
95
  },
72
96
  weight: {
73
97
  normal: {
74
- fontWeight: 400
98
+ ...textStyles.weight.normal
75
99
  },
76
100
  bold: {
77
- fontWeight: 650
101
+ ...textStyles.weight.bold
78
102
  }
79
103
  }
80
104
  }
@@ -89,20 +113,41 @@ const Text = React.forwardRef(
89
113
  })
90
114
  );
91
115
 
92
- const StyledParagraph = styled(StyledText, {
93
- margin: 0,
94
- "&:not(:last-child)": {
95
- marginBottom: "$200"
116
+ const StyledParagraph = styled(Primitive.p, {
117
+ ...textStyles.default,
118
+ variants: {
119
+ size: {
120
+ normal: {
121
+ ...textStyles.size.normal
122
+ },
123
+ small: {
124
+ ...textStyles.size.small
125
+ },
126
+ mini: {
127
+ ...textStyles.size.mini
128
+ }
129
+ },
130
+ weight: {
131
+ normal: {
132
+ ...textStyles.weight.normal
133
+ },
134
+ bold: {
135
+ ...textStyles.weight.bold
136
+ }
137
+ }
96
138
  }
97
139
  });
98
140
 
99
- const Paragraph = React.forwardRef(({ size, weight, children, ...restProps }, forwardRef) => /* @__PURE__ */ React.createElement(StyledParagraph, {
100
- ref: forwardRef,
101
- size,
102
- weight,
103
- asChild: true,
104
- ...restProps
105
- }, /* @__PURE__ */ React.createElement("p", null, children)));
141
+ const Paragraph = React.forwardRef(
142
+ ({ size, weight, children, ...restProps }, forwardRef) => /* @__PURE__ */ React.createElement(StyledParagraph, {
143
+ size,
144
+ weight,
145
+ asChild: true,
146
+ ...restProps
147
+ }, /* @__PURE__ */ React.createElement("p", {
148
+ ref: forwardRef
149
+ }, children))
150
+ );
106
151
 
107
152
  export { Heading, Paragraph, Text };
108
153
  //# sourceMappingURL=module.js.map
package/dist/module.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"module.js","sources":["../src/heading.styled.tsx","../src/heading.tsx","../src/text.styled.ts","../src/text.tsx","../src/paragraph.styled.ts","../src/paragraph.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport type { ComponentPropsWithRef } from 'react'\n\nconst styles = {\n all: 'unset',\n display: 'block',\n fontFamily: 'Formular, sans-serif',\n margin: 0,\n color: '$text-neutrals',\n fontWeight: 500,\n variants: {\n level: {\n 1: {\n lineHeight: 1.2,\n fontSize: '$400',\n },\n 2: {\n lineHeight: 1.35,\n fontSize: '$300',\n },\n 3: {\n lineHeight: 1.4,\n fontSize: '$250',\n },\n 4: {\n lineHeight: 1.5,\n fontSize: '$200',\n },\n },\n },\n}\n\nexport const H1 = styled(Primitive.h1, styles)\nexport const H2 = styled(Primitive.h2, styles)\nexport const H3 = styled(Primitive.h3, styles)\nexport const H4 = styled(Primitive.h4, styles)\n\nexport type StyledHeadingProps = ComponentPropsWithRef<typeof H1>\n","import type { ElementRef } from 'react'\nimport React from 'react'\n\nimport * as Styled from './heading.styled'\nimport type { StyledHeadingProps } from './heading.styled'\n\ntype Level = 1 | 2 | 3 | 4\ntype Tags = 'h1' | 'h2' | 'h3' | 'h4'\n\nexport interface HeadingProps extends StyledHeadingProps {\n /**\n * The sematic heading level used in the HTML markup.\n */\n level: Level\n\n /**\n * The way the sematic tag looks, it changes the styling of the heading.\n */\n styledAs?: Tags\n}\n\nexport const Heading = React.forwardRef<ElementRef<Tags>, HeadingProps>(\n ({ level, styledAs, children, ...props }, forwardRef) => {\n const HeadingLevel = Styled[`H${level}`]\n const styledAsLevel =\n styledAs !== undefined ? (+styledAs.replace('h', '') as Level) : styledAs\n return (\n <HeadingLevel {...props} level={styledAsLevel ?? level} ref={forwardRef}>\n {children}\n </HeadingLevel>\n )\n }\n)\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledText = styled(Primitive.span, {\n lineHeight: 1.5,\n variants: {\n size: {\n normal: {\n fontSize: '$200',\n },\n small: {\n fontSize: '$175',\n },\n mini: {\n fontSize: '$150',\n },\n },\n weight: {\n normal: {\n fontWeight: 400,\n },\n bold: {\n fontWeight: 650,\n },\n },\n },\n})\n\nexport type StyledTextProps = ComponentPropsWithRef<typeof StyledText>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledText } from './text.styled'\nimport type { StyledTextProps } from './text.styled'\n\nexport interface TextProps extends StyledTextProps {\n /**\n * The content.\n */\n children: React.ReactNode\n\n /**\n * Change the text font-size.\n */\n size?: StyledTextProps['size']\n\n /**\n * Change the text font-weight.\n */\n weight?: StyledTextProps['weight']\n}\n\nexport const Text = React.forwardRef<ElementRef<typeof StyledText>, TextProps>(\n ({ size, weight, ...restProps }, forwardRef) => (\n <StyledText ref={forwardRef} size={size} weight={weight} {...restProps} />\n )\n)\n","import { styled } from '@mirohq/design-system-stitches'\n\nimport { StyledText } from './text.styled'\n\nexport const StyledParagraph = styled(StyledText, {\n margin: 0,\n\n '&:not(:last-child)': {\n marginBottom: '$200',\n },\n})\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledParagraph } from './paragraph.styled'\nimport type { TextProps } from './text'\n\nexport interface ParagraphProps extends TextProps {\n /**\n * The content.\n */\n children: React.ReactNode\n\n /**\n * Change the paragraph font-size.\n */\n size?: TextProps['size']\n\n /**\n * Change the paragraph font-weight.\n */\n weight?: TextProps['weight']\n}\n\nexport const Paragraph = React.forwardRef<\n ElementRef<typeof StyledParagraph>,\n ParagraphProps\n>(({ size, weight, children, ...restProps }, forwardRef) => (\n <StyledParagraph\n ref={forwardRef}\n size={size}\n weight={weight}\n asChild\n {...restProps}\n >\n <p>{children}</p>\n </StyledParagraph>\n))\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"module.js","sources":["../src/heading.styled.tsx","../src/heading.tsx","../src/styles.ts","../src/text.styled.ts","../src/text.tsx","../src/paragraph.styled.ts","../src/paragraph.tsx"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport type { ComponentPropsWithRef } from 'react'\n\nconst styles = {\n display: 'block',\n fontFamily: 'Formular, sans-serif',\n color: '$text-neutrals',\n fontStyle: 'normal',\n fontWeight: 500,\n variants: {\n level: {\n 1: {\n lineHeight: 1.2,\n fontSize: '$400',\n },\n 2: {\n lineHeight: 1.35,\n fontSize: '$300',\n },\n 3: {\n lineHeight: 1.4,\n fontSize: '$250',\n },\n 4: {\n lineHeight: 1.5,\n fontSize: '$200',\n },\n },\n },\n}\n\nexport const H1 = styled(Primitive.h1, styles)\nexport const H2 = styled(Primitive.h2, styles)\nexport const H3 = styled(Primitive.h3, styles)\nexport const H4 = styled(Primitive.h4, styles)\n\nexport type StyledHeadingProps = ComponentPropsWithRef<typeof H1>\n","import type { ElementRef } from 'react'\nimport React from 'react'\n\nimport * as Styled from './heading.styled'\nimport type { StyledHeadingProps } from './heading.styled'\n\ntype Level = 1 | 2 | 3 | 4\ntype Tags = 'h1' | 'h2' | 'h3' | 'h4'\n\nexport interface HeadingProps extends StyledHeadingProps {\n /**\n * The sematic heading level used in the HTML markup.\n */\n level: Level\n\n /**\n * The way the sematic tag looks, it changes the styling of the heading.\n */\n styledAs?: Tags\n}\n\nexport const Heading = React.forwardRef<ElementRef<Tags>, HeadingProps>(\n ({ level, styledAs, children, ...props }, forwardRef) => {\n const HeadingLevel = Styled[`H${level}`]\n const styledAsLevel =\n styledAs !== undefined ? (+styledAs.replace('h', '') as Level) : styledAs\n return (\n <HeadingLevel {...props} level={styledAsLevel ?? level} ref={forwardRef}>\n {children}\n </HeadingLevel>\n )\n }\n)\n","export const textStyles = {\n default: {\n lineHeight: 1.5,\n },\n size: {\n normal: {\n fontSize: '$200',\n },\n small: {\n fontSize: '$175',\n },\n mini: {\n fontSize: '$150',\n },\n },\n weight: {\n normal: {\n fontWeight: 400,\n },\n bold: {\n fontWeight: 650,\n },\n },\n}\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nimport { textStyles } from './styles'\n\nexport const StyledText = styled(Primitive.span, {\n ...textStyles.default,\n\n variants: {\n size: {\n normal: {\n ...textStyles.size.normal,\n },\n small: {\n ...textStyles.size.small,\n },\n mini: {\n ...textStyles.size.mini,\n },\n },\n weight: {\n normal: {\n ...textStyles.weight.normal,\n },\n bold: {\n ...textStyles.weight.bold,\n },\n },\n },\n})\n\nexport type StyledTextProps = ComponentPropsWithRef<typeof StyledText>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport { StyledText } from './text.styled'\nimport type { StyledTextProps } from './text.styled'\n\nexport interface TextProps extends StyledTextProps {\n /**\n * The content.\n */\n children: React.ReactNode\n\n /**\n * Change the text font-size.\n */\n size?: StyledTextProps['size']\n\n /**\n * Change the text font-weight.\n */\n weight?: StyledTextProps['weight']\n}\n\nexport const Text = React.forwardRef<ElementRef<typeof StyledText>, TextProps>(\n ({ size, weight, ...restProps }, forwardRef) => (\n <StyledText ref={forwardRef} size={size} weight={weight} {...restProps} />\n )\n)\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nimport { textStyles } from './styles'\n\nexport const StyledParagraph = styled(Primitive.p, {\n ...textStyles.default,\n\n variants: {\n size: {\n normal: {\n ...textStyles.size.normal,\n },\n small: {\n ...textStyles.size.small,\n },\n mini: {\n ...textStyles.size.mini,\n },\n },\n weight: {\n normal: {\n ...textStyles.weight.normal,\n },\n bold: {\n ...textStyles.weight.bold,\n },\n },\n },\n})\n\nexport type StyledParagraphProps = ComponentPropsWithRef<typeof StyledParagraph>\n","import React from 'react'\nimport type { ElementRef } from 'react'\n\nimport type { StyledParagraphProps } from './paragraph.styled'\nimport { StyledParagraph } from './paragraph.styled'\n\nexport interface ParagraphProps extends StyledParagraphProps {\n /**\n * The content.\n */\n children: React.ReactNode\n\n /**\n * Change the paragraph font-size.\n */\n size?: StyledParagraphProps['size']\n\n /**\n * Change the paragraph font-weight.\n */\n weight?: StyledParagraphProps['weight']\n}\n\nexport const Paragraph = React.forwardRef<ElementRef<'p'>, ParagraphProps>(\n ({ size, weight, children, ...restProps }, forwardRef) => (\n <StyledParagraph size={size} weight={weight} asChild {...restProps}>\n <p ref={forwardRef}>{children}</p>\n </StyledParagraph>\n )\n)\n"],"names":[],"mappings":"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"}
package/dist/types.d.ts CHANGED
@@ -213,28 +213,28 @@ declare const H1: react.ForwardRefExoticComponent<Pick<Omit<{
213
213
  readonly 'icon-400': "32px";
214
214
  };
215
215
  space: {
216
- readonly none: 0;
216
+ readonly 0: 0;
217
217
  readonly 50: "4px";
218
218
  readonly 100: "8px";
219
219
  readonly 150: "12px";
220
220
  readonly 200: "16px";
221
221
  readonly 300: "24px";
222
222
  readonly 400: "32px";
223
- readonly 500: "64px";
223
+ readonly 500: "40px";
224
224
  readonly 600: "48px";
225
225
  readonly 800: "64px";
226
226
  readonly 1200: "96px";
227
227
  readonly 1600: "128px";
228
228
  };
229
229
  'space-gap': {
230
- readonly none: any;
230
+ readonly 0: any;
231
231
  readonly 50: any;
232
232
  readonly 100: any;
233
233
  readonly 200: any;
234
234
  readonly 300: any;
235
235
  };
236
236
  'space-inset': {
237
- readonly none: any;
237
+ readonly 0: any;
238
238
  readonly 50: any;
239
239
  readonly 100: any;
240
240
  readonly 150: any;
@@ -247,7 +247,7 @@ declare const H1: react.ForwardRefExoticComponent<Pick<Omit<{
247
247
  readonly 1600: any;
248
248
  };
249
249
  'space-offset': {
250
- readonly none: any;
250
+ readonly 0: any;
251
251
  readonly 50: any;
252
252
  readonly 100: any;
253
253
  readonly 150: any;
@@ -258,7 +258,7 @@ declare const H1: react.ForwardRefExoticComponent<Pick<Omit<{
258
258
  readonly 800: any;
259
259
  readonly 1200: any;
260
260
  readonly 1600: any;
261
- readonly 'stacking-none': any;
261
+ readonly 'stacking-0': any;
262
262
  readonly 'stacking-100': any;
263
263
  readonly 'stacking-200': any;
264
264
  readonly 'stacking-300': any;
@@ -689,28 +689,28 @@ declare const StyledText: react.ForwardRefExoticComponent<Pick<Omit<{
689
689
  readonly 'icon-400': "32px";
690
690
  };
691
691
  space: {
692
- readonly none: 0;
692
+ readonly 0: 0;
693
693
  readonly 50: "4px";
694
694
  readonly 100: "8px";
695
695
  readonly 150: "12px";
696
696
  readonly 200: "16px";
697
697
  readonly 300: "24px";
698
698
  readonly 400: "32px";
699
- readonly 500: "64px";
699
+ readonly 500: "40px";
700
700
  readonly 600: "48px";
701
701
  readonly 800: "64px";
702
702
  readonly 1200: "96px";
703
703
  readonly 1600: "128px";
704
704
  };
705
705
  'space-gap': {
706
- readonly none: any;
706
+ readonly 0: any;
707
707
  readonly 50: any;
708
708
  readonly 100: any;
709
709
  readonly 200: any;
710
710
  readonly 300: any;
711
711
  };
712
712
  'space-inset': {
713
- readonly none: any;
713
+ readonly 0: any;
714
714
  readonly 50: any;
715
715
  readonly 100: any;
716
716
  readonly 150: any;
@@ -723,7 +723,7 @@ declare const StyledText: react.ForwardRefExoticComponent<Pick<Omit<{
723
723
  readonly 1600: any;
724
724
  };
725
725
  'space-offset': {
726
- readonly none: any;
726
+ readonly 0: any;
727
727
  readonly 50: any;
728
728
  readonly 100: any;
729
729
  readonly 150: any;
@@ -734,7 +734,7 @@ declare const StyledText: react.ForwardRefExoticComponent<Pick<Omit<{
734
734
  readonly 800: any;
735
735
  readonly 1200: any;
736
736
  readonly 1600: any;
737
- readonly 'stacking-none': any;
737
+ readonly 'stacking-0': any;
738
738
  readonly 'stacking-100': any;
739
739
  readonly 'stacking-200': any;
740
740
  readonly 'stacking-300': any;
@@ -958,7 +958,470 @@ interface TextProps extends StyledTextProps {
958
958
  }
959
959
  declare const Text: react__default.ForwardRefExoticComponent<Pick<TextProps, "color" | "translate" | "css" | "prefix" | "asChild" | "UNSAFE_style" | "children" | "slot" | "title" | "placeholder" | "size" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "weight"> & react__default.RefAttributes<HTMLSpanElement>>;
960
960
 
961
- interface ParagraphProps extends TextProps {
961
+ declare const StyledParagraph: react.ForwardRefExoticComponent<Pick<Omit<{
962
+ size?: "small" | "normal" | "mini" | undefined;
963
+ weight?: "bold" | "normal" | undefined;
964
+ }, "size" | "weight"> & _stitches_react_types_styled_component.TransformProps<{
965
+ size?: "small" | "normal" | "mini" | undefined;
966
+ weight?: "bold" | "normal" | undefined;
967
+ }, {}> & _mirohq_design_system_stitches.SafeProps<Omit<Pick<react.DetailedHTMLProps<react.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "key" | keyof react.HTMLAttributes<HTMLParagraphElement>> & {
968
+ ref?: ((instance: HTMLParagraphElement | null) => void) | react.RefObject<HTMLParagraphElement> | null | undefined;
969
+ } & {
970
+ asChild?: boolean | undefined;
971
+ }, "css"> & _stitches_react_types_styled_component.TransformProps<{}, {}> & {
972
+ css?: _stitches_react_types_css_util.CSS<{}, {
973
+ 'border-widths': {
974
+ readonly none: 0;
975
+ readonly sm: "1px";
976
+ readonly md: "2px";
977
+ readonly lg: "4px";
978
+ };
979
+ colors: {
980
+ readonly 'blue-100': any;
981
+ readonly 'blue-200': any;
982
+ readonly 'blue-300': any;
983
+ readonly 'blue-400': any;
984
+ readonly 'blue-500': any;
985
+ readonly 'blue-600': any;
986
+ readonly 'blue-700': any;
987
+ readonly 'blue-800': any;
988
+ readonly 'blue-900': any;
989
+ readonly 'blue-1000': any;
990
+ readonly 'gray-100': any;
991
+ readonly 'gray-200': any;
992
+ readonly 'gray-300': any;
993
+ readonly 'gray-400': any;
994
+ readonly 'gray-500': any;
995
+ readonly 'gray-600': any;
996
+ readonly 'gray-700': any;
997
+ readonly 'gray-800': any;
998
+ readonly 'gray-900': any;
999
+ readonly 'indigo-100': any;
1000
+ readonly 'indigo-200': any;
1001
+ readonly 'indigo-300': any;
1002
+ readonly 'indigo-400': any;
1003
+ readonly 'indigo-500': any;
1004
+ readonly 'indigo-600': any;
1005
+ readonly 'indigo-700': any;
1006
+ readonly 'indigo-800': any;
1007
+ readonly 'indigo-900': any;
1008
+ readonly 'red-100': any;
1009
+ readonly 'red-200': any;
1010
+ readonly 'red-300': any;
1011
+ readonly 'red-400': any;
1012
+ readonly 'red-500': any;
1013
+ readonly 'red-600': any;
1014
+ readonly 'red-700': any;
1015
+ readonly 'red-800': any;
1016
+ readonly 'red-900': any;
1017
+ readonly 'yellow-100': any;
1018
+ readonly 'yellow-200': any;
1019
+ readonly 'yellow-300': any;
1020
+ readonly 'yellow-400': any;
1021
+ readonly 'yellow-500': any;
1022
+ readonly 'yellow-600': any;
1023
+ readonly 'yellow-700': any;
1024
+ readonly 'yellow-800': any;
1025
+ readonly 'yellow-900': any;
1026
+ readonly 'green-100': any;
1027
+ readonly 'green-200': any;
1028
+ readonly 'green-300': any;
1029
+ readonly 'green-400': any;
1030
+ readonly 'green-500': any;
1031
+ readonly 'green-600': any;
1032
+ readonly 'green-700': any;
1033
+ readonly 'green-800': any;
1034
+ readonly 'green-900': any;
1035
+ readonly black: any;
1036
+ readonly white: any;
1037
+ readonly transparent: any;
1038
+ readonly 'background-danger'?: any;
1039
+ readonly 'background-danger-hover'?: any;
1040
+ readonly 'background-danger-prominent'?: any;
1041
+ readonly 'background-danger-prominent-active'?: any;
1042
+ readonly 'background-danger-prominent-hover'?: any;
1043
+ readonly 'background-neutrals'?: any;
1044
+ readonly 'background-neutrals-container'?: any;
1045
+ readonly 'background-neutrals-controls-disabled'?: any;
1046
+ readonly 'background-neutrals-disabled'?: any;
1047
+ readonly 'background-neutrals-inactive'?: any;
1048
+ readonly 'background-neutrals-inactive-hover'?: any;
1049
+ readonly 'background-neutrals-inverted'?: any;
1050
+ readonly 'background-neutrals-inverted-subtle'?: any;
1051
+ readonly 'background-neutrals-page'?: any;
1052
+ readonly 'background-neutrals-page-subtle'?: any;
1053
+ readonly 'background-neutrals-scrolls'?: any;
1054
+ readonly 'background-neutrals-scrolls-hover'?: any;
1055
+ readonly 'background-neutrals-subtle'?: any;
1056
+ readonly 'background-neutrals-subtle-active'?: any;
1057
+ readonly 'background-neutrals-subtle-hover'?: any;
1058
+ readonly 'background-primary-prominent'?: any;
1059
+ readonly 'background-primary-prominent-active'?: any;
1060
+ readonly 'background-primary-prominent-hover'?: any;
1061
+ readonly 'background-primary-prominent-selected'?: any;
1062
+ readonly 'background-primary-subtle'?: any;
1063
+ readonly 'background-primary-subtle-active'?: any;
1064
+ readonly 'background-primary-subtle-hover'?: any;
1065
+ readonly 'background-primary-subtle-selected'?: any;
1066
+ readonly 'background-success'?: any;
1067
+ readonly 'background-warning-prominent'?: any;
1068
+ readonly 'background-warning-subtle'?: any;
1069
+ readonly 'text-danger'?: any;
1070
+ readonly 'text-danger-active'?: any;
1071
+ readonly 'text-danger-hover'?: any;
1072
+ readonly 'text-danger-inverted'?: any;
1073
+ readonly 'text-neutrals'?: any;
1074
+ readonly 'text-neutrals-disabled'?: any;
1075
+ readonly 'text-neutrals-inverted'?: any;
1076
+ readonly 'text-neutrals-placeholder'?: any;
1077
+ readonly 'text-neutrals-placeholder-only'?: any;
1078
+ readonly 'text-neutrals-subtle'?: any;
1079
+ readonly 'text-neutrals-subtle-active'?: any;
1080
+ readonly 'text-neutrals-subtle-hover'?: any;
1081
+ readonly 'text-primary'?: any;
1082
+ readonly 'text-primary-active'?: any;
1083
+ readonly 'text-primary-hover'?: any;
1084
+ readonly 'text-primary-inverted'?: any;
1085
+ readonly 'text-primary-inverted-subtle'?: any;
1086
+ readonly 'text-primary-selected'?: any;
1087
+ readonly 'text-success'?: any;
1088
+ readonly 'text-warning'?: any;
1089
+ readonly 'icon-danger'?: any;
1090
+ readonly 'icon-danger-active'?: any;
1091
+ readonly 'icon-danger-hover'?: any;
1092
+ readonly 'icon-danger-inverted'?: any;
1093
+ readonly 'icon-neutrals'?: any;
1094
+ readonly 'icon-neutrals-disabled'?: any;
1095
+ readonly 'icon-neutrals-inactive'?: any;
1096
+ readonly 'icon-neutrals-inactive-hover'?: any;
1097
+ readonly 'icon-neutrals-inverted'?: any;
1098
+ readonly 'icon-neutrals-search'?: any;
1099
+ readonly 'icon-neutrals-subtle'?: any;
1100
+ readonly 'icon-neutrals-text'?: any;
1101
+ readonly 'icon-primary'?: any;
1102
+ readonly 'icon-primary-active'?: any;
1103
+ readonly 'icon-primary-hover'?: any;
1104
+ readonly 'icon-primary-inverted'?: any;
1105
+ readonly 'icon-primary-selected'?: any;
1106
+ readonly 'icon-success'?: any;
1107
+ readonly 'icon-success-inverted'?: any;
1108
+ readonly 'icon-warning'?: any;
1109
+ readonly 'icon-warning-prominent'?: any;
1110
+ readonly 'border-danger'?: any;
1111
+ readonly 'border-danger-active'?: any;
1112
+ readonly 'border-danger-hover'?: any;
1113
+ readonly 'border-focus-inner'?: any;
1114
+ readonly 'border-focus-middle'?: any;
1115
+ readonly 'border-focus-outer'?: any;
1116
+ readonly 'border-neutrals'?: any;
1117
+ readonly 'border-neutrals-active'?: any;
1118
+ readonly 'border-neutrals-controls'?: any;
1119
+ readonly 'border-neutrals-controls-disabled'?: any;
1120
+ readonly 'border-neutrals-disabled'?: any;
1121
+ readonly 'border-neutrals-hover'?: any;
1122
+ readonly 'border-neutrals-inverted'?: any;
1123
+ readonly 'border-neutrals-subtle'?: any;
1124
+ readonly 'border-neutrals-text-subtle'?: any;
1125
+ readonly 'border-neutrals-text-subtle-active'?: any;
1126
+ readonly 'border-neutrals-text-subtle-hover'?: any;
1127
+ readonly 'border-primary'?: any;
1128
+ readonly 'border-primary-active'?: any;
1129
+ readonly 'border-primary-hover'?: any;
1130
+ readonly 'border-primary-inverted'?: any;
1131
+ readonly 'border-success'?: any;
1132
+ readonly 'border-warning'?: any;
1133
+ };
1134
+ 'font-sizes': {
1135
+ readonly 150: "0.75rem";
1136
+ readonly 175: "0.875rem";
1137
+ readonly 200: "1rem";
1138
+ readonly 225: "1.125rem";
1139
+ readonly 250: "1.25rem";
1140
+ readonly 300: "1.5rem";
1141
+ readonly 400: "2rem";
1142
+ readonly 500: "2.5rem";
1143
+ readonly 600: "3rem";
1144
+ readonly 800: "4rem";
1145
+ readonly 900: "4.5rem";
1146
+ };
1147
+ radii: {
1148
+ readonly none: 0;
1149
+ readonly half: "999em";
1150
+ readonly 25: "2px";
1151
+ readonly 50: "4px";
1152
+ readonly 75: "6px";
1153
+ readonly 100: "8px";
1154
+ readonly 200: "16px";
1155
+ };
1156
+ shadows: {
1157
+ readonly 50: "0 4px 16px #05003812";
1158
+ readonly 100: "0 8px 32px #05003808";
1159
+ readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
1160
+ readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
1161
+ readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
1162
+ readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
1163
+ };
1164
+ sizes: {
1165
+ readonly number: string;
1166
+ readonly 'icon-200': "16px";
1167
+ readonly 'icon-300': "24px";
1168
+ readonly 'icon-400': "32px";
1169
+ };
1170
+ space: {
1171
+ readonly 0: 0;
1172
+ readonly 50: "4px";
1173
+ readonly 100: "8px";
1174
+ readonly 150: "12px";
1175
+ readonly 200: "16px";
1176
+ readonly 300: "24px";
1177
+ readonly 400: "32px";
1178
+ readonly 500: "40px";
1179
+ readonly 600: "48px";
1180
+ readonly 800: "64px";
1181
+ readonly 1200: "96px";
1182
+ readonly 1600: "128px";
1183
+ };
1184
+ 'space-gap': {
1185
+ readonly 0: any;
1186
+ readonly 50: any;
1187
+ readonly 100: any;
1188
+ readonly 200: any;
1189
+ readonly 300: any;
1190
+ };
1191
+ 'space-inset': {
1192
+ readonly 0: any;
1193
+ readonly 50: any;
1194
+ readonly 100: any;
1195
+ readonly 150: any;
1196
+ readonly 200: any;
1197
+ readonly 300: any;
1198
+ readonly 400: any;
1199
+ readonly 600: any;
1200
+ readonly 800: any;
1201
+ readonly 1200: any;
1202
+ readonly 1600: any;
1203
+ };
1204
+ 'space-offset': {
1205
+ readonly 0: any;
1206
+ readonly 50: any;
1207
+ readonly 100: any;
1208
+ readonly 150: any;
1209
+ readonly 200: any;
1210
+ readonly 300: any;
1211
+ readonly 400: any;
1212
+ readonly 600: any;
1213
+ readonly 800: any;
1214
+ readonly 1200: any;
1215
+ readonly 1600: any;
1216
+ readonly 'stacking-0': any;
1217
+ readonly 'stacking-100': any;
1218
+ readonly 'stacking-200': any;
1219
+ readonly 'stacking-300': any;
1220
+ readonly 'stacking-400': any;
1221
+ readonly 'stacking-500': any;
1222
+ readonly 'stacking-800': any;
1223
+ };
1224
+ 'stroke-width': {
1225
+ readonly thin: "1.5px";
1226
+ readonly normal: "2px";
1227
+ readonly bold: "4px";
1228
+ };
1229
+ 'z-indices': {
1230
+ readonly dropdownMenu: 100;
1231
+ readonly popover: 200;
1232
+ readonly tooltip: 300;
1233
+ };
1234
+ }, {
1235
+ readonly background: "colors";
1236
+ readonly backgroundColor: "colors";
1237
+ readonly backgroundImage: "colors";
1238
+ readonly blockSize: "sizes";
1239
+ readonly border: "colors";
1240
+ readonly borderBlock: "colors";
1241
+ readonly borderBlockEnd: "colors";
1242
+ readonly borderBlockStart: "colors";
1243
+ readonly borderBottom: "colors";
1244
+ readonly borderBottomColor: "colors";
1245
+ readonly borderBottomLeftRadius: "radii";
1246
+ readonly borderBottomRightRadius: "radii";
1247
+ readonly borderBottomStyle: "border-styles";
1248
+ readonly borderBottomWidth: "border-widths";
1249
+ readonly borderColor: "colors";
1250
+ readonly borderImage: "colors";
1251
+ readonly borderInline: "colors";
1252
+ readonly borderInlineEnd: "colors";
1253
+ readonly borderInlineStart: "colors";
1254
+ readonly borderLeft: "colors";
1255
+ readonly borderLeftColor: "colors";
1256
+ readonly borderLeftStyle: "border-styles";
1257
+ readonly borderLeftWidth: "border-widths";
1258
+ readonly borderRadius: "radii";
1259
+ readonly borderRight: "colors";
1260
+ readonly borderRightColor: "colors";
1261
+ readonly borderRightStyle: "border-styles";
1262
+ readonly borderRightWidth: "border-widths";
1263
+ readonly borderStyle: "border-styles";
1264
+ readonly borderTop: "colors";
1265
+ readonly borderTopColor: "colors";
1266
+ readonly borderTopLeftRadius: "radii";
1267
+ readonly borderTopRightRadius: "radii";
1268
+ readonly borderTopStyle: "border-styles";
1269
+ readonly borderTopWidth: "border-widths";
1270
+ readonly borderWidth: "border-widths";
1271
+ readonly bottom: "space";
1272
+ readonly boxShadow: "shadows";
1273
+ readonly caretColor: "colors";
1274
+ readonly color: "colors";
1275
+ readonly columnGap: "space-gap";
1276
+ readonly columnRuleColor: "colors";
1277
+ readonly fill: "colors";
1278
+ readonly flexBasis: "sizes";
1279
+ readonly fontFamily: "fonts";
1280
+ readonly fontSize: "font-sizes";
1281
+ readonly fontWeight: "font-weights";
1282
+ readonly gap: "space-gap";
1283
+ readonly gridColumnGap: "space-gap";
1284
+ readonly gridGap: "space-gap";
1285
+ readonly gridRowGap: "space-gap";
1286
+ readonly gridTemplateColumns: "sizes";
1287
+ readonly gridTemplateRows: "sizes";
1288
+ readonly height: "sizes";
1289
+ readonly inlineSize: "sizes";
1290
+ readonly inset: "space-inset";
1291
+ readonly insetBlock: "space-inset";
1292
+ readonly insetBlockEnd: "space-inset";
1293
+ readonly insetBlockStart: "space-inset";
1294
+ readonly insetInline: "space-inset";
1295
+ readonly insetInlineEnd: "space-inset";
1296
+ readonly insetInlineStart: "space-inset";
1297
+ readonly left: "space";
1298
+ readonly letterSpacing: "letter-spacings";
1299
+ readonly lineHeight: "line-heights";
1300
+ readonly margin: "space-offset";
1301
+ readonly marginBlock: "space-offset";
1302
+ readonly marginBlockEnd: "space-offset";
1303
+ readonly marginBlockStart: "space-offset";
1304
+ readonly marginBottom: "space-offset";
1305
+ readonly marginInline: "space-offset";
1306
+ readonly marginInlineEnd: "space-offset";
1307
+ readonly marginInlineStart: "space-offset";
1308
+ readonly marginLeft: "space-offset";
1309
+ readonly marginRight: "space-offset";
1310
+ readonly marginTop: "space-offset";
1311
+ readonly maxBlockSize: "sizes";
1312
+ readonly maxHeight: "sizes";
1313
+ readonly maxInlineSize: "sizes";
1314
+ readonly maxWidth: "sizes";
1315
+ readonly minBlockSize: "sizes";
1316
+ readonly minHeight: "sizes";
1317
+ readonly minInlineSize: "sizes";
1318
+ readonly minWidth: "sizes";
1319
+ readonly outline: "colors";
1320
+ readonly outlineColor: "colors";
1321
+ readonly padding: "space-inset";
1322
+ readonly paddingBlock: "space-inset";
1323
+ readonly paddingBlockEnd: "space-inset";
1324
+ readonly paddingBlockStart: "space-inset";
1325
+ readonly paddingBottom: "space-inset";
1326
+ readonly paddingInline: "space-inset";
1327
+ readonly paddingInlineEnd: "space-inset";
1328
+ readonly paddingInlineStart: "space-inset";
1329
+ readonly paddingLeft: "space-inset";
1330
+ readonly paddingRight: "space-inset";
1331
+ readonly paddingTop: "space-inset";
1332
+ readonly right: "space";
1333
+ readonly rowGap: "space-gap";
1334
+ readonly scrollMargin: "space-offset";
1335
+ readonly scrollMarginBlock: "space-offset";
1336
+ readonly scrollMarginBlockEnd: "space-offset";
1337
+ readonly scrollMarginBlockStart: "space-offset";
1338
+ readonly scrollMarginBottom: "space-offset";
1339
+ readonly scrollMarginInline: "space-offset";
1340
+ readonly scrollMarginInlineEnd: "space-offset";
1341
+ readonly scrollMarginInlineStart: "space-offset";
1342
+ readonly scrollMarginLeft: "space-offset";
1343
+ readonly scrollMarginRight: "space-offset";
1344
+ readonly scrollMarginTop: "space-offset";
1345
+ readonly scrollPadding: "space-inset";
1346
+ readonly scrollPaddingBlock: "space-inset";
1347
+ readonly scrollPaddingBlockEnd: "space-inset";
1348
+ readonly scrollPaddingBlockStart: "space-inset";
1349
+ readonly scrollPaddingBottom: "space-inset";
1350
+ readonly scrollPaddingInline: "space-inset";
1351
+ readonly scrollPaddingInlineEnd: "space-inset";
1352
+ readonly scrollPaddingInlineStart: "space-inset";
1353
+ readonly scrollPaddingLeft: "space-inset";
1354
+ readonly scrollPaddingRight: "space-inset";
1355
+ readonly scrollPaddingTop: "space-inset";
1356
+ readonly stroke: "colors";
1357
+ readonly strokeWidth: "stroke-width";
1358
+ readonly textDecorationColor: "colors";
1359
+ readonly textShadow: "shadows";
1360
+ readonly top: "space";
1361
+ readonly transition: "transitions";
1362
+ readonly width: "sizes";
1363
+ readonly zIndex: "z-indices";
1364
+ }, {
1365
+ paddingX: (value: {
1366
+ readonly [$$PropertyValue]: "padding";
1367
+ }) => {
1368
+ paddingLeft: {
1369
+ readonly [$$PropertyValue]: "padding";
1370
+ };
1371
+ paddingRight: {
1372
+ readonly [$$PropertyValue]: "padding";
1373
+ };
1374
+ };
1375
+ paddingY: (value: {
1376
+ readonly [$$PropertyValue]: "padding";
1377
+ }) => {
1378
+ paddingTop: {
1379
+ readonly [$$PropertyValue]: "padding";
1380
+ };
1381
+ paddingBottom: {
1382
+ readonly [$$PropertyValue]: "padding";
1383
+ };
1384
+ };
1385
+ marginX: (value: {
1386
+ readonly [$$PropertyValue]: "margin";
1387
+ }) => {
1388
+ marginLeft: {
1389
+ readonly [$$PropertyValue]: "margin";
1390
+ };
1391
+ marginRight: {
1392
+ readonly [$$PropertyValue]: "margin";
1393
+ };
1394
+ };
1395
+ marginY: (value: {
1396
+ readonly [$$PropertyValue]: "margin";
1397
+ }) => {
1398
+ marginTop: {
1399
+ readonly [$$PropertyValue]: "margin";
1400
+ };
1401
+ marginBottom: {
1402
+ readonly [$$PropertyValue]: "margin";
1403
+ };
1404
+ };
1405
+ square: (value: {
1406
+ readonly [$$PropertyValue]: "width";
1407
+ }) => {
1408
+ width: {
1409
+ readonly [$$PropertyValue]: "width";
1410
+ };
1411
+ height: {
1412
+ readonly [$$PropertyValue]: "width";
1413
+ };
1414
+ };
1415
+ }> | undefined;
1416
+ }> & {
1417
+ children?: react.ReactNode;
1418
+ } & _mirohq_design_system_stitches.CustomStylesProps, "color" | "translate" | "prefix" | "asChild" | "children" | "slot" | "title" | "placeholder" | "size" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "weight" | keyof _mirohq_design_system_stitches.CustomStylesProps> & react.RefAttributes<HTMLParagraphElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"p">>, {
1419
+ size?: "small" | "normal" | "mini" | undefined;
1420
+ weight?: "bold" | "normal" | undefined;
1421
+ }, {}>;
1422
+ declare type StyledParagraphProps = ComponentPropsWithRef<typeof StyledParagraph>;
1423
+
1424
+ interface ParagraphProps extends StyledParagraphProps {
962
1425
  /**
963
1426
  * The content.
964
1427
  */
@@ -966,12 +1429,12 @@ interface ParagraphProps extends TextProps {
966
1429
  /**
967
1430
  * Change the paragraph font-size.
968
1431
  */
969
- size?: TextProps['size'];
1432
+ size?: StyledParagraphProps['size'];
970
1433
  /**
971
1434
  * Change the paragraph font-weight.
972
1435
  */
973
- weight?: TextProps['weight'];
1436
+ weight?: StyledParagraphProps['weight'];
974
1437
  }
975
- declare const Paragraph: react__default.ForwardRefExoticComponent<Pick<ParagraphProps, "color" | "translate" | "css" | "prefix" | "asChild" | "UNSAFE_style" | "children" | "slot" | "title" | "placeholder" | "size" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "weight"> & react__default.RefAttributes<HTMLSpanElement>>;
1438
+ declare const Paragraph: react__default.ForwardRefExoticComponent<Pick<ParagraphProps, "color" | "translate" | "css" | "prefix" | "asChild" | "UNSAFE_style" | "children" | "slot" | "title" | "placeholder" | "size" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "weight"> & react__default.RefAttributes<HTMLParagraphElement>>;
976
1439
 
977
1440
  export { Heading, HeadingProps, Paragraph, ParagraphProps, Text, TextProps };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mirohq/design-system-typography",
3
- "version": "0.2.12",
3
+ "version": "0.3.0-margins.0",
4
4
  "description": "",
5
5
  "author": "Miro",
6
6
  "source": "src/index.ts",
@@ -27,7 +27,7 @@
27
27
  },
28
28
  "dependencies": {
29
29
  "@mirohq/design-system-primitive": "^1.1.0",
30
- "@mirohq/design-system-stitches": "^2.3.2"
30
+ "@mirohq/design-system-stitches": "^2.3.3"
31
31
  },
32
32
  "scripts": {
33
33
  "build": "rollup -c ../../../rollup.config.js",