@terraware/web-components 3.9.11 → 3.9.12

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 (28) hide show
  1. package/components/AntSwitch/styles.scss +3 -3
  2. package/components/Autocomplete/styles.scss +52 -52
  3. package/components/Button/styles.scss +141 -141
  4. package/components/DatePicker/styles.scss +31 -31
  5. package/components/DialogBox/styles.scss +35 -35
  6. package/components/EditableTable/index.d.ts +86 -0
  7. package/components/EditableTable/index.d.ts.map +1 -0
  8. package/components/EditableTable/index.js +179 -0
  9. package/components/ErrorBox/styles.scss +16 -16
  10. package/components/Icon/styles.scss +9 -9
  11. package/components/Map/styles.scss +20 -20
  12. package/components/Markdown/styles.scss +37 -37
  13. package/components/Message/styles.scss +63 -63
  14. package/components/MultiSelect/styles.scss +66 -66
  15. package/components/Navbar/styles.scss +39 -39
  16. package/components/Pill/styles.scss +10 -10
  17. package/components/PillList/styles.scss +2 -2
  18. package/components/PopoverMultiSelect/styles.scss +4 -4
  19. package/components/ProgressCircle/styles.scss +24 -24
  20. package/components/Select/styles.scss +107 -107
  21. package/components/Textfield/styles.scss +108 -108
  22. package/components/TimelineSlider/styles.scss +18 -18
  23. package/components/ViewPhotosDialog/styles.scss +3 -3
  24. package/license-report.html +1 -1
  25. package/package.json +2 -1
  26. package/stories/EditableTable.stories.d.ts +14 -0
  27. package/stories/EditableTable.stories.d.ts.map +1 -0
  28. package/style-dictionary-dist/terraware.scss +2 -1
package/components/AntSwitch/styles.scss CHANGED
@@ -1,4 +1,4 @@
1
- @import '../../style-dictionary-dist/terraware.scss';
1
+ @use '../../style-dictionary-dist/terraware.scss';
2
2
 
3
3
  .ant-switch {
4
4
  width: 28px;
@@ -55,11 +55,11 @@
55
55
  }
56
56
 
57
57
  .Mui-disabled {
58
- opacity: $tw-opcty-semantic-off;
58
+ opacity: terraware.$tw-opcty-semantic-off;
59
59
 
60
60
  &.Mui-checked {
61
61
  + .MuiSwitch-track {
62
- opacity: $tw-opcty-semantic-off;
62
+ opacity: terraware.$tw-opcty-semantic-off;
63
63
  }
64
64
  }
65
65
  }
package/components/Autocomplete/styles.scss CHANGED
@@ -1,4 +1,4 @@
1
- @import '../../style-dictionary-dist/terraware.scss';
1
+ @use '../../style-dictionary-dist/terraware.scss';
2
2
 
