@a-type/ui 6.0.31 → 6.0.32

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.
@@ -34,7 +34,7 @@ export function ButtonRoot(_a) {
34
34
  !iconOnlyTools.info.hasIconOnly &&
35
35
  isDropdownTriggerFromContext;
36
36
  const finalRef = useMergedRef(ref, iconOnlyTools.ref);
37
- const buttonProps = Object.assign(Object.assign(Object.assign({ ref: finalRef }, iconOnlyTools.props), props), { disabled: disabled || isLoading, 'data-input-border-flush': true, 'data-disabled': visuallyDisabled, 'data-focus-visible': visuallyFocused ? true : undefined, 'data-size': size, 'data-loading': isLoading, 'data-dropdown-trigger': isDropdownTrigger ? true : undefined, tabIndex: visuallyDisabled ? -1 : undefined, 'data-toggleable': toggled !== undefined, 'data-disable-icon-mode': disableIconMode, 'data-force-icon-mode': forceIconMode, 'data-emphasis': emphasis, className: clsx(emphasis === 'unstyled' ? cls.unstyled : cls.root, emphasis === 'ghost' && '@mode-bold', size === 'small' ? '@mode-dense' : '', color ? `@mode-${color}` : '', className) });
37
+ const buttonProps = Object.assign(Object.assign(Object.assign({ ref: finalRef }, iconOnlyTools.props), { disabled: disabled || isLoading, 'data-input-border-flush': true, 'data-disabled': visuallyDisabled, 'data-focus-visible': visuallyFocused ? true : undefined, 'data-size': size, 'data-loading': isLoading, 'data-dropdown-trigger': isDropdownTrigger ? true : undefined, tabIndex: visuallyDisabled ? -1 : undefined, 'data-toggleable': toggled !== undefined, 'data-disable-icon-mode': disableIconMode, 'data-force-icon-mode': forceIconMode, 'data-emphasis': emphasis, className: clsx(emphasis === 'unstyled' ? cls.unstyled : cls.root, emphasis === 'ghost' && '@mode-bold', size === 'small' ? '@mode-dense' : '', color ? `@mode-${color}` : '', className) }), props);
38
38
  // set state when toggleable
39
39
  if (toggled !== undefined) {
40
40
  buttonProps['aria-pressed'] = !!toggled;
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"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"}
@@ -4,4 +4,4 @@ export interface ChipProps extends SlotDivProps {
4
4
  ref?: Ref<any>;
5
5
  emphasis?: 'default' | 'primary' | 'ambient';
6
6
  }
7
- export declare function Chip({ className, ...rest }: ChipProps): import("react/jsx-runtime").JSX.Element;
7
+ export declare function Chip({ className, emphasis, ...rest }: ChipProps): import("react/jsx-runtime").JSX.Element;
@@ -14,8 +14,7 @@ import classNames from 'clsx';
14
14
  import { SlotDiv } from '../utility/SlotDiv.js';
15
15
  import cls from './Chip.module.css';
16
16
  export function Chip(_a) {
17
- var _b;
18
- var { className } = _a, rest = __rest(_a, ["className"]);
19
- return (_jsx(SlotDiv, Object.assign({ className: classNames('@mode-dense', cls.root, className), role: rest.onClick ? 'button' : undefined, "data-emphasis": (_b = rest.emphasis) !== null && _b !== void 0 ? _b : 'default' }, rest)));
17
+ var { className, emphasis } = _a, rest = __rest(_a, ["className", "emphasis"]);
18
+ return (_jsx(SlotDiv, Object.assign({ className: classNames(cls.root, className), role: rest.onClick ? 'button' : undefined }, rest, { "data-emphasis": emphasis !== null && emphasis !== void 0 ? emphasis : 'default' })));
20
19
  }
21
20
  //# sourceMappingURL=Chip.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../src/components/chip/Chip.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,UAAU,MAAM,MAAM,CAAC;AAE9B,OAAO,EAAE,OAAO,EAAgB,MAAM,uBAAuB,CAAC;AAC9D,OAAO,GAAG,MAAM,mBAAmB,CAAC;AAOpC,MAAM,UAAU,IAAI,CAAC,EAAiC;;QAAjC,EAAE,SAAS,OAAsB,EAAjB,IAAI,cAApB,aAAsB,CAAF;IACxC,OAAO,CACN,KAAC,OAAO,kBACP,SAAS,EAAE,UAAU,CAAC,aAAa,EAAE,GAAG,CAAC,IAAI,EAAE,SAAS,CAAC,EACzD,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,mBAC1B,MAAA,IAAI,CAAC,QAAQ,mCAAI,SAAS,IACrC,IAAI,EACP,CACF,CAAC;AACH,CAAC"}
1
+ {"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../src/components/chip/Chip.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,UAAU,MAAM,MAAM,CAAC;AAE9B,OAAO,EAAE,OAAO,EAAgB,MAAM,uBAAuB,CAAC;AAC9D,OAAO,GAAG,MAAM,mBAAmB,CAAC;AAOpC,MAAM,UAAU,IAAI,CAAC,EAA2C;QAA3C,EAAE,SAAS,EAAE,QAAQ,OAAsB,EAAjB,IAAI,cAA9B,yBAAgC,CAAF;IAClD,OAAO,CACN,KAAC,OAAO,kBACP,SAAS,EAAE,UAAU,CAAC,GAAG,CAAC,IAAI,EAAE,SAAS,CAAC,EAC1C,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,IACrC,IAAI,qBACO,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,SAAS,IACnC,CACF,CAAC;AACH,CAAC"}
@@ -16,8 +16,8 @@
16
16
  font-weight: var(--m-prose-ambient-weight);
17
17
  font-family: var(--m-prose-ambient-font);
18
18
 
19
- &:not(:is(button)) {
20
- padding: var(--m-action-padding);
19
+ && {
20
+ padding: var(--m-space-sm) var(--m-space-md);
21
21
  }
22
22
 
23
23
  &[data-emphasis='primary'] {
@@ -26,7 +26,7 @@ export const Colors = {
26
26
  };
27
27
  export const AsButton = {
28
28
  render(args) {
29
- return (_jsxs(Box, { gap: true, items: "center", children: [_jsx(Button, { render: _jsx(Chip, { color: "primary", children: "Clickable Chip" }) }), _jsx(Chip, Object.assign({}, args, { children: "Non-clickable Chip" }))] }));
29
+ return (_jsxs(Box, { gap: true, items: "center", children: [_jsx(Chip, { render: _jsx(Button, {}), emphasis: "primary", children: "Clickable Chip" }), _jsx(Chip, Object.assign({}, args, { children: "Non-clickable Chip" }))] }));
30
30
  },
31
31
  };
32
32
  //# sourceMappingURL=Chip.stories.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Chip.stories.js","sourceRoot":"","sources":["../../../src/components/chip/Chip.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,IAAI;IACf,IAAI,EAAE;QACL,QAAQ,EAAE,MAAM;QAChB,QAAQ,EAAE,SAAS;KACnB;IACD,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CAC2B,CAAC;AAE9B,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC7B,MAAM,CAAC,IAAI;QACV,OAAO,KAAC,IAAI,oBAAK,IAAI,EAAI,CAAC;IAC3B,CAAC;CACD,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAU;IAC5B,MAAM;QACL,OAAO,CACN,eAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,aAC3C,KAAC,IAAI,IAAC,SAAS,EAAC,eAAe,qBAAY,EAC3C,KAAC,IAAI,0BAAe,EACpB,KAAC,IAAI,IAAC,SAAS,EAAC,cAAc,uBAAc,EAC5C,KAAC,IAAI,IAAC,SAAS,EAAC,iBAAiB,0BAAiB,EAClD,KAAC,IAAI,IAAC,SAAS,EAAC,eAAe,wBAAe,EAC9C,KAAC,IAAI,IAAC,SAAS,EAAC,aAAa,sBAAa,EAC1C,KAAC,IAAI,IAAC,SAAS,EAAC,YAAY,qBAAY,EACxC,KAAC,IAAI,IAAC,SAAS,EAAC,cAAc,uBAAc,EAC5C,KAAC,IAAI,IAAC,SAAS,EAAC,iBAAiB,0BAAiB,EAClD,KAAC,IAAI,IAAC,SAAS,EAAC,gBAAgB,yBAAgB,IAC3C,CACN,CAAC;IACH,CAAC;CACD,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC9B,MAAM,CAAC,IAAI;QACV,OAAO,CACN,MAAC,GAAG,IAAC,GAAG,QAAC,KAAK,EAAC,QAAQ,aACtB,KAAC,MAAM,IAAC,MAAM,EAAE,KAAC,IAAI,IAAC,KAAK,EAAC,SAAS,+BAAsB,GAAI,EAC/D,KAAC,IAAI,oBAAK,IAAI,sCAA2B,IACpC,CACN,CAAC;IACH,CAAC;CACD,CAAC"}
1
+ {"version":3,"file":"Chip.stories.js","sourceRoot":"","sources":["../../../src/components/chip/Chip.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAEjC,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,IAAI;IACf,IAAI,EAAE;QACL,QAAQ,EAAE,MAAM;QAChB,QAAQ,EAAE,SAAS;KACnB;IACD,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CAC2B,CAAC;AAE9B,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC7B,MAAM,CAAC,IAAI;QACV,OAAO,KAAC,IAAI,oBAAK,IAAI,EAAI,CAAC;IAC3B,CAAC;CACD,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAU;IAC5B,MAAM;QACL,OAAO,CACN,eAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,aAC3C,KAAC,IAAI,IAAC,SAAS,EAAC,eAAe,qBAAY,EAC3C,KAAC,IAAI,0BAAe,EACpB,KAAC,IAAI,IAAC,SAAS,EAAC,cAAc,uBAAc,EAC5C,KAAC,IAAI,IAAC,SAAS,EAAC,iBAAiB,0BAAiB,EAClD,KAAC,IAAI,IAAC,SAAS,EAAC,eAAe,wBAAe,EAC9C,KAAC,IAAI,IAAC,SAAS,EAAC,aAAa,sBAAa,EAC1C,KAAC,IAAI,IAAC,SAAS,EAAC,YAAY,qBAAY,EACxC,KAAC,IAAI,IAAC,SAAS,EAAC,cAAc,uBAAc,EAC5C,KAAC,IAAI,IAAC,SAAS,EAAC,iBAAiB,0BAAiB,EAClD,KAAC,IAAI,IAAC,SAAS,EAAC,gBAAgB,yBAAgB,IAC3C,CACN,CAAC;IACH,CAAC;CACD,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC9B,MAAM,CAAC,IAAI;QACV,OAAO,CACN,MAAC,GAAG,IAAC,GAAG,QAAC,KAAK,EAAC,QAAQ,aACtB,KAAC,IAAI,IAAC,MAAM,EAAE,KAAC,MAAM,KAAG,EAAE,QAAQ,EAAC,SAAS,+BAErC,EACP,KAAC,IAAI,oBAAK,IAAI,sCAA2B,IACpC,CACN,CAAC;IACH,CAAC;CACD,CAAC"}
@@ -2,7 +2,7 @@
2
2
  fill: none;
3
3
  flex-shrink: 0;
4
4
 
5
- --size: calc(round(16px / var(--m-global-space-density), 1px));
5
+ --size: 1em;
6
6
  width: var(--size);
7
7
  height: var(--size);
8
8
  }
@@ -90,6 +90,12 @@
90
90
  position: relative;
91
91
  display: flex;
92
92
 
93
+ & img,
94
+ & svg {
95
+ width: --fn-literal(15px);
96
+ height: --fn-literal(15px);
97
+ }
98
+
93
99
  @media (min-width: 768px) {
94
100
  @apply --mx-bg(var(--m-color-neutral-light));
95
101
  @apply --mx-bg-faded(50%);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@a-type/ui",
3
- "version": "6.0.31",
3
+ "version": "6.0.32",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "url": "https://github.com/a-type/ui"
@@ -76,7 +76,6 @@ export function ButtonRoot({
76
76
  const buttonProps = {
77
77
  ref: finalRef,
78
78
  ...iconOnlyTools.props,
79
- ...props,
80
79
  disabled: disabled || isLoading,
81
80
  'data-input-border-flush': true,
82
81
  'data-disabled': visuallyDisabled,
@@ -96,6 +95,7 @@ export function ButtonRoot({
96
95
  color ? `@mode-${color}` : '',
97
96
  className,
98
97
  ),
98
+ ...props,
99
99
  };
100
100
  // set state when toggleable
101
101
  if (toggled !== undefined) {
@@ -16,8 +16,8 @@
16
16
  font-weight: var(--m-prose-ambient-weight);
17
17
  font-family: var(--m-prose-ambient-font);
18
18
 
19
- &:not(:is(button)) {
20
- padding: var(--m-action-padding);
19
+ && {
20
+ padding: var(--m-space-sm) var(--m-space-md);
21
21
  }
22
22
 
23
23
  &[data-emphasis='primary'] {
@@ -48,7 +48,9 @@ export const AsButton: Story = {
48
48
  render(args) {
49
49
  return (
50
50
  <Box gap items="center">
51
- <Button render={<Chip color="primary">Clickable Chip</Chip>} />
51
+ <Chip render={<Button />} emphasis="primary">
52
+ Clickable Chip
53
+ </Chip>
52
54
  <Chip {...args}>Non-clickable Chip</Chip>
53
55
  </Box>
54
56
  );
@@ -8,13 +8,13 @@ export interface ChipProps extends SlotDivProps {
8
8
  emphasis?: 'default' | 'primary' | 'ambient';
9
9
  }
10
10
 
11
- export function Chip({ className, ...rest }: ChipProps) {
11
+ export function Chip({ className, emphasis, ...rest }: ChipProps) {
12
12
  return (
13
13
  <SlotDiv
14
- className={classNames('@mode-dense', cls.root, className)}
14
+ className={classNames(cls.root, className)}
15
15
  role={rest.onClick ? 'button' : undefined}
16
- data-emphasis={rest.emphasis ?? 'default'}
17
16
  {...rest}
17
+ data-emphasis={emphasis ?? 'default'}
18
18
  />
19
19
  );
20
20
  }
@@ -2,7 +2,7 @@
2
2
  fill: none;
3
3
  flex-shrink: 0;
4
4
 
5
- --size: calc(round(16px / var(--m-global-space-density), 1px));
5
+ --size: 1em;
6
6
  width: var(--size);
7
7
  height: var(--size);
8
8
  }
@@ -90,6 +90,12 @@
90
90
  position: relative;
91
91
  display: flex;
92
92
 
93
+ & img,
94
+ & svg {
95
+ width: --fn-literal(15px);
96
+ height: --fn-literal(15px);
97
+ }
98
+
93
99
  @media (min-width: 768px) {
94
100
  @apply --mx-bg(var(--m-color-neutral-light));
95
101
  @apply --mx-bg-faded(50%);