@mirohq/design-system-base-text-field 0.1.0

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 (6) hide show
  1. package/dist/main.js +74 -0
  2. package/dist/main.js.map +1 -0
  3. package/dist/module.js +70 -0
  4. package/dist/module.js.map +1 -0
  5. package/dist/types.d.ts +69 -0
  6. package/package.json +33 -0
package/dist/main.js ADDED
@@ -0,0 +1,74 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const styles = {
6
+ variants: {
7
+ idle: {
8
+ background: "$background-neutrals-container",
9
+ border: "1px solid $border-neutrals",
10
+ borderRadius: "$50",
11
+ fontSize: "$200",
12
+ lineHeight: "1.5"
13
+ },
14
+ focused: {
15
+ boxShadow: "$focus-controls",
16
+ borderColor: "$border-neutrals",
17
+ "@media (forced-colors: active)": {
18
+ outline: "Highlight solid"
19
+ }
20
+ },
21
+ hovered: {
22
+ borderColor: "$border-primary-hover"
23
+ },
24
+ readOnly: {
25
+ background: "$background-neutrals-disabled",
26
+ color: "$text-neutrals-subtle"
27
+ },
28
+ disabled: {
29
+ background: "$background-neutrals-disabled"
30
+ },
31
+ invalid: {
32
+ idle: {
33
+ borderColor: "$border-danger"
34
+ },
35
+ focused: {
36
+ borderColor: "$border-danger",
37
+ boxShadow: "$focus-controls-error"
38
+ },
39
+ hovered: {
40
+ borderColor: "$border-danger-hover"
41
+ }
42
+ },
43
+ valid: {
44
+ idle: {
45
+ borderColor: "$border-success"
46
+ },
47
+ focused: {
48
+ borderColor: "$border-success",
49
+ boxShadow: "$focus-controls-success"
50
+ },
51
+ hovered: {
52
+ borderColor: "$border-success-hover"
53
+ }
54
+ }
55
+ },
56
+ base: {
57
+ placeholder: {
58
+ color: "$text-neutrals-subtle"
59
+ },
60
+ disabled: {
61
+ caretColor: "transparent",
62
+ "&, &::placeholder": {
63
+ color: "$text-neutrals-disabled",
64
+ "-webkit-text-fill-color": "$colors$text-neutrals-disabled"
65
+ },
66
+ "&:selection": {
67
+ background: "transparent"
68
+ }
69
+ }
70
+ }
71
+ };
72
+
73
+ exports.styles = styles;
74
+ //# sourceMappingURL=main.js.map
package/dist/main.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"main.js","sources":["../src/styles.ts"],"sourcesContent":["export const styles = {\n variants: {\n idle: {\n background: '$background-neutrals-container',\n border: '1px solid $border-neutrals',\n borderRadius: '$50',\n fontSize: '$200',\n lineHeight: '1.5',\n },\n focused: {\n boxShadow: '$focus-controls',\n borderColor: '$border-neutrals',\n\n '@media (forced-colors: active)': {\n outline: 'Highlight solid',\n },\n },\n hovered: {\n borderColor: '$border-primary-hover',\n },\n readOnly: {\n background: '$background-neutrals-disabled',\n color: '$text-neutrals-subtle',\n },\n disabled: {\n background: '$background-neutrals-disabled',\n },\n invalid: {\n idle: {\n borderColor: '$border-danger',\n },\n focused: {\n borderColor: '$border-danger',\n boxShadow: '$focus-controls-error',\n },\n hovered: {\n borderColor: '$border-danger-hover',\n },\n },\n valid: {\n idle: {\n borderColor: '$border-success',\n },\n focused: {\n borderColor: '$border-success',\n boxShadow: '$focus-controls-success',\n },\n hovered: {\n borderColor: '$border-success-hover',\n },\n },\n },\n base: {\n placeholder: {\n color: '$text-neutrals-subtle',\n },\n disabled: {\n caretColor: 'transparent',\n '&, &::placeholder': {\n color: '$text-neutrals-disabled',\n '-webkit-text-fill-color': '$colors$text-neutrals-disabled',\n },\n '&:selection': {\n background: 'transparent',\n },\n },\n },\n}\n"],"names":[],"mappings":";;;;AAAO,MAAM,MAAS,GAAA;AAAA,EACpB,QAAU,EAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,UAAY,EAAA,gCAAA;AAAA,MACZ,MAAQ,EAAA,4BAAA;AAAA,MACR,YAAc,EAAA,KAAA;AAAA,MACd,QAAU,EAAA,MAAA;AAAA,MACV,UAAY,EAAA,KAAA;AAAA,KACd;AAAA,IACA,OAAS,EAAA;AAAA,MACP,SAAW,EAAA,iBAAA;AAAA,MACX,WAAa,EAAA,kBAAA;AAAA,MAEb,gCAAkC,EAAA;AAAA,QAChC,OAAS,EAAA,iBAAA;AAAA,OACX;AAAA,KACF;AAAA,IACA,OAAS,EAAA;AAAA,MACP,WAAa,EAAA,uBAAA;AAAA,KACf;AAAA,IACA,QAAU,EAAA;AAAA,MACR,UAAY,EAAA,+BAAA;AAAA,MACZ,KAAO,EAAA,uBAAA;AAAA,KACT;AAAA,IACA,QAAU,EAAA;AAAA,MACR,UAAY,EAAA,+BAAA;AAAA,KACd;AAAA,IACA,OAAS,EAAA;AAAA,MACP,IAAM,EAAA;AAAA,QACJ,WAAa,EAAA,gBAAA;AAAA,OACf;AAAA,MACA,OAAS,EAAA;AAAA,QACP,WAAa,EAAA,gBAAA;AAAA,QACb,SAAW,EAAA,uBAAA;AAAA,OACb;AAAA,MACA,OAAS,EAAA;AAAA,QACP,WAAa,EAAA,sBAAA;AAAA,OACf;AAAA,KACF;AAAA,IACA,KAAO,EAAA;AAAA,MACL,IAAM,EAAA;AAAA,QACJ,WAAa,EAAA,iBAAA;AAAA,OACf;AAAA,MACA,OAAS,EAAA;AAAA,QACP,WAAa,EAAA,iBAAA;AAAA,QACb,SAAW,EAAA,yBAAA;AAAA,OACb;AAAA,MACA,OAAS,EAAA;AAAA,QACP,WAAa,EAAA,uBAAA;AAAA,OACf;AAAA,KACF;AAAA,GACF;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,WAAa,EAAA;AAAA,MACX,KAAO,EAAA,uBAAA;AAAA,KACT;AAAA,IACA,QAAU,EAAA;AAAA,MACR,UAAY,EAAA,aAAA;AAAA,MACZ,mBAAqB,EAAA;AAAA,QACnB,KAAO,EAAA,yBAAA;AAAA,QACP,yBAA2B,EAAA,gCAAA;AAAA,OAC7B;AAAA,MACA,aAAe,EAAA;AAAA,QACb,UAAY,EAAA,aAAA;AAAA,OACd;AAAA,KACF;AAAA,GACF;AACF;;;;"}
package/dist/module.js ADDED
@@ -0,0 +1,70 @@
1
+ const styles = {
2
+ variants: {
3
+ idle: {
4
+ background: "$background-neutrals-container",
5
+ border: "1px solid $border-neutrals",
6
+ borderRadius: "$50",
7
+ fontSize: "$200",
8
+ lineHeight: "1.5"
9
+ },
10
+ focused: {
11
+ boxShadow: "$focus-controls",
12
+ borderColor: "$border-neutrals",
13
+ "@media (forced-colors: active)": {
14
+ outline: "Highlight solid"
15
+ }
16
+ },
17
+ hovered: {
18
+ borderColor: "$border-primary-hover"
19
+ },
20
+ readOnly: {
21
+ background: "$background-neutrals-disabled",
22
+ color: "$text-neutrals-subtle"
23
+ },
24
+ disabled: {
25
+ background: "$background-neutrals-disabled"
26
+ },
27
+ invalid: {
28
+ idle: {
29
+ borderColor: "$border-danger"
30
+ },
31
+ focused: {
32
+ borderColor: "$border-danger",
33
+ boxShadow: "$focus-controls-error"
34
+ },
35
+ hovered: {
36
+ borderColor: "$border-danger-hover"
37
+ }
38
+ },
39
+ valid: {
40
+ idle: {
41
+ borderColor: "$border-success"
42
+ },
43
+ focused: {
44
+ borderColor: "$border-success",
45
+ boxShadow: "$focus-controls-success"
46
+ },
47
+ hovered: {
48
+ borderColor: "$border-success-hover"
49
+ }
50
+ }
51
+ },
52
+ base: {
53
+ placeholder: {
54
+ color: "$text-neutrals-subtle"
55
+ },
56
+ disabled: {
57
+ caretColor: "transparent",
58
+ "&, &::placeholder": {
59
+ color: "$text-neutrals-disabled",
60
+ "-webkit-text-fill-color": "$colors$text-neutrals-disabled"
61
+ },
62
+ "&:selection": {
63
+ background: "transparent"
64
+ }
65
+ }
66
+ }
67
+ };
68
+
69
+ export { styles };
70
+ //# sourceMappingURL=module.js.map
package/dist/module.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"module.js","sources":["../src/styles.ts"],"sourcesContent":["export const styles = {\n variants: {\n idle: {\n background: '$background-neutrals-container',\n border: '1px solid $border-neutrals',\n borderRadius: '$50',\n fontSize: '$200',\n lineHeight: '1.5',\n },\n focused: {\n boxShadow: '$focus-controls',\n borderColor: '$border-neutrals',\n\n '@media (forced-colors: active)': {\n outline: 'Highlight solid',\n },\n },\n hovered: {\n borderColor: '$border-primary-hover',\n },\n readOnly: {\n background: '$background-neutrals-disabled',\n color: '$text-neutrals-subtle',\n },\n disabled: {\n background: '$background-neutrals-disabled',\n },\n invalid: {\n idle: {\n borderColor: '$border-danger',\n },\n focused: {\n borderColor: '$border-danger',\n boxShadow: '$focus-controls-error',\n },\n hovered: {\n borderColor: '$border-danger-hover',\n },\n },\n valid: {\n idle: {\n borderColor: '$border-success',\n },\n focused: {\n borderColor: '$border-success',\n boxShadow: '$focus-controls-success',\n },\n hovered: {\n borderColor: '$border-success-hover',\n },\n },\n },\n base: {\n placeholder: {\n color: '$text-neutrals-subtle',\n },\n disabled: {\n caretColor: 'transparent',\n '&, &::placeholder': {\n color: '$text-neutrals-disabled',\n '-webkit-text-fill-color': '$colors$text-neutrals-disabled',\n },\n '&:selection': {\n background: 'transparent',\n },\n },\n },\n}\n"],"names":[],"mappings":"AAAO,MAAM,MAAS,GAAA;AAAA,EACpB,QAAU,EAAA;AAAA,IACR,IAAM,EAAA;AAAA,MACJ,UAAY,EAAA,gCAAA;AAAA,MACZ,MAAQ,EAAA,4BAAA;AAAA,MACR,YAAc,EAAA,KAAA;AAAA,MACd,QAAU,EAAA,MAAA;AAAA,MACV,UAAY,EAAA,KAAA;AAAA,KACd;AAAA,IACA,OAAS,EAAA;AAAA,MACP,SAAW,EAAA,iBAAA;AAAA,MACX,WAAa,EAAA,kBAAA;AAAA,MAEb,gCAAkC,EAAA;AAAA,QAChC,OAAS,EAAA,iBAAA;AAAA,OACX;AAAA,KACF;AAAA,IACA,OAAS,EAAA;AAAA,MACP,WAAa,EAAA,uBAAA;AAAA,KACf;AAAA,IACA,QAAU,EAAA;AAAA,MACR,UAAY,EAAA,+BAAA;AAAA,MACZ,KAAO,EAAA,uBAAA;AAAA,KACT;AAAA,IACA,QAAU,EAAA;AAAA,MACR,UAAY,EAAA,+BAAA;AAAA,KACd;AAAA,IACA,OAAS,EAAA;AAAA,MACP,IAAM,EAAA;AAAA,QACJ,WAAa,EAAA,gBAAA;AAAA,OACf;AAAA,MACA,OAAS,EAAA;AAAA,QACP,WAAa,EAAA,gBAAA;AAAA,QACb,SAAW,EAAA,uBAAA;AAAA,OACb;AAAA,MACA,OAAS,EAAA;AAAA,QACP,WAAa,EAAA,sBAAA;AAAA,OACf;AAAA,KACF;AAAA,IACA,KAAO,EAAA;AAAA,MACL,IAAM,EAAA;AAAA,QACJ,WAAa,EAAA,iBAAA;AAAA,OACf;AAAA,MACA,OAAS,EAAA;AAAA,QACP,WAAa,EAAA,iBAAA;AAAA,QACb,SAAW,EAAA,yBAAA;AAAA,OACb;AAAA,MACA,OAAS,EAAA;AAAA,QACP,WAAa,EAAA,uBAAA;AAAA,OACf;AAAA,KACF;AAAA,GACF;AAAA,EACA,IAAM,EAAA;AAAA,IACJ,WAAa,EAAA;AAAA,MACX,KAAO,EAAA,uBAAA;AAAA,KACT;AAAA,IACA,QAAU,EAAA;AAAA,MACR,UAAY,EAAA,aAAA;AAAA,MACZ,mBAAqB,EAAA;AAAA,QACnB,KAAO,EAAA,yBAAA;AAAA,QACP,yBAA2B,EAAA,gCAAA;AAAA,OAC7B;AAAA,MACA,aAAe,EAAA;AAAA,QACb,UAAY,EAAA,aAAA;AAAA,OACd;AAAA,KACF;AAAA,GACF;AACF;;;;"}
package/dist/types.d.ts ADDED
@@ -0,0 +1,69 @@
1
+ declare const styles: {
2
+ variants: {
3
+ idle: {
4
+ background: string;
5
+ border: string;
6
+ borderRadius: string;
7
+ fontSize: string;
8
+ lineHeight: string;
9
+ };
10
+ focused: {
11
+ boxShadow: string;
12
+ borderColor: string;
13
+ '@media (forced-colors: active)': {
14
+ outline: string;
15
+ };
16
+ };
17
+ hovered: {
18
+ borderColor: string;
19
+ };
20
+ readOnly: {
21
+ background: string;
22
+ color: string;
23
+ };
24
+ disabled: {
25
+ background: string;
26
+ };
27
+ invalid: {
28
+ idle: {
29
+ borderColor: string;
30
+ };
31
+ focused: {
32
+ borderColor: string;
33
+ boxShadow: string;
34
+ };
35
+ hovered: {
36
+ borderColor: string;
37
+ };
38
+ };
39
+ valid: {
40
+ idle: {
41
+ borderColor: string;
42
+ };
43
+ focused: {
44
+ borderColor: string;
45
+ boxShadow: string;
46
+ };
47
+ hovered: {
48
+ borderColor: string;
49
+ };
50
+ };
51
+ };
52
+ base: {
53
+ placeholder: {
54
+ color: string;
55
+ };
56
+ disabled: {
57
+ caretColor: string;
58
+ '&, &::placeholder': {
59
+ color: string;
60
+ '-webkit-text-fill-color': string;
61
+ };
62
+ '&:selection': {
63
+ background: string;
64
+ };
65
+ };
66
+ };
67
+ };
68
+
69
+ export { styles };
package/package.json ADDED
@@ -0,0 +1,33 @@
1
+ {
2
+ "name": "@mirohq/design-system-base-text-field",
3
+ "version": "0.1.0",
4
+ "description": "",
5
+ "author": "Miro",
6
+ "source": "src/index.ts",
7
+ "main": "dist/main.js",
8
+ "module": "dist/module.js",
9
+ "types": "dist/types.d.ts",
10
+ "sideEffects": false,
11
+ "exports": {
12
+ ".": {
13
+ "require": "./dist/main.js",
14
+ "import": "./dist/module.js",
15
+ "types": "./dist/types.d.ts"
16
+ }
17
+ },
18
+ "files": [
19
+ "dist"
20
+ ],
21
+ "publishConfig": {
22
+ "access": "public"
23
+ },
24
+ "peerDependencies": {
25
+ "@stitches/react": "^1.2.8",
26
+ "react": "^16.14 || ^17 || ^18"
27
+ },
28
+ "scripts": {
29
+ "build": "rollup -c ../../../../rollup.config.js",
30
+ "clean": "rm -rf dist",
31
+ "prebuild": "pnpm clean"
32
+ }
33
+ }