@spark-web/text 1.1.1 → 1.1.2

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.
package/CHANGELOG.md ADDED
@@ -0,0 +1,213 @@
1
+ # @spark-web/text
2
+
3
+ ## 1.1.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#246](https://github.com/brighte-labs/spark-web/pull/246)
8
+ [`de99b9c`](https://github.com/brighte-labs/spark-web/commit/de99b9c7f72373bd1902cf67f5cfec9a1e1db01c)
9
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Remove
10
+ destructuring from theme object
11
+
12
+ - [#218](https://github.com/brighte-labs/spark-web/pull/218)
13
+ [`6fc8d1b`](https://github.com/brighte-labs/spark-web/commit/6fc8d1bc37e25d0cd622bc37f68a1d92eb5961b5)
14
+ Thanks [@nderkim](https://github.com/nderkim)! - Rename files to kebab case
15
+
16
+ - [#222](https://github.com/brighte-labs/spark-web/pull/222)
17
+ [`7f93c45`](https://github.com/brighte-labs/spark-web/commit/7f93c45bbae8c765e10df9d0dd7615473797749b)
18
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Update
19
+ dependencies
20
+
21
+ - [#242](https://github.com/brighte-labs/spark-web/pull/242)
22
+ [`6df05f7`](https://github.com/brighte-labs/spark-web/commit/6df05f764e4181c140d6547d6b897d0210468f6a)
23
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - - Add homepage
24
+ and repository keys to package.json
25
+ - Add CHANGELOG and README to files key in package.json
26
+ - Updated dependencies
27
+ [[`adc5e9e`](https://github.com/brighte-labs/spark-web/commit/adc5e9e6c99acd117f3261edcefdb5573132441b),
28
+ [`de99b9c`](https://github.com/brighte-labs/spark-web/commit/de99b9c7f72373bd1902cf67f5cfec9a1e1db01c),
29
+ [`6fc8d1b`](https://github.com/brighte-labs/spark-web/commit/6fc8d1bc37e25d0cd622bc37f68a1d92eb5961b5),
30
+ [`7f93c45`](https://github.com/brighte-labs/spark-web/commit/7f93c45bbae8c765e10df9d0dd7615473797749b),
31
+ [`62f7de8`](https://github.com/brighte-labs/spark-web/commit/62f7de8a2e1df5ae088c093d3acdaa868d3f61fe),
32
+ [`6df05f7`](https://github.com/brighte-labs/spark-web/commit/6df05f764e4181c140d6547d6b897d0210468f6a)]:
33
+ - @spark-web/box@1.1.0
34
+ - @spark-web/theme@3.1.0
35
+ - @spark-web/utils@1.2.3
36
+
37
+ ## 1.1.1
38
+
39
+ ### Patch Changes
40
+
41
+ - [#208](https://github.com/brighte-labs/spark-web/pull/208)
42
+ [`1ea26ef`](https://github.com/brighte-labs/spark-web/commit/1ea26ef04a3b45875ed0dd2326eeab1fbe1e4bc5)
43
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Lower required
44
+ node version
45
+
46
+ - Updated dependencies
47
+ [[`1ea26ef`](https://github.com/brighte-labs/spark-web/commit/1ea26ef04a3b45875ed0dd2326eeab1fbe1e4bc5)]:
48
+ - @spark-web/box@1.0.9
49
+ - @spark-web/theme@3.0.6
50
+ - @spark-web/utils@1.2.2
51
+
52
+ ## 1.1.0
53
+
54
+ ### Minor Changes
55
+
56
+ - [#192](https://github.com/brighte-labs/spark-web/pull/192)
57
+ [`9ff0c4b`](https://github.com/brighte-labs/spark-web/commit/9ff0c4b4cc83e0e1ab609d0bcdb01458b654263e)
58
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Spread consumer
59
+ props onto Text
60
+
61
+ ### Patch Changes
62
+
63
+ - [#197](https://github.com/brighte-labs/spark-web/pull/197)
64
+ [`94016d8`](https://github.com/brighte-labs/spark-web/commit/94016d84e26bbe55833bbcbab847a2cce6041538)
65
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Update packages
66
+
67
+ - Updated dependencies
68
+ [[`94016d8`](https://github.com/brighte-labs/spark-web/commit/94016d84e26bbe55833bbcbab847a2cce6041538)]:
69
+ - @spark-web/box@1.0.8
70
+ - @spark-web/theme@3.0.5
71
+ - @spark-web/utils@1.2.1
72
+
73
+ ## 1.0.7
74
+
75
+ ### Patch Changes
76
+
77
+ - [#173](https://github.com/brighte-labs/spark-web/pull/173)
78
+ [`90b7e9c`](https://github.com/brighte-labs/spark-web/commit/90b7e9cf4eb7e864d765c74b22c3dedf3d262e25)
79
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Update babel
80
+ dependency
81
+
82
+ - Updated dependencies
83
+ [[`90b7e9c`](https://github.com/brighte-labs/spark-web/commit/90b7e9cf4eb7e864d765c74b22c3dedf3d262e25),
84
+ [`c3867af`](https://github.com/brighte-labs/spark-web/commit/c3867af7b77dfae3580ab63a5d5c9e8452f2da62)]:
85
+ - @spark-web/box@1.0.7
86
+ - @spark-web/theme@3.0.3
87
+ - @spark-web/utils@1.2.0
88
+
89
+ ## 1.0.6
90
+
91
+ ### Patch Changes
92
+
93
+ - [#167](https://github.com/brighte-labs/spark-web/pull/167)
94
+ [`4f79350`](https://github.com/brighte-labs/spark-web/commit/4f793508fdb43ddd452f0d59a3126101f9fa5459)
95
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Update Babel
96
+
97
+ - Updated dependencies
98
+ [[`4f79350`](https://github.com/brighte-labs/spark-web/commit/4f793508fdb43ddd452f0d59a3126101f9fa5459),
99
+ [`60f7281`](https://github.com/brighte-labs/spark-web/commit/60f7281c4a194d934a2ce561cad47e737b0fb48e)]:
100
+ - @spark-web/box@1.0.6
101
+ - @spark-web/theme@3.0.2
102
+ - @spark-web/utils@1.1.5
103
+
104
+ ## 1.0.5
105
+
106
+ ### Patch Changes
107
+
108
+ - [#113](https://github.com/brighte-labs/spark-web/pull/113)
109
+ [`156236d`](https://github.com/brighte-labs/spark-web/commit/156236d2474aee66a0b8e2030635f9c08a5b78ba)
110
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Update
111
+ dependencies
112
+
113
+ - Updated dependencies
114
+ [[`156236d`](https://github.com/brighte-labs/spark-web/commit/156236d2474aee66a0b8e2030635f9c08a5b78ba)]:
115
+ - @spark-web/box@1.0.5
116
+ - @spark-web/theme@3.0.1
117
+ - @spark-web/utils@1.1.3
118
+
119
+ ## 1.0.4
120
+
121
+ ### Patch Changes
122
+
123
+ - [#83](https://github.com/brighte-labs/spark-web/pull/83)
124
+ [`1ef4f82`](https://github.com/brighte-labs/spark-web/commit/1ef4f82df999c487b79cd216c17ca5735e444fc5)
125
+ Thanks [@ChristopherMitchell242](https://github.com/ChristopherMitchell242)! -
126
+ Data attribute added to component props to allow consumers to attach custom
127
+ attributes to components
128
+
129
+ * [#65](https://github.com/brighte-labs/spark-web/pull/65)
130
+ [`182a53a`](https://github.com/brighte-labs/spark-web/commit/182a53a484892df48754e89dd714459a7f69fcff)
131
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Remove "Inter"
132
+ font, change font-weights and font-sizes.
133
+
134
+ - [#87](https://github.com/brighte-labs/spark-web/pull/87)
135
+ [`5744b68`](https://github.com/brighte-labs/spark-web/commit/5744b6820f626b93a14e11e1fbd96bcbe1b12b27)
136
+ Thanks [@ChristopherMitchell242](https://github.com/ChristopherMitchell242)! -
137
+ Data attribute added to component props to allow consumers to attach
138
+ customattributes to components
139
+
140
+ * [#52](https://github.com/brighte-labs/spark-web/pull/52)
141
+ [`82ab744`](https://github.com/brighte-labs/spark-web/commit/82ab744f198466810f3386bc459b8ab4d57c820e)
142
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Add files array
143
+ to package.json files
144
+
145
+ * Updated dependencies
146
+ [[`182a53a`](https://github.com/brighte-labs/spark-web/commit/182a53a484892df48754e89dd714459a7f69fcff),
147
+ [`82ab744`](https://github.com/brighte-labs/spark-web/commit/82ab744f198466810f3386bc459b8ab4d57c820e),
148
+ [`df618d9`](https://github.com/brighte-labs/spark-web/commit/df618d92d534e06f06ecedc95ea6bdd51cdc906b)]:
149
+ - @spark-web/theme@3.0.0
150
+ - @spark-web/box@1.0.4
151
+ - @spark-web/utils@1.1.2
152
+
153
+ ## 1.0.3
154
+
155
+ ### Patch Changes
156
+
157
+ - [#42](https://github.com/brighte-labs/spark-web/pull/42)
158
+ [`435779a`](https://github.com/brighte-labs/spark-web/commit/435779aa42bd635bbf43e1fd41724c666402caa2)
159
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Prevent multiple
160
+ versions of React
161
+
162
+ - Updated dependencies
163
+ [[`435779a`](https://github.com/brighte-labs/spark-web/commit/435779aa42bd635bbf43e1fd41724c666402caa2)]:
164
+ - @spark-web/box@1.0.3
165
+ - @spark-web/theme@2.0.2
166
+ - @spark-web/utils@1.1.1
167
+
168
+ ## 1.0.2
169
+
170
+ ### Patch Changes
171
+
172
+ - [#40](https://github.com/brighte-labs/spark-web/pull/40)
173
+ [`062c8ab`](https://github.com/brighte-labs/spark-web/commit/062c8ab8c7b4120f8d14c269b5f7801288c678ca)
174
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Add
175
+ @babel/transform-runtime
176
+
177
+ - Updated dependencies
178
+ [[`062c8ab`](https://github.com/brighte-labs/spark-web/commit/062c8ab8c7b4120f8d14c269b5f7801288c678ca)]:
179
+ - @spark-web/box@1.0.2
180
+ - @spark-web/theme@2.0.1
181
+ - @spark-web/utils@1.0.2
182
+
183
+ ## 1.0.1
184
+
185
+ ### Patch Changes
186
+
187
+ - [#36](https://github.com/brighte-labs/spark-web/pull/36)
188
+ [`8546f8f`](https://github.com/brighte-labs/spark-web/commit/8546f8f05daaa79ea3ff954c6c4928a7a2d0622d)
189
+ Thanks [@lukebennett88](https://github.com/lukebennett88)! - Update Babel
190
+ config
191
+
192
+ - Updated dependencies
193
+ [[`aebff30`](https://github.com/brighte-labs/spark-web/commit/aebff30c86cb0a9db22b545c46159ce0d1c14afb),
194
+ [`8546f8f`](https://github.com/brighte-labs/spark-web/commit/8546f8f05daaa79ea3ff954c6c4928a7a2d0622d)]:
195
+ - @spark-web/theme@2.0.0
196
+ - @spark-web/box@1.0.1
197
+ - @spark-web/utils@1.0.1
198
+
199
+ ## 1.0.0
200
+
201
+ ### Major Changes
202
+
203
+ - [#27](https://github.com/brighte-labs/spark-web/pull/27)
204
+ [`4c8e398`](https://github.com/brighte-labs/spark-web/commit/4c8e3988f8a59d3dab60a6b67b1128b6ff2a5f2c)
205
+ Thanks [@JedWatson](https://github.com/JedWatson)! - Initial Version
206
+
207
+ ### Patch Changes
208
+
209
+ - Updated dependencies
210
+ [[`4c8e398`](https://github.com/brighte-labs/spark-web/commit/4c8e3988f8a59d3dab60a6b67b1128b6ff2a5f2c)]:
211
+ - @spark-web/box@1.0.0
212
+ - @spark-web/theme@1.0.0
213
+ - @spark-web/utils@1.0.0
package/README.md CHANGED
@@ -9,44 +9,26 @@ Constrained, purposeful text styles as a component.
9
9
  ## Examples
10
10
 
11
11
  ```jsx live
12
- <Columns gap="large" collapseBelow="wide">
13
- <Stack gap="medium">
14
- <Text size="large">large regular</Text>
15
- <Text size="large" weight="semibold">
16
- large medium
17
- </Text>
18
- <Text size="large" weight="strong">
19
- large strong
20
- </Text>
21
- </Stack>
22
- <Stack gap="medium">
23
- <Text size="standard">standard regular</Text>
24
- <Text size="standard" weight="semibold">
25
- standard medium
26
- </Text>
27
- <Text size="standard" weight="strong">
28
- standard strong
29
- </Text>
30
- </Stack>
31
- <Stack gap="small">
32
- <Text size="small">small regular</Text>
33
- <Text size="small" weight="semibold">
34
- small medium
35
- </Text>
36
- <Text size="small" weight="strong">
37
- small strong
38
- </Text>
39
- </Stack>
40
- <Stack gap="small">
41
- <Text size="xsmall">xsmall regular</Text>
42
- <Text size="xsmall" weight="semibold">
43
- xsmall medium
44
- </Text>
45
- <Text size="xsmall" weight="strong">
46
- xsmall strong
47
- </Text>
48
- </Stack>
49
- </Columns>
12
+ const textSizes = ['large', 'standard', 'small', 'xsmall'];
13
+
14
+ return (
15
+ <Columns collapseBelow="tablet" gap="xlarge">
16
+ <Stack gap="large">
17
+ {textSizes.map(textSize => (
18
+ <Text key={textSize} size={textSize} weight="regular">
19
+ Text {textSize} regular
20
+ </Text>
21
+ ))}
22
+ </Stack>
23
+ <Stack gap="large">
24
+ {textSizes.map(textSize => (
25
+ <Text key={textSize} size={textSize} weight="semibold">
26
+ Text {textSize} regular
27
+ </Text>
28
+ ))}
29
+ </Stack>
30
+ </Columns>
31
+ );
50
32
  ```
51
33
 
52
34
  ### Align
@@ -67,30 +49,24 @@ Use the `overflowStrategy` prop to manage how `Text` behaves with regard to
67
49
  overflow.
68
50
 
69
51
  ```jsx live
70
- <Stack gap="large" style={{ width: 200 }}>
71
- <Stack gap="small">
72
- <Text weight="strong">Default</Text>
73
- <Text>The quick brown fox jumps over the lazy dog.</Text>
74
- </Stack>
75
- <Stack gap="small">
76
- <Text weight="strong">Truncate</Text>
77
- <Text overflowStrategy="truncate">
78
- The quick brown fox jumps over the lazy dog.
79
- </Text>
52
+ const overflowStrategies = ['truncate', 'nowrap', 'breakword'];
53
+
54
+ return (
55
+ <Stack gap="large" style={{ width: 200 }}>
56
+ <Stack gap="small">
57
+ <Text weight="semibold">Default</Text>
58
+ <Text>The quick brown fox jumps over the lazy dog.</Text>
59
+ </Stack>
60
+ {overflowStrategies.map(overflowStrategy => (
61
+ <Stack key={overflowStrategy} gap="small">
62
+ <Text weight="semibold">{overflowStrategy}</Text>
63
+ <Text overflowStrategy={overflowStrategy}>
64
+ The quick brown fox jumps over the lazy dog.
65
+ </Text>
66
+ </Stack>
67
+ ))}
80
68
  </Stack>
81
- <Stack gap="small">
82
- <Text weight="strong">No wrap</Text>
83
- <Text overflowStrategy="nowrap">
84
- The quick brown fox jumps over the lazy dog.
85
- </Text>
86
- </Stack>
87
- <Stack gap="small">
88
- <Text weight="strong">Break word</Text>
89
- <Text overflowStrategy="breakword">
90
- The_quick_brown_fox_jumps_over_the_lazy dog.
91
- </Text>
92
- </Stack>
93
- </Stack>
69
+ );
94
70
  ```
95
71
 
96
72
  ### Tone
@@ -99,14 +75,35 @@ The foreground colour of text can be set by applying a `tone`. In addition to
99
75
  the foundation tones, “muted” provides a way to de-emphasise text.
100
76
 
101
77
  ```jsx live
102
- <Inline gap="small">
103
- <Text tone="neutral">neutral (default)</Text>
104
- <Text tone="muted">muted</Text>
105
- <Text tone="info">info</Text>
106
- <Text tone="positive">positive</Text>
107
- <Text tone="caution">caution</Text>
108
- <Text tone="critical">critical</Text>
109
- </Inline>
78
+ const textTones = [
79
+ 'neutral', // Default
80
+ 'accent',
81
+ 'caution',
82
+ 'critical',
83
+ 'disabled',
84
+ 'fieldAccent',
85
+ 'info',
86
+ 'link',
87
+ 'muted',
88
+ 'placeholder',
89
+ 'positive',
90
+ 'primary',
91
+ 'primaryActive',
92
+ 'primaryHover',
93
+ 'secondary',
94
+ 'secondaryActive',
95
+ 'secondaryHover',
96
+ ];
97
+
98
+ return (
99
+ <Columns collapseBelow="tablet" gap="large" template={[1, 1]}>
100
+ {textTones.map(tone => (
101
+ <Text key={tone} tone={tone}>
102
+ {tone}
103
+ </Text>
104
+ ))}
105
+ </Columns>
106
+ );
110
107
  ```
111
108
 
112
109
  ### Weight
@@ -138,18 +135,7 @@ tones “neutral” and “muted” will be inverted.
138
135
 
139
136
  ## Props
140
137
 
141
- | Prop | Type | Default | Description |
142
- | ----------------- | --------------------------------------------------------------- | ------- | ---------------------------------------------------------------------------- |
143
- | align? | 'left' \| 'center' \| 'right' | | Sets the horizontal alignment of the component. Used if displaying as block. |
144
- | children | React.ReactNode | | The text content to be rendered. |
145
- | data? | [DataAttributeMap][data-attribute-map] | | Sets data attributes on the component. |
146
- | id? | string | | Sets a unique idenitifier for the component. |
147
- | inline? | boolean | | Indicates if text should be inline or not. |
148
- | overflowStrategy? | 'nowrap' \| 'truncate' \| 'breakword' | | Sets how text behaves with regards to overflow. Used if displaying as block. |
149
- | tabularNumbers? | boolean | | When enabled, numbers will be the same width. Similar to a monospaced font. |
150
- | tone? | keyof [BrighteTheme][brighte-theme]['color']['foreground'] | | The tone of the text. |
151
- | transform? | CSSProperties['textTransform'] | | Transforms the text casing. |
152
- | weight? | keyof [BrighteTheme][brighte-theme]['typography']['fontweight'] | | The weight of the text. |
138
+ <PropsTable displayName="Text" />
153
139
 
154
140
  Extra props are also passed into the underlying [`Box`](/package/box) component.
155
141
 
@@ -1,5 +1,5 @@
1
1
  import type { ReactNode } from 'react';
2
- import type { UseTextProps } from './useText';
2
+ import type { UseTextProps } from './use-text';
3
3
  declare type DefaultTextProps = {
4
4
  size?: NonNullable<UseTextProps['size']>;
5
5
  tone?: NonNullable<UseTextProps['tone']>;
@@ -1,11 +1,11 @@
1
1
  export { useTextContext } from './context';
2
- export { DefaultTextPropsProvider, useDefaultTextProps, } from './defaultTextProps';
3
- export { Strong } from './Strong';
4
- export { Text } from './Text';
5
- export { useForegroundTone } from './useForegroundTone';
6
- export { useOverflowStrategy } from './useOverflowStrategy';
7
- export { createTextStyles, useText } from './useText';
8
- export type { StrongProps } from './Strong';
9
- export type { TextProps } from './Text';
10
- export type { ForegroundTone } from './useForegroundTone';
11
- export type { TextOverflowStrategy } from './useOverflowStrategy';
2
+ export { DefaultTextPropsProvider, useDefaultTextProps, } from './default-text-props';
3
+ export { Strong } from './strong';
4
+ export { Text } from './text';
5
+ export { useForegroundTone } from './use-foreground-tone';
6
+ export { useOverflowStrategy } from './use-overflow-strategy';
7
+ export { createTextStyles, useText } from './use-text';
8
+ export type { StrongProps } from './strong';
9
+ export type { TextProps } from './text';
10
+ export type { ForegroundTone } from './use-foreground-tone';
11
+ export type { TextOverflowStrategy } from './use-overflow-strategy';
@@ -1,8 +1,8 @@
1
1
  import type { BoxProps } from '@spark-web/box';
2
2
  import type { DataAttributeMap } from '@spark-web/utils/internal';
3
3
  import type { CSSProperties, ReactNode } from 'react';
4
- import type { TextOverflowStrategy } from './useOverflowStrategy';
5
- import type { UseTextProps } from './useText';
4
+ import type { TextOverflowStrategy } from './use-overflow-strategy';
5
+ import type { UseTextProps } from './use-text';
6
6
  declare type InlineProps = {
7
7
  align?: never;
8
8
  /** Display as an inline element. */
@@ -1,5 +1,5 @@
1
1
  import type { BrighteTextDefinition, BrighteTheme } from '@spark-web/theme';
2
- import type { ForegroundTone } from './useForegroundTone';
2
+ import type { ForegroundTone } from './use-foreground-tone';
3
3
  export declare type UseTextProps = {
4
4
  /** Apply leading-trim styles. */
5
5
  baseline?: boolean;
@@ -59,12 +59,9 @@ var useDefaultTextProps = function useDefaultTextProps(_ref2) {
59
59
 
60
60
  var Strong = function Strong(_ref) {
61
61
  var children = _ref.children;
62
-
63
- var _useTheme = theme.useTheme(),
64
- typography = _useTheme.typography;
65
-
62
+ var theme$1 = theme.useTheme();
66
63
  var styles = {
67
- fontWeight: typography.fontWeight.semibold
64
+ fontWeight: theme$1.typography.fontWeight.semibold
68
65
  };
69
66
  return /*#__PURE__*/jsxRuntime.jsx("strong", {
70
67
  className: css.css(styles),
@@ -129,16 +126,12 @@ function useText(_ref) {
129
126
  size = _ref.size,
130
127
  tone = _ref.tone,
131
128
  weight = _ref.weight;
132
-
133
- var _useTheme = theme.useTheme(),
134
- typography = _useTheme.typography,
135
- utils = _useTheme.utils;
136
-
129
+ var theme$1 = theme.useTheme();
137
130
  var color = useForegroundTone(tone);
138
- var _typography$text$size = typography.text[size],
139
- mobile = _typography$text$size.mobile,
140
- tablet = _typography$text$size.tablet;
141
- var responsiveStyles = utils.responsiveStyles({
131
+ var _theme$typography$tex = theme$1.typography.text[size],
132
+ mobile = _theme$typography$tex.mobile,
133
+ tablet = _theme$typography$tex.tablet;
134
+ var responsiveStyles = theme$1.utils.responsiveStyles({
142
135
  mobile: createTextStyles(mobile, {
143
136
  includeTrims: baseline
144
137
  }),
@@ -148,8 +141,8 @@ function useText(_ref) {
148
141
  });
149
142
  var styles = [{
150
143
  color: color,
151
- fontFamily: typography.fontFamily.sans.name,
152
- fontWeight: typography.fontWeight[weight]
144
+ fontFamily: theme$1.typography.fontFamily.sans.name,
145
+ fontWeight: theme$1.typography.fontWeight[weight]
153
146
  }, responsiveStyles];
154
147
  return styles;
155
148
  }
@@ -59,12 +59,9 @@ var useDefaultTextProps = function useDefaultTextProps(_ref2) {
59
59
 
60
60
  var Strong = function Strong(_ref) {
61
61
  var children = _ref.children;
62
-
63
- var _useTheme = theme.useTheme(),
64
- typography = _useTheme.typography;
65
-
62
+ var theme$1 = theme.useTheme();
66
63
  var styles = {
67
- fontWeight: typography.fontWeight.semibold
64
+ fontWeight: theme$1.typography.fontWeight.semibold
68
65
  };
69
66
  return /*#__PURE__*/jsxRuntime.jsx("strong", {
70
67
  className: css.css(styles),
@@ -129,16 +126,12 @@ function useText(_ref) {
129
126
  size = _ref.size,
130
127
  tone = _ref.tone,
131
128
  weight = _ref.weight;
132
-
133
- var _useTheme = theme.useTheme(),
134
- typography = _useTheme.typography,
135
- utils = _useTheme.utils;
136
-
129
+ var theme$1 = theme.useTheme();
137
130
  var color = useForegroundTone(tone);
138
- var _typography$text$size = typography.text[size],
139
- mobile = _typography$text$size.mobile,
140
- tablet = _typography$text$size.tablet;
141
- var responsiveStyles = utils.responsiveStyles({
131
+ var _theme$typography$tex = theme$1.typography.text[size],
132
+ mobile = _theme$typography$tex.mobile,
133
+ tablet = _theme$typography$tex.tablet;
134
+ var responsiveStyles = theme$1.utils.responsiveStyles({
142
135
  mobile: createTextStyles(mobile, {
143
136
  includeTrims: baseline
144
137
  }),
@@ -148,8 +141,8 @@ function useText(_ref) {
148
141
  });
149
142
  var styles = [{
150
143
  color: color,
151
- fontFamily: typography.fontFamily.sans.name,
152
- fontWeight: typography.fontWeight[weight]
144
+ fontFamily: theme$1.typography.fontFamily.sans.name,
145
+ fontWeight: theme$1.typography.fontWeight[weight]
153
146
  }, responsiveStyles];
154
147
  return styles;
155
148
  }
@@ -55,12 +55,9 @@ var useDefaultTextProps = function useDefaultTextProps(_ref2) {
55
55
 
56
56
  var Strong = function Strong(_ref) {
57
57
  var children = _ref.children;
58
-
59
- var _useTheme = useTheme(),
60
- typography = _useTheme.typography;
61
-
58
+ var theme = useTheme();
62
59
  var styles = {
63
- fontWeight: typography.fontWeight.semibold
60
+ fontWeight: theme.typography.fontWeight.semibold
64
61
  };
65
62
  return /*#__PURE__*/jsx("strong", {
66
63
  className: css(styles),
@@ -125,16 +122,12 @@ function useText(_ref) {
125
122
  size = _ref.size,
126
123
  tone = _ref.tone,
127
124
  weight = _ref.weight;
128
-
129
- var _useTheme = useTheme(),
130
- typography = _useTheme.typography,
131
- utils = _useTheme.utils;
132
-
125
+ var theme = useTheme();
133
126
  var color = useForegroundTone(tone);
134
- var _typography$text$size = typography.text[size],
135
- mobile = _typography$text$size.mobile,
136
- tablet = _typography$text$size.tablet;
137
- var responsiveStyles = utils.responsiveStyles({
127
+ var _theme$typography$tex = theme.typography.text[size],
128
+ mobile = _theme$typography$tex.mobile,
129
+ tablet = _theme$typography$tex.tablet;
130
+ var responsiveStyles = theme.utils.responsiveStyles({
138
131
  mobile: createTextStyles(mobile, {
139
132
  includeTrims: baseline
140
133
  }),
@@ -144,8 +137,8 @@ function useText(_ref) {
144
137
  });
145
138
  var styles = [{
146
139
  color: color,
147
- fontFamily: typography.fontFamily.sans.name,
148
- fontWeight: typography.fontWeight[weight]
140
+ fontFamily: theme.typography.fontFamily.sans.name,
141
+ fontWeight: theme.typography.fontWeight[weight]
149
142
  }, responsiveStyles];
150
143
  return styles;
151
144
  }
package/package.json CHANGED
@@ -1,18 +1,25 @@
1
1
  {
2
2
  "name": "@spark-web/text",
3
- "version": "1.1.1",
4
- "license": "MIT",
3
+ "version": "1.1.2",
4
+ "homepage": "https://github.com/brighte-labs/spark-web#readme",
5
+ "repository": {
6
+ "type": "git",
7
+ "url": "https://github.com/brighte-labs/spark-web.git",
8
+ "directory": "packages/text"
9
+ },
5
10
  "main": "dist/spark-web-text.cjs.js",
6
11
  "module": "dist/spark-web-text.esm.js",
7
12
  "files": [
8
- "dist"
13
+ "CHANGELOG.md",
14
+ "dist",
15
+ "README.md"
9
16
  ],
10
17
  "dependencies": {
11
- "@babel/runtime": "^7.18.9",
18
+ "@babel/runtime": "^7.19.0",
12
19
  "@emotion/css": "^11.9.0",
13
- "@spark-web/box": "^1.0.9",
14
- "@spark-web/theme": "^3.0.6",
15
- "@spark-web/utils": "^1.2.2"
20
+ "@spark-web/box": "^1.1.0",
21
+ "@spark-web/theme": "^3.1.0",
22
+ "@spark-web/utils": "^1.2.3"
16
23
  },
17
24
  "devDependencies": {
18
25
  "@types/react": "^17.0.12",