@a-type/ui 6.0.14 → 6.0.16

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 (9) hide show
  1. package/dist/components/typography/typography.d.ts +2 -1
  2. package/dist/components/typography/typography.js +2 -1
  3. package/dist/components/typography/typography.js.map +1 -1
  4. package/dist/components/typography/typography.module.css +3 -0
  5. package/dist/css/util.css +38 -0
  6. package/package.json +1 -1
  7. package/src/components/typography/typography.module.css +3 -0
  8. package/src/components/typography/typography.tsx +3 -0
  9. package/src/css/util.css +38 -0
package/dist/components/typography/typography.d.ts CHANGED
@@ -7,8 +7,9 @@ export interface TypographyProps extends useRender.ComponentProps<'span'> {
7
7
  bold?: boolean;
8
8
  thin?: boolean;
9
9
  truncate?: boolean;
10
+ dim?: boolean;
10
11
  }
11
- export declare function Text({ emphasis, italic, underline, strikethrough, render, className, bold, thin, truncate, ...rest }: TypographyProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
12
+ export declare function Text({ emphasis, italic, underline, strikethrough, render, className, bold, thin, truncate, dim, ...rest }: TypographyProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
12
13
  export declare const Heading: import("react").FunctionComponent<TypographyProps>;
13
14
  export declare const HeroText: import("react").FunctionComponent<TypographyProps>;
14
15
  export declare const P: (props: TypographyProps) => import("react/jsx-runtime").JSX.Element;
package/dist/components/typography/typography.js CHANGED
@@ -16,7 +16,7 @@ import { withClassName } from '../../hooks/withClassName.js';
16
16
  import { withProps } from '../../hooks/withProps.js';
17
17
  import cls from './typography.module.css';
18
18
  export function Text(_a) {
19
- var { emphasis, italic, underline, strikethrough, render, className, bold, thin, truncate } = _a, rest = __rest(_a, ["emphasis", "italic", "underline", "strikethrough", "render", "className", "bold", "thin", "truncate"]);
19
+ var { emphasis, italic, underline, strikethrough, render, className, bold, thin, truncate, dim } = _a, rest = __rest(_a, ["emphasis", "italic", "underline", "strikethrough", "render", "className", "bold", "thin", "truncate", "dim"]);
20
20
  return useRender({
21
21
  render,
22
22
  defaultTagName: 'span',
@@ -29,6 +29,7 @@ export function Text(_a) {
29
29
  bold: bold ? true : undefined,
30
30
  thin: thin ? true : undefined,
31
31
  truncate: truncate ? true : undefined,
32
+ dim: dim ? true : undefined,
32
33
  },
33
34
  });
34
35
  }
package/dist/components/typography/typography.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"typography.js","sourceRoot":"","sources":["../../../src/components/typography/typography.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,GAAG,MAAM,yBAAyB,CAAC;AAY1C,MAAM,UAAU,IAAI,CAAC,EAWH;QAXG,EACpB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,aAAa,EACb,MAAM,EACN,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,QAAQ,OAES,EADd,IAAI,cAVa,uGAWpB,CADO;IAEP,OAAO,SAAS,CAAC;QAChB,MAAM;QACN,cAAc,EAAE,MAAM;QACtB,KAAK,kCACD,IAAI,KACP,SAAS,EAAE,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,GAAG,CAAC,YAAY,EAAE,SAAS,CAAC,GAC5D;QACD,KAAK,EAAE;YACN,QAAQ;YACR,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YACjC,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YACvC,aAAa,EAAE,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YAC/C,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YAC7B,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YAC7B,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;SACrC;KACD,CAAC,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,aAAa,CAAC,IAAI,EAAE,eAAe,CAAC,CAAC;AAC5D,MAAM,CAAC,MAAM,QAAQ,GAAG,aAAa,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;AAC1D,MAAM,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC,IAAI,EAAE,EAAE,MAAM,EAAE,aAAK,EAAE,CAAC,CAAC;AAEpD;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,SAAS;CACnB,CAAC,CAAC;AACH;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,WAAW;CACrB,CAAC,CAAC;AACH;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,WAAW;CACrB,CAAC,CAAC;AACH;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,SAAS;CACnB,CAAC,CAAC;AACH;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,SAAS;CACnB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,QAAQ,GAAG,SAAS,CAAC,IAAI,EAAE;IACvC,MAAM,EAAE,aAAK;IACb,IAAI,EAAE,IAAI;IACV,SAAS,EAAE,IAAI;CACf,CAAC,CAAC"}
1
+ {"version":3,"file":"typography.js","sourceRoot":"","sources":["../../../src/components/typography/typography.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,GAAG,MAAM,yBAAyB,CAAC;AAa1C,MAAM,UAAU,IAAI,CAAC,EAYH;QAZG,EACpB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,aAAa,EACb,MAAM,EACN,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,GAAG,OAEc,EADd,IAAI,cAXa,8GAYpB,CADO;IAEP,OAAO,SAAS,CAAC;QAChB,MAAM;QACN,cAAc,EAAE,MAAM;QACtB,KAAK,kCACD,IAAI,KACP,SAAS,EAAE,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,GAAG,CAAC,YAAY,EAAE,SAAS,CAAC,GAC5D;QACD,KAAK,EAAE;YACN,QAAQ;YACR,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YACjC,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YACvC,aAAa,EAAE,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YAC/C,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YAC7B,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YAC7B,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;YACrC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;SAC3B;KACD,CAAC,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,aAAa,CAAC,IAAI,EAAE,eAAe,CAAC,CAAC;AAC5D,MAAM,CAAC,MAAM,QAAQ,GAAG,aAAa,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;AAC1D,MAAM,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC,IAAI,EAAE,EAAE,MAAM,EAAE,aAAK,EAAE,CAAC,CAAC;AAEpD;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,SAAS;CACnB,CAAC,CAAC;AACH;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,WAAW;CACrB,CAAC,CAAC;AACH;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,WAAW;CACrB,CAAC,CAAC;AACH;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,SAAS;CACnB,CAAC,CAAC;AACH;;GAEG;AACH,MAAM,CAAC,MAAM,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE;IACpC,MAAM,EAAE,cAAM;IACd,QAAQ,EAAE,SAAS;CACnB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,QAAQ,GAAG,SAAS,CAAC,IAAI,EAAE;IACvC,MAAM,EAAE,aAAK;IACb,IAAI,EAAE,IAAI;IACV,SAAS,EAAE,IAAI;CACf,CAAC,CAAC"}
package/dist/components/typography/typography.module.css CHANGED
@@ -37,6 +37,9 @@
37
37
  white-space: nowrap;
38
38
  max-width: 100%;
39
39
  }
40
+ &[data-dim] {
41
+ @apply --mx-fg(var(--m-color-neutral-heavy));
42
+ }
40
43
  }
41
44
 
42
45
  @layer components {
package/dist/css/util.css CHANGED
@@ -126,3 +126,41 @@
126
126
  .p-xl {
127
127
  padding: var(--m-space-xl);
128
128
  }
129
+
130
+ /* Responsive */
131
+ .lt-sm {
132
+ display: block;
133
+ @media (max-width: 640px) {
134
+ display: none;
135
+ }
136
+ }
137
+ .gt-sm {
138
+ display: none;
139
+ @media (min-width: 640px) {
140
+ display: block;
141
+ }
142
+ }
143
+ .lt-md {
144
+ display: block;
145
+ @media (max-width: 768px) {
146
+ display: none;
147
+ }
148
+ }
149
+ .gt-md {
150
+ display: none;
151
+ @media (min-width: 768px) {
152
+ display: block;
153
+ }
154
+ }
155
+ .lt-lg {
156
+ display: block;
157
+ @media (max-width: 1024px) {
158
+ display: none;
159
+ }
160
+ }
161
+ .gt-lg {
162
+ display: none;
163
+ @media (min-width: 1024px) {
164
+ display: block;
165
+ }
166
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@a-type/ui",
3
- "version": "6.0.14",
3
+ "version": "6.0.16",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "url": "https://github.com/a-type/ui"
package/src/components/typography/typography.module.css CHANGED
@@ -37,6 +37,9 @@
37
37
  white-space: nowrap;
38
38
  max-width: 100%;
39
39
  }
40
+ &[data-dim] {
41
+ @apply --mx-fg(var(--m-color-neutral-heavy));
42
+ }
40
43
  }
41
44
 
42
45
  @layer components {
package/src/components/typography/typography.tsx CHANGED
@@ -12,6 +12,7 @@ export interface TypographyProps extends useRender.ComponentProps<'span'> {
12
12
  bold?: boolean;
13
13
  thin?: boolean;
14
14
  truncate?: boolean;
15
+ dim?: boolean;
15
16
  }
16
17
 
17
18
  export function Text({
@@ -24,6 +25,7 @@ export function Text({
24
25
  bold,
25
26
  thin,
26
27
  truncate,
28
+ dim,
27
29
  ...rest
28
30
  }: TypographyProps) {
29
31
  return useRender({
@@ -41,6 +43,7 @@ export function Text({
41
43
  bold: bold ? true : undefined,
42
44
  thin: thin ? true : undefined,
43
45
  truncate: truncate ? true : undefined,
46
+ dim: dim ? true : undefined,
44
47
  },
45
48
  });
46
49
  }
package/src/css/util.css CHANGED
@@ -126,3 +126,41 @@
126
126
  .p-xl {
127
127
  padding: var(--m-space-xl);
128
128
  }
129
+
130
+ /* Responsive */
131
+ .lt-sm {
132
+ display: block;
133
+ @media (max-width: 640px) {
134
+ display: none;
135
+ }
136
+ }
137
+ .gt-sm {
138
+ display: none;
139
+ @media (min-width: 640px) {
140
+ display: block;
141
+ }
142
+ }
143
+ .lt-md {
144
+ display: block;
145
+ @media (max-width: 768px) {
146
+ display: none;
147
+ }
148
+ }
149
+ .gt-md {
150
+ display: none;
151
+ @media (min-width: 768px) {
152
+ display: block;
153
+ }
154
+ }
155
+ .lt-lg {
156
+ display: block;
157
+ @media (max-width: 1024px) {
158
+ display: none;
159
+ }
160
+ }
161
+ .gt-lg {
162
+ display: none;
163
+ @media (min-width: 1024px) {
164
+ display: block;
165
+ }
166
+ }