3
3
  @font-face {
4
4
  font-family: 'Inter';
@@ -10,38 +10,38 @@
10
10
  flex-flow: row wrap;
11
11
 
12
12
  .textfield-label {
13
- font-family: $tw-fnt-frm-fld-label-font-family;
14
- font-size: $tw-fnt-frm-fld-label-font-size;
15
- font-weight: $tw-fnt-frm-fld-label-font-weight;
16
- line-height: $tw-fnt-frm-fld-label-line-height;
17
- color: $tw-clr-txt-secondary;
18
- margin-bottom: $tw-spc-base-xx-small;
13
+ font-family: terraware.$tw-fnt-frm-fld-label-font-family;
14
+ font-size: terraware.$tw-fnt-frm-fld-label-font-size;
15
+ font-weight: terraware.$tw-fnt-frm-fld-label-font-weight;
16
+ line-height: terraware.$tw-fnt-frm-fld-label-line-height;
17
+ color: terraware.$tw-clr-txt-secondary;
18
+ margin-bottom: terraware.$tw-spc-base-xx-small;
19
19
  display: block;
20
20
  width: 100%;
21
21
  max-width: 100%;
22
22
  }
23
23
 
24
24
  .MuiInputBase-root {
25
- border: 1px solid $tw-clr-brdr-secondary;
26
- border-radius: $tw-spc-base-x-small;
25
+ border: 1px solid terraware.$tw-clr-brdr-secondary;
26
+ border-radius: terraware.$tw-spc-base-x-small;
27
27
  position: unset;
28
28
  padding: 0;
29
29
  }
30
30
 
31
31
  .Mui-disabled {
32
- border-color: $tw-clr-brdr-secondary;
32
+ border-color: terraware.$tw-clr-brdr-secondary;
33
33
  font-weight: 500;
34
- opacity: $tw-opcty-semantic-off;
35
- color: $tw-clr-txt;
34
+ opacity: terraware.$tw-opcty-semantic-off;
35
+ color: terraware.$tw-clr-txt;
36
36
 
37
37
  ::placeholder {
38
- color: $tw-clr-txt;
38
+ color: terraware.$tw-clr-txt;
39
39
  opacity: 1;
40
40
  }
41
41
  }
42
42
 
43
43
  input {
44
- padding: calc(#{$tw-spc-base-xx-small} * 2.5) calc(#{$tw-spc-base-xx-small} * 3);
44
+ padding: calc(#{terraware.$tw-spc-base-xx-small} * 2.5) calc(#{terraware.$tw-spc-base-xx-small} * 3);
45
45
  }
46
46
 
47
47
  & .MuiInputBase-input {
@@ -49,55 +49,55 @@
49
49
  }
50
50
  & .MuiOutlinedInput-root {
51
51
  fieldset {
52
- border-color: $tw-clr-brdr-secondary;
52
+ border-color: terraware.$tw-clr-brdr-secondary;
53
53
  }
54
54
 
55
55
  &:hover fieldset {
56
- border-color: $tw-clr-brdr-hover;
56
+ border-color: terraware.$tw-clr-brdr-hover;
57
57
  }
58
58
  .Mui-focused fieldset {
59
- border-color: $tw-clr-brdr-hover;
59
+ border-color: terraware.$tw-clr-brdr-hover;
60
60
  }
61
61
  }
62
62
 
63
63
  &--icon-right {
64
- width: $tw-fnt-frm-fld-text-value-line-height;
65
- height: $tw-fnt-frm-fld-text-value-line-height;
66
- fill: $tw-clr-icn;
67
- margin-left: $tw-spc-base-x-small;
64
+ width: terraware.$tw-fnt-frm-fld-text-value-line-height;
65
+ height: terraware.$tw-fnt-frm-fld-text-value-line-height;
66
+ fill: terraware.$tw-clr-icn;
67
+ margin-left: terraware.$tw-spc-base-x-small;
68
68
  }
69
69
 
70
70
  &.select {
71
71
  .options-container {
72
72
  top: 0;
73
- margin-top: $tw-spc-base-x-small;
73
+ margin-top: terraware.$tw-spc-base-x-small;
74
74
 
75
75
  .MuiAutocomplete-option {
76
- font-family: $tw-fnt-frm-fld-select-value-font-family;
77
- font-size: $tw-fnt-frm-fld-select-value-font-size;
78
- font-weight: $tw-fnt-frm-fld-select-value-font-weight;
79
- line-height: $tw-fnt-frm-fld-select-value-line-height;
80
- padding: $tw-spc-base-x-small $tw-spc-base-small;
76
+ font-family: terraware.$tw-fnt-frm-fld-select-value-font-family;
77
+ font-size: terraware.$tw-fnt-frm-fld-select-value-font-size;
78
+ font-weight: terraware.$tw-fnt-frm-fld-select-value-font-weight;
79
+ line-height: terraware.$tw-fnt-frm-fld-select-value-line-height;
80
+ padding: terraware.$tw-spc-base-x-small terraware.$tw-spc-base-small;
81
81
  cursor: pointer;
82
82
 
83
83
  &:hover {
84
- background-color: $tw-clr-bg-selected-ghost-hover;
85
- color: $tw-clr-txt;
84
+ background-color: terraware.$tw-clr-bg-selected-ghost-hover;
85
+ color: terraware.$tw-clr-txt;
86
86
  }
87
87
 
88
88
  &:active {
89
- background-color: $tw-clr-bg-selected-ghost-active;
90
- color: $tw-clr-txt;
89
+ background-color: terraware.$tw-clr-bg-selected-ghost-active;
90
+ color: terraware.$tw-clr-txt;
91
91
  }
92
92
 
93
93
  &[aria-selected='true'],
94
94
  &[aria-selected='true']:hover {
95
- background-color: $tw-clr-bg-selected;
96
- color: $tw-clr-txt-on-selected;
95
+ background-color: terraware.$tw-clr-bg-selected;
96
+ color: terraware.$tw-clr-txt-on-selected;
97
97
  }
98
98
 
99
99
  &:disabled {
100
- opacity: $tw-opcty-semantic-off;
100
+ opacity: terraware.$tw-opcty-semantic-off;
101
101
  }
102
102
  }
103
103
  }
@@ -106,24 +106,24 @@
106
106
  .textfield-label-container {
107
107
  display: flex;
108
108
  width: 100%;
109
- margin-top: $tw-spc-base-xx-small;
109
+ margin-top: terraware.$tw-spc-base-xx-small;
110
110
  }
111
111
 
112
112
  .textfield-error-text {
113
- font-family: $tw-fnt-frm-fld-error-text-font-family;
114
- font-size: $tw-fnt-frm-fld-error-text-font-size;
115
- font-weight: $tw-fnt-frm-fld-error-text-font-weight;
116
- line-height: $tw-fnt-frm-fld-error-text-line-height;
117
- color: $tw-clr-txt-danger;
113
+ font-family: terraware.$tw-fnt-frm-fld-error-text-font-family;
114
+ font-size: terraware.$tw-fnt-frm-fld-error-text-font-size;
115
+ font-weight: terraware.$tw-fnt-frm-fld-error-text-font-weight;
116
+ line-height: terraware.$tw-fnt-frm-fld-error-text-line-height;
117
+ color: terraware.$tw-clr-txt-danger;
118
118
  display: block;
119
119
  width: 100%;
120
120
  max-width: 100%;
121
121
 
122
122
  &--icon {
123
- fill: $tw-clr-icn-danger;
124
- width: $tw-fnt-frm-fld-error-text-line-height;
125
- height: $tw-fnt-frm-fld-error-text-line-height;
126
- margin-right: $tw-spc-base-x-small;
123
+ fill: terraware.$tw-clr-icn-danger;
124
+ width: terraware.$tw-fnt-frm-fld-error-text-line-height;
125
+ height: terraware.$tw-fnt-frm-fld-error-text-line-height;
126
+ margin-right: terraware.$tw-spc-base-x-small;
127
127
  }
128
128
  }
129
129
 
@@ -132,24 +132,24 @@
132
132
  border: none;
133
133
  }
134
134
  .MuiOutlinedInput-root {
135
- border: $tw-sz-frm-fld-text-input-stroke solid $tw-clr-brdr-danger;
135
+ border: terraware.$tw-sz-frm-fld-text-input-stroke solid terraware.$tw-clr-brdr-danger;
136
136
  &:hover fieldset {
137
- border: $tw-sz-frm-fld-text-input-stroke solid $tw-clr-brdr-danger-hover;
137
+ border: terraware.$tw-sz-frm-fld-text-input-stroke solid terraware.$tw-clr-brdr-danger-hover;
138
138
  }
139
139
  &.Mui-focused fieldset.MuiOutlinedInput-notchedOutline {
140
- border: $tw-sz-frm-fld-text-input-stroke solid $tw-clr-brdr-danger-active;
140
+ border: terraware.$tw-sz-frm-fld-text-input-stroke solid terraware.$tw-clr-brdr-danger-active;
141
141
  }
142
142
  }
143
- background-color: $tw-clr-bg-danger-tertiary;
144
- border-radius: $tw-spc-base-x-small;
143
+ background-color: terraware.$tw-clr-bg-danger-tertiary;
144
+ border-radius: terraware.$tw-spc-base-x-small;
145
145
  &:active {
146
- outline: $tw-sz-frm-fld-text-input-stroke-active solid $tw-clr-brdr-danger-active;
146
+ outline: terraware.$tw-sz-frm-fld-text-input-stroke-active solid terraware.$tw-clr-brdr-danger-active;
147
147
  }
148
148
 
149
149
  &:focus-within,
150
150
  &:focus-visible {
151
- outline: $tw-sz-frm-fld-text-input-stroke-active solid $tw-clr-brdr-danger-active;
152
- outline-offset: -$tw-sz-frm-fld-text-input-stroke;
151
+ outline: terraware.$tw-sz-frm-fld-text-input-stroke-active solid terraware.$tw-clr-brdr-danger-active;
152
+ outline-offset: -(terraware.$tw-sz-frm-fld-text-input-stroke);
153
153
  }
154
154
  }
155
155
  }