@mirohq/design-system-base-select 0.1.0 → 0.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/dist/main.js.map +1 -1
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +66 -6
- package/package.json +3 -3
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"main.js","sources":["../src/item-check.styled.ts","../src/styles.ts"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledItemCheck = styled(Primitive.span, {\n color: '$icon-primary',\n})\n","import
|
|
1
|
+
{"version":3,"file":"main.js","sources":["../src/item-check.styled.ts","../src/styles.ts"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledItemCheck = styled(Primitive.span, {\n color: '$icon-primary',\n})\n","import { focus } from '@mirohq/design-system-styles'\n\nimport { StyledItemCheck } from './item-check.styled'\n\nexport const separatorStyles = {\n backgroundColor: '$border-neutrals-subtle',\n height: '1px',\n width: '100%',\n margin: '$100 0',\n}\n\nexport const contentStyles = {\n backgroundColor: '$background-neutrals-container',\n borderRadius: '$50',\n boxShadow: '$50',\n fontSize: '$175',\n fontWeight: 'normal',\n lineHeight: '20px',\n padding: '$50',\n zIndex: '$select', // this z-index will be applied to an absolute positioned container\n outline: '1px solid transparent',\n}\n\nexport const itemStyles = {\n all: 'unset',\n position: 'relative',\n display: 'grid',\n gridTemplateColumns: '20px 1fr',\n cursor: 'pointer',\n userSelect: 'none',\n fontSize: '$175',\n lineHeight: '20px',\n boxSizing: 'border-box',\n padding: '6px 0',\n paddingInline: '$150 $100',\n borderRadius: '$50',\n color: '$text-neutrals',\n\n ...focus.css({\n boxShadow: '$focus-small',\n }),\n\n '&:not([aria-disabled=\"true\"])': {\n _hover: {\n background: '$background-primary-subtle-hover',\n color: '$text-primary-hover',\n boxShadow: 'none',\n\n [`${StyledItemCheck}`]: {\n color: '$icon-primary-hover',\n },\n },\n\n '&:active': {\n background: '$background-primary-subtle-active',\n color: '$text-primary-active',\n boxShadow: 'none',\n },\n },\n\n '&:disabled, &[aria-disabled=true], &[data-disabled]': {\n cursor: 'default',\n color: '$text-neutrals-disabled',\n\n [`${StyledItemCheck}`]: {\n color: '$icon-neutrals-disabled',\n },\n },\n\n '&[aria-selected=\"true\"]:not(:disabled,[aria-disabled=true],[data-disabled])':\n {\n color: '$text-primary-selected',\n },\n}\n\nexport const groupLabelStyles = {\n color: '$text-neutrals-subtle',\n padding: '6px $100',\n}\n"],"names":["styled","Primitive","focus"],"mappings":";;;;;;;;AAGa,MAAA,eAAA,GAAkBA,2BAAO,CAAAC,+BAAA,CAAU,IAAM,EAAA;AAAA,EACpD,KAAO,EAAA,eAAA;AACT,CAAC;;ACDM,MAAM,eAAkB,GAAA;AAAA,EAC7B,eAAiB,EAAA,yBAAA;AAAA,EACjB,MAAQ,EAAA,KAAA;AAAA,EACR,KAAO,EAAA,MAAA;AAAA,EACP,MAAQ,EAAA,QAAA;AACV,EAAA;AAEO,MAAM,aAAgB,GAAA;AAAA,EAC3B,eAAiB,EAAA,gCAAA;AAAA,EACjB,YAAc,EAAA,KAAA;AAAA,EACd,SAAW,EAAA,KAAA;AAAA,EACX,QAAU,EAAA,MAAA;AAAA,EACV,UAAY,EAAA,QAAA;AAAA,EACZ,UAAY,EAAA,MAAA;AAAA,EACZ,OAAS,EAAA,KAAA;AAAA,EACT,MAAQ,EAAA,SAAA;AAAA;AAAA,EACR,OAAS,EAAA,uBAAA;AACX,EAAA;AAEO,MAAM,UAAa,GAAA;AAAA,EACxB,GAAK,EAAA,OAAA;AAAA,EACL,QAAU,EAAA,UAAA;AAAA,EACV,OAAS,EAAA,MAAA;AAAA,EACT,mBAAqB,EAAA,UAAA;AAAA,EACrB,MAAQ,EAAA,SAAA;AAAA,EACR,UAAY,EAAA,MAAA;AAAA,EACZ,QAAU,EAAA,MAAA;AAAA,EACV,UAAY,EAAA,MAAA;AAAA,EACZ,SAAW,EAAA,YAAA;AAAA,EACX,OAAS,EAAA,OAAA;AAAA,EACT,aAAe,EAAA,WAAA;AAAA,EACf,YAAc,EAAA,KAAA;AAAA,EACd,KAAO,EAAA,gBAAA;AAAA,EAEP,GAAGC,yBAAM,GAAI,CAAA;AAAA,IACX,SAAW,EAAA,cAAA;AAAA,GACZ,CAAA;AAAA,EAED,+BAAiC,EAAA;AAAA,IAC/B,MAAQ,EAAA;AAAA,MACN,UAAY,EAAA,kCAAA;AAAA,MACZ,KAAO,EAAA,qBAAA;AAAA,MACP,SAAW,EAAA,MAAA;AAAA,MAEX,CAAC,EAAG,CAAA,MAAA,CAAA,eAAA,CAAiB,GAAG;AAAA,QACtB,KAAO,EAAA,qBAAA;AAAA,OACT;AAAA,KACF;AAAA,IAEA,UAAY,EAAA;AAAA,MACV,UAAY,EAAA,mCAAA;AAAA,MACZ,KAAO,EAAA,sBAAA;AAAA,MACP,SAAW,EAAA,MAAA;AAAA,KACb;AAAA,GACF;AAAA,EAEA,qDAAuD,EAAA;AAAA,IACrD,MAAQ,EAAA,SAAA;AAAA,IACR,KAAO,EAAA,yBAAA;AAAA,IAEP,CAAC,EAAG,CAAA,MAAA,CAAA,eAAA,CAAiB,GAAG;AAAA,MACtB,KAAO,EAAA,yBAAA;AAAA,KACT;AAAA,GACF;AAAA,EAEA,6EACE,EAAA;AAAA,IACE,KAAO,EAAA,wBAAA;AAAA,GACT;AACJ,EAAA;AAEO,MAAM,gBAAmB,GAAA;AAAA,EAC9B,KAAO,EAAA,uBAAA;AAAA,EACP,OAAS,EAAA,UAAA;AACX;;;;;;;;"}
|
package/dist/module.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"module.js","sources":["../src/item-check.styled.ts","../src/styles.ts"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledItemCheck = styled(Primitive.span, {\n color: '$icon-primary',\n})\n","import
|
|
1
|
+
{"version":3,"file":"module.js","sources":["../src/item-check.styled.ts","../src/styles.ts"],"sourcesContent":["import { styled } from '@mirohq/design-system-stitches'\nimport { Primitive } from '@mirohq/design-system-primitive'\n\nexport const StyledItemCheck = styled(Primitive.span, {\n color: '$icon-primary',\n})\n","import { focus } from '@mirohq/design-system-styles'\n\nimport { StyledItemCheck } from './item-check.styled'\n\nexport const separatorStyles = {\n backgroundColor: '$border-neutrals-subtle',\n height: '1px',\n width: '100%',\n margin: '$100 0',\n}\n\nexport const contentStyles = {\n backgroundColor: '$background-neutrals-container',\n borderRadius: '$50',\n boxShadow: '$50',\n fontSize: '$175',\n fontWeight: 'normal',\n lineHeight: '20px',\n padding: '$50',\n zIndex: '$select', // this z-index will be applied to an absolute positioned container\n outline: '1px solid transparent',\n}\n\nexport const itemStyles = {\n all: 'unset',\n position: 'relative',\n display: 'grid',\n gridTemplateColumns: '20px 1fr',\n cursor: 'pointer',\n userSelect: 'none',\n fontSize: '$175',\n lineHeight: '20px',\n boxSizing: 'border-box',\n padding: '6px 0',\n paddingInline: '$150 $100',\n borderRadius: '$50',\n color: '$text-neutrals',\n\n ...focus.css({\n boxShadow: '$focus-small',\n }),\n\n '&:not([aria-disabled=\"true\"])': {\n _hover: {\n background: '$background-primary-subtle-hover',\n color: '$text-primary-hover',\n boxShadow: 'none',\n\n [`${StyledItemCheck}`]: {\n color: '$icon-primary-hover',\n },\n },\n\n '&:active': {\n background: '$background-primary-subtle-active',\n color: '$text-primary-active',\n boxShadow: 'none',\n },\n },\n\n '&:disabled, &[aria-disabled=true], &[data-disabled]': {\n cursor: 'default',\n color: '$text-neutrals-disabled',\n\n [`${StyledItemCheck}`]: {\n color: '$icon-neutrals-disabled',\n },\n },\n\n '&[aria-selected=\"true\"]:not(:disabled,[aria-disabled=true],[data-disabled])':\n {\n color: '$text-primary-selected',\n },\n}\n\nexport const groupLabelStyles = {\n color: '$text-neutrals-subtle',\n padding: '6px $100',\n}\n"],"names":[],"mappings":";;;;AAGa,MAAA,eAAA,GAAkB,MAAO,CAAA,SAAA,CAAU,IAAM,EAAA;AAAA,EACpD,KAAO,EAAA,eAAA;AACT,CAAC;;ACDM,MAAM,eAAkB,GAAA;AAAA,EAC7B,eAAiB,EAAA,yBAAA;AAAA,EACjB,MAAQ,EAAA,KAAA;AAAA,EACR,KAAO,EAAA,MAAA;AAAA,EACP,MAAQ,EAAA,QAAA;AACV,EAAA;AAEO,MAAM,aAAgB,GAAA;AAAA,EAC3B,eAAiB,EAAA,gCAAA;AAAA,EACjB,YAAc,EAAA,KAAA;AAAA,EACd,SAAW,EAAA,KAAA;AAAA,EACX,QAAU,EAAA,MAAA;AAAA,EACV,UAAY,EAAA,QAAA;AAAA,EACZ,UAAY,EAAA,MAAA;AAAA,EACZ,OAAS,EAAA,KAAA;AAAA,EACT,MAAQ,EAAA,SAAA;AAAA;AAAA,EACR,OAAS,EAAA,uBAAA;AACX,EAAA;AAEO,MAAM,UAAa,GAAA;AAAA,EACxB,GAAK,EAAA,OAAA;AAAA,EACL,QAAU,EAAA,UAAA;AAAA,EACV,OAAS,EAAA,MAAA;AAAA,EACT,mBAAqB,EAAA,UAAA;AAAA,EACrB,MAAQ,EAAA,SAAA;AAAA,EACR,UAAY,EAAA,MAAA;AAAA,EACZ,QAAU,EAAA,MAAA;AAAA,EACV,UAAY,EAAA,MAAA;AAAA,EACZ,SAAW,EAAA,YAAA;AAAA,EACX,OAAS,EAAA,OAAA;AAAA,EACT,aAAe,EAAA,WAAA;AAAA,EACf,YAAc,EAAA,KAAA;AAAA,EACd,KAAO,EAAA,gBAAA;AAAA,EAEP,GAAG,MAAM,GAAI,CAAA;AAAA,IACX,SAAW,EAAA,cAAA;AAAA,GACZ,CAAA;AAAA,EAED,+BAAiC,EAAA;AAAA,IAC/B,MAAQ,EAAA;AAAA,MACN,UAAY,EAAA,kCAAA;AAAA,MACZ,KAAO,EAAA,qBAAA;AAAA,MACP,SAAW,EAAA,MAAA;AAAA,MAEX,CAAC,EAAG,CAAA,MAAA,CAAA,eAAA,CAAiB,GAAG;AAAA,QACtB,KAAO,EAAA,qBAAA;AAAA,OACT;AAAA,KACF;AAAA,IAEA,UAAY,EAAA;AAAA,MACV,UAAY,EAAA,mCAAA;AAAA,MACZ,KAAO,EAAA,sBAAA;AAAA,MACP,SAAW,EAAA,MAAA;AAAA,KACb;AAAA,GACF;AAAA,EAEA,qDAAuD,EAAA;AAAA,IACrD,MAAQ,EAAA,SAAA;AAAA,IACR,KAAO,EAAA,yBAAA;AAAA,IAEP,CAAC,EAAG,CAAA,MAAA,CAAA,eAAA,CAAiB,GAAG;AAAA,MACtB,KAAO,EAAA,yBAAA;AAAA,KACT;AAAA,GACF;AAAA,EAEA,6EACE,EAAA;AAAA,IACE,KAAO,EAAA,wBAAA;AAAA,GACT;AACJ,EAAA;AAEO,MAAM,gBAAmB,GAAA;AAAA,EAC9B,KAAO,EAAA,uBAAA;AAAA,EACP,OAAS,EAAA,UAAA;AACX;;;;"}
|
package/dist/types.d.ts
CHANGED
|
@@ -1,13 +1,73 @@
|
|
|
1
|
-
import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
|
|
2
|
-
import { CSS } from '@mirohq/design-system-stitches';
|
|
3
1
|
import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
|
|
2
|
+
import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
|
|
4
3
|
import * as react from 'react';
|
|
5
4
|
import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
|
|
6
5
|
|
|
7
|
-
declare const separatorStyles:
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
declare const separatorStyles: {
|
|
7
|
+
backgroundColor: string;
|
|
8
|
+
height: string;
|
|
9
|
+
width: string;
|
|
10
|
+
margin: string;
|
|
11
|
+
};
|
|
12
|
+
declare const contentStyles: {
|
|
13
|
+
backgroundColor: string;
|
|
14
|
+
borderRadius: string;
|
|
15
|
+
boxShadow: string;
|
|
16
|
+
fontSize: string;
|
|
17
|
+
fontWeight: string;
|
|
18
|
+
lineHeight: string;
|
|
19
|
+
padding: string;
|
|
20
|
+
zIndex: string;
|
|
21
|
+
outline: string;
|
|
22
|
+
};
|
|
23
|
+
declare const itemStyles: {
|
|
24
|
+
'&:not([aria-disabled="true"])': {
|
|
25
|
+
_hover: {
|
|
26
|
+
[x: string]: string | {
|
|
27
|
+
color: string;
|
|
28
|
+
};
|
|
29
|
+
background: string;
|
|
30
|
+
color: string;
|
|
31
|
+
boxShadow: string;
|
|
32
|
+
};
|
|
33
|
+
'&:active': {
|
|
34
|
+
background: string;
|
|
35
|
+
color: string;
|
|
36
|
+
boxShadow: string;
|
|
37
|
+
};
|
|
38
|
+
};
|
|
39
|
+
'&:disabled, &[aria-disabled=true], &[data-disabled]': {
|
|
40
|
+
[x: string]: string | {
|
|
41
|
+
color: string;
|
|
42
|
+
};
|
|
43
|
+
cursor: string;
|
|
44
|
+
color: string;
|
|
45
|
+
};
|
|
46
|
+
'&[aria-selected="true"]:not(:disabled,[aria-disabled=true],[data-disabled])': {
|
|
47
|
+
color: string;
|
|
48
|
+
};
|
|
49
|
+
'&:focus-visible': any;
|
|
50
|
+
'[data-whatintent="keyboard"] &:focus': any;
|
|
51
|
+
'&[data-focused]': any;
|
|
52
|
+
'&[data-focus-visible]': any;
|
|
53
|
+
all: string;
|
|
54
|
+
position: string;
|
|
55
|
+
display: string;
|
|
56
|
+
gridTemplateColumns: string;
|
|
57
|
+
cursor: string;
|
|
58
|
+
userSelect: string;
|
|
59
|
+
fontSize: string;
|
|
60
|
+
lineHeight: string;
|
|
61
|
+
boxSizing: string;
|
|
62
|
+
padding: string;
|
|
63
|
+
paddingInline: string;
|
|
64
|
+
borderRadius: string;
|
|
65
|
+
color: string;
|
|
66
|
+
};
|
|
67
|
+
declare const groupLabelStyles: {
|
|
68
|
+
color: string;
|
|
69
|
+
padding: string;
|
|
70
|
+
};
|
|
11
71
|
|
|
12
72
|
declare const StyledItemCheck: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"span">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLSpanElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"span">>, {}, {}>;
|
|
13
73
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mirohq/design-system-base-select",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "Miro",
|
|
6
6
|
"source": "src/index.ts",
|
|
@@ -27,8 +27,8 @@
|
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
29
|
"@mirohq/design-system-primitive": "^1.1.2",
|
|
30
|
-
"@mirohq/design-system-stitches": "^2.6.
|
|
31
|
-
"@mirohq/design-system-styles": "^1.2.
|
|
30
|
+
"@mirohq/design-system-stitches": "^2.6.12",
|
|
31
|
+
"@mirohq/design-system-styles": "^1.2.12"
|
|
32
32
|
},
|
|
33
33
|
"scripts": {
|
|
34
34
|
"build": "rollup -c ../../../../rollup.config.js",
|