@mirohq/design-system-base-button 0.4.13-themes.2 → 0.4.13
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/dist/main.js +1 -3
- package/dist/main.js.map +1 -1
- package/dist/module.js +1 -3
- package/dist/module.js.map +1 -1
- package/package.json +2 -2
package/dist/main.js
CHANGED
|
@@ -10,7 +10,6 @@ var interactions = require('@react-aria/interactions');
|
|
|
10
10
|
var designSystemUsePress = require('@mirohq/design-system-use-press');
|
|
11
11
|
var designSystemPrimitive = require('@mirohq/design-system-primitive');
|
|
12
12
|
var designSystemStitches = require('@mirohq/design-system-stitches');
|
|
13
|
-
var designSystemStyles = require('@mirohq/design-system-styles');
|
|
14
13
|
|
|
15
14
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
16
15
|
|
|
@@ -33,8 +32,7 @@ const StyledBaseButton = designSystemStitches.styled(designSystemPrimitive.Primi
|
|
|
33
32
|
},
|
|
34
33
|
"&[aria-disabled]": {
|
|
35
34
|
cursor: "default"
|
|
36
|
-
}
|
|
37
|
-
...designSystemStyles.focus.defaults
|
|
35
|
+
}
|
|
38
36
|
});
|
|
39
37
|
|
|
40
38
|
const BaseButton = React__default["default"].forwardRef(
|
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.js","sources":["../src/base-button.styled.ts","../src/base-button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\
|
|
1
|
+
{"version":3,"file":"main.js","sources":["../src/base-button.styled.ts","../src/base-button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const sizes = {\n medium: '$8',\n large: '$10',\n xLarge: '$12',\n}\n\nexport const StyledBaseButton = styled(Primitive.button, {\n all: 'unset',\n display: 'inline-flex',\n alignItems: 'center',\n boxSizing: 'border-box',\n borderRadius: '$50',\n cursor: 'pointer',\n\n '&[disabled]': {\n pointerEvents: 'none',\n },\n\n '&[aria-disabled]': {\n cursor: 'default',\n },\n})\n\nexport type StyledBaseButtonProps = ComponentPropsWithRef<\n typeof StyledBaseButton\n>\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\nimport { mergeProps } from '@react-aria/utils'\nimport { booleanify, removeEventProps } from '@mirohq/design-system-utils'\nimport { useHover } from '@react-aria/interactions'\nimport type { HoverEvents } from '@react-types/shared'\nimport { usePress } from '@mirohq/design-system-use-press'\nimport type { PressProps } from '@mirohq/design-system-use-press'\n\nimport { StyledBaseButton } from './base-button.styled'\nimport type { StyledBaseButtonProps } from './base-button.styled'\n\n// DO NOT export it in the index\n// Fix TS2742, option 3.1 in the comment bellow\n// https://github.com/microsoft/TypeScript/issues/47663#issuecomment-1519138189\nexport type { HoverEvents } from '@react-types/shared'\n\ntype AsButtonProps = StyledBaseButtonProps & PressProps & HoverEvents\ntype AsLinkProps = AsButtonProps & AnchorHTMLAttributes<'a'> & { href: string }\n\nexport type BaseButtonProps = AsButtonProps | AsLinkProps\n\nexport const BaseButton = React.forwardRef<\n ElementRef<'button' | 'a'>,\n BaseButtonProps\n>(\n (\n {\n disabled = false,\n 'aria-disabled': ariaDisabled,\n children,\n asChild,\n role,\n onHoverStart,\n onHoverEnd,\n onHoverChange,\n ...restProps\n },\n forwardRef\n ) => {\n const asLink = 'href' in restProps\n const { href, target, rel = '' } = restProps as AsLinkProps\n\n let elementProps = restProps\n\n if (booleanify(ariaDisabled)) {\n elementProps = removeEventProps(elementProps, ['onBlur', 'onFocus'])\n }\n\n const { pressProps, isPressed } = usePress({\n preventFocusOnPress: true,\n disabled: disabled || booleanify(ariaDisabled),\n ...elementProps,\n })\n\n const { hoverProps, isHovered } = useHover({\n onHoverStart,\n onHoverEnd,\n onHoverChange,\n })\n\n elementProps = mergeProps(pressProps, hoverProps)\n\n return (\n <StyledBaseButton\n {...elementProps}\n data-pressed={isPressed ? '' : undefined}\n data-hovered={isHovered ? '' : undefined}\n asChild={asLink || asChild}\n disabled={disabled}\n role={role ?? (asChild === true ? 'button' : undefined)}\n aria-disabled={booleanify(ariaDisabled) ? 'true' : undefined}\n tabIndex={disabled && (asLink || asChild === true) ? -1 : undefined}\n // Button can be an <a> but TS will never know because it will only happen in runtime via asChild\n // @ts-expect-error\n ref={forwardRef}\n >\n {asLink ? (\n <a\n href={href}\n target={target}\n rel={\n target === '_blank' ? `noopener noreferrer ${rel}`.trim() : rel\n }\n >\n {children}\n </a>\n ) : (\n children\n )}\n </StyledBaseButton>\n )\n }\n)\n"],"names":["styled","Primitive","React","booleanify","removeEventProps","usePress","useHover","mergeProps","jsx"],"mappings":"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"}
|
package/dist/module.js
CHANGED
|
@@ -6,7 +6,6 @@ import { useHover } from '@react-aria/interactions';
|
|
|
6
6
|
import { usePress } from '@mirohq/design-system-use-press';
|
|
7
7
|
import { Primitive } from '@mirohq/design-system-primitive';
|
|
8
8
|
import { styled } from '@mirohq/design-system-stitches';
|
|
9
|
-
import { focus } from '@mirohq/design-system-styles';
|
|
10
9
|
|
|
11
10
|
const sizes = {
|
|
12
11
|
medium: "$8",
|
|
@@ -25,8 +24,7 @@ const StyledBaseButton = styled(Primitive.button, {
|
|
|
25
24
|
},
|
|
26
25
|
"&[aria-disabled]": {
|
|
27
26
|
cursor: "default"
|
|
28
|
-
}
|
|
29
|
-
...focus.defaults
|
|
27
|
+
}
|
|
30
28
|
});
|
|
31
29
|
|
|
32
30
|
const BaseButton = React.forwardRef(
|
package/dist/module.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"module.js","sources":["../src/base-button.styled.ts","../src/base-button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\
|
|
1
|
+
{"version":3,"file":"module.js","sources":["../src/base-button.styled.ts","../src/base-button.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const sizes = {\n medium: '$8',\n large: '$10',\n xLarge: '$12',\n}\n\nexport const StyledBaseButton = styled(Primitive.button, {\n all: 'unset',\n display: 'inline-flex',\n alignItems: 'center',\n boxSizing: 'border-box',\n borderRadius: '$50',\n cursor: 'pointer',\n\n '&[disabled]': {\n pointerEvents: 'none',\n },\n\n '&[aria-disabled]': {\n cursor: 'default',\n },\n})\n\nexport type StyledBaseButtonProps = ComponentPropsWithRef<\n typeof StyledBaseButton\n>\n","import React from 'react'\nimport type { ElementRef, AnchorHTMLAttributes } from 'react'\nimport { mergeProps } from '@react-aria/utils'\nimport { booleanify, removeEventProps } from '@mirohq/design-system-utils'\nimport { useHover } from '@react-aria/interactions'\nimport type { HoverEvents } from '@react-types/shared'\nimport { usePress } from '@mirohq/design-system-use-press'\nimport type { PressProps } from '@mirohq/design-system-use-press'\n\nimport { StyledBaseButton } from './base-button.styled'\nimport type { StyledBaseButtonProps } from './base-button.styled'\n\n// DO NOT export it in the index\n// Fix TS2742, option 3.1 in the comment bellow\n// https://github.com/microsoft/TypeScript/issues/47663#issuecomment-1519138189\nexport type { HoverEvents } from '@react-types/shared'\n\ntype AsButtonProps = StyledBaseButtonProps & PressProps & HoverEvents\ntype AsLinkProps = AsButtonProps & AnchorHTMLAttributes<'a'> & { href: string }\n\nexport type BaseButtonProps = AsButtonProps | AsLinkProps\n\nexport const BaseButton = React.forwardRef<\n ElementRef<'button' | 'a'>,\n BaseButtonProps\n>(\n (\n {\n disabled = false,\n 'aria-disabled': ariaDisabled,\n children,\n asChild,\n role,\n onHoverStart,\n onHoverEnd,\n onHoverChange,\n ...restProps\n },\n forwardRef\n ) => {\n const asLink = 'href' in restProps\n const { href, target, rel = '' } = restProps as AsLinkProps\n\n let elementProps = restProps\n\n if (booleanify(ariaDisabled)) {\n elementProps = removeEventProps(elementProps, ['onBlur', 'onFocus'])\n }\n\n const { pressProps, isPressed } = usePress({\n preventFocusOnPress: true,\n disabled: disabled || booleanify(ariaDisabled),\n ...elementProps,\n })\n\n const { hoverProps, isHovered } = useHover({\n onHoverStart,\n onHoverEnd,\n onHoverChange,\n })\n\n elementProps = mergeProps(pressProps, hoverProps)\n\n return (\n <StyledBaseButton\n {...elementProps}\n data-pressed={isPressed ? '' : undefined}\n data-hovered={isHovered ? '' : undefined}\n asChild={asLink || asChild}\n disabled={disabled}\n role={role ?? (asChild === true ? 'button' : undefined)}\n aria-disabled={booleanify(ariaDisabled) ? 'true' : undefined}\n tabIndex={disabled && (asLink || asChild === true) ? -1 : undefined}\n // Button can be an <a> but TS will never know because it will only happen in runtime via asChild\n // @ts-expect-error\n ref={forwardRef}\n >\n {asLink ? (\n <a\n href={href}\n target={target}\n rel={\n target === '_blank' ? `noopener noreferrer ${rel}`.trim() : rel\n }\n >\n {children}\n </a>\n ) : (\n children\n )}\n </StyledBaseButton>\n )\n }\n)\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mirohq/design-system-base-button",
|
|
3
|
-
"version": "0.4.13
|
|
3
|
+
"version": "0.4.13",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "Miro",
|
|
6
6
|
"source": "src/index.ts",
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
"@react-aria/utils": "^3.13.0",
|
|
31
31
|
"@react-types/shared": "^3.16.0",
|
|
32
32
|
"@mirohq/design-system-primitive": "^1.1.0",
|
|
33
|
-
"@mirohq/design-system-stitches": "^2.3.5
|
|
33
|
+
"@mirohq/design-system-stitches": "^2.3.5"
|
|
34
34
|
},
|
|
35
35
|
"scripts": {
|
|
36
36
|
"build": "rollup -c ../../../../rollup.config.js",
|