Skip to content

Commit 6a48a84

Browse files
Merge release/2.6.1 into main branch (#1169)
* add forwardRef to DrawerBody (#1166) * Bump sanitize-html from 2.11.0 to 2.12.1 (#1163) * Bump webpack-dev-middleware from 6.1.1 to 6.1.2 (#1167) * Provides CSS properties for typography, layout and color (#1168)
1 parent d913532 commit 6a48a84

File tree

5 files changed

+249
-15
lines changed

5 files changed

+249
-15
lines changed

bin/link-rs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,4 +10,4 @@ fi
1010
yarn build
1111
yalc publish
1212
cd $RAILS_SERVER_PATH
13-
yalc link @user-interviews/ui-design-system
13+
yalc add @user-interviews/ui-design-system

package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@user-interviews/ui-design-system",
3-
"version": "2.6.0",
3+
"version": "2.6.1",
44
"dependencies": {
55
"@tiptap/core": "^2.0.3",
66
"@tiptap/extension-bold": "^2.0.3",
@@ -28,7 +28,7 @@
2828
"react-select": "^5.0.0",
2929
"react-toggle": "4.1.1",
3030
"react-transition-group": "^4.3.0",
31-
"sanitize-html": "^2.11.0",
31+
"sanitize-html": "^2.12.1",
3232
"tippy.js": "^6.3.7",
3333
"uuid": "^7.0.2"
3434
},

scss/css_properties.scss

Lines changed: 231 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,231 @@
1+
@import 'borders';
2+
@import 'box_shadow';
3+
@import 'colors';
4+
@import 'elevations';
5+
@import 'spacing';
6+
@import 'typography';
7+
@import 'z_stack';
8+
9+
:root {
10+
--ux-border-radius: #{$ux-border-radius};
11+
12+
--ux-navbar-shadow-color: #{$ux-navbar-shadow-color};
13+
--ux-box-shadow: #{$ux-box-shadow};
14+
--ux-box-shadow-light: #{$ux-box-shadow-light};
15+
--ux-box-shadow-card: #{$ux-box-shadow-card};
16+
--ux-box-shadow-table-sticky-column-left: #{$ux-box-shadow-table-sticky-column-left};
17+
--ux-box-shadow-table-sticky-column-right: #{$ux-box-shadow-table-sticky-column-right};
18+
--ux-box-shadow-top: #{$ux-box-shadow-top};
19+
--ux-box-shadow-top-light: #{$ux-box-shadow-top-light};
20+
--ux-drawer-box-shadow-right: #{$ux-drawer-box-shadow-right};
21+
--ux-drawer-box-shadow-left: #{$ux-drawer-box-shadow-left};
22+
23+
--ux-elevations-00: #{$ux-elevations-00};
24+
--ux-elevations-10: #{$ux-elevations-10};
25+
--ux-elevations-20: #{$ux-elevations-20};
26+
--ux-elevations-30: #{$ux-elevations-30};
27+
--ux-elevations-40: #{$ux-elevations-40};
28+
--ux-elevations-50: #{$ux-elevations-50};
29+
30+
--ux-black: #{$ux-black};
31+
--ux-blue: #{$ux-blue};
32+
--ux-cream: #{$ux-cream};
33+
--ux-emerald: #{$ux-emerald};
34+
--ux-gray: #{$ux-gray};
35+
--ux-green: #{$ux-green};
36+
--ux-light-blue: #{$ux-light-blue};
37+
--ux-navy: #{$ux-navy};
38+
--ux-orange: #{$ux-orange};
39+
--ux-purple: #{$ux-purple};
40+
--ux-red: #{$ux-red};
41+
--ux-sand: #{$ux-sand};
42+
--ux-teal: #{$ux-teal};
43+
--ux-yellow: #{$ux-yellow};
44+
--ux-white: #{$ux-white};
45+
--brand-color-facebook: #{$brand-color-facebook};
46+
--brand-color-google: #{$brand-color-google};
47+
--brand-color-google-alt: #{$brand-color-google-alt};
48+
--brand-color-linkedin: #{$brand-color-linkedin};
49+
--brand-color-office365: #{$brand-color-office365};
50+
--brand-color-twitter: #{$brand-color-twitter};
51+
--brand-color-yahoo: #{$brand-color-yahoo};
52+
--ux-blue-100: #{$ux-blue-100};
53+
--ux-blue-200: #{$ux-blue-200};
54+
--ux-blue-300: #{$ux-blue-300};
55+
--ux-blue-400: #{$ux-blue-400};
56+
--ux-blue-500: #{$ux-blue-500};
57+
--ux-blue-600: #{$ux-blue-600};
58+
--ux-blue-700: #{$ux-blue-700};
59+
--ux-blue-800: #{$ux-blue-800};
60+
--ux-blue-900: #{$ux-blue-900};
61+
--ux-emerald-100: #{$ux-emerald-100};
62+
--ux-emerald-200: #{$ux-emerald-200};
63+
--ux-emerald-300: #{$ux-emerald-300};
64+
--ux-emerald-400: #{$ux-emerald-400};
65+
--ux-emerald-500: #{$ux-emerald-500};
66+
--ux-emerald-600: #{$ux-emerald-600};
67+
--ux-emerald-700: #{$ux-emerald-700};
68+
--ux-emerald-800: #{$ux-emerald-800};
69+
--ux-emerald-900: #{$ux-emerald-900};
70+
--ux-gray-100: #{$ux-gray-100};
71+
--ux-gray-200: #{$ux-gray-200};
72+
--ux-gray-300: #{$ux-gray-300};
73+
--ux-gray-400: #{$ux-gray-400};
74+
--ux-gray-500: #{$ux-gray-500};
75+
--ux-gray-600: #{$ux-gray-600};
76+
--ux-gray-700: #{$ux-gray-700};
77+
--ux-gray-800: #{$ux-gray-800};
78+
--ux-gray-900: #{$ux-gray-900};
79+
--ux-green-100: #{$ux-green-100};
80+
--ux-green-200: #{$ux-green-200};
81+
--ux-green-300: #{$ux-green-300};
82+
--ux-green-400: #{$ux-green-400};
83+
--ux-green-500: #{$ux-green-500};
84+
--ux-green-600: #{$ux-green-600};
85+
--ux-green-700: #{$ux-green-700};
86+
--ux-green-800: #{$ux-green-800};
87+
--ux-green-900: #{$ux-green-900};
88+
--ux-navy-100: #{$ux-navy-100};
89+
--ux-navy-200: #{$ux-navy-200};
90+
--ux-navy-300: #{$ux-navy-300};
91+
--ux-navy-400: #{$ux-navy-400};
92+
--ux-navy-500: #{$ux-navy-500};
93+
--ux-navy-600: #{$ux-navy-600};
94+
--ux-navy-700: #{$ux-navy-700};
95+
--ux-navy-800: #{$ux-navy-800};
96+
--ux-navy-900: #{$ux-navy-900};
97+
--ux-neutral-100: #{$ux-neutral-100};
98+
--ux-neutral-200: #{$ux-neutral-200};
99+
--ux-neutral-300: #{$ux-neutral-300};
100+
--ux-neutral-400: #{$ux-neutral-400};
101+
--ux-neutral-500: #{$ux-neutral-500};
102+
--ux-neutral-600: #{$ux-neutral-600};
103+
--ux-neutral-700: #{$ux-neutral-700};
104+
--ux-neutral-800: #{$ux-neutral-800};
105+
--ux-neutral-900: #{$ux-neutral-900};
106+
--ux-orange-100: #{$ux-orange-100};
107+
--ux-orange-200: #{$ux-orange-200};
108+
--ux-orange-300: #{$ux-orange-300};
109+
--ux-orange-400: #{$ux-orange-400};
110+
--ux-orange-500: #{$ux-orange-500};
111+
--ux-orange-600: #{$ux-orange-600};
112+
--ux-orange-700: #{$ux-orange-700};
113+
--ux-orange-800: #{$ux-orange-800};
114+
--ux-orange-900: #{$ux-orange-900};
115+
--ux-red-100: #{$ux-red-100};
116+
--ux-red-200: #{$ux-red-200};
117+
--ux-red-300: #{$ux-red-300};
118+
--ux-red-400: #{$ux-red-400};
119+
--ux-red-500: #{$ux-red-500};
120+
--ux-red-600: #{$ux-red-600};
121+
--ux-red-700: #{$ux-red-700};
122+
--ux-red-800: #{$ux-red-800};
123+
--ux-red-900: #{$ux-red-900};
124+
--ux-sand-100: #{$ux-sand-100};
125+
--ux-sand-200: #{$ux-sand-200};
126+
--ux-sand-300: #{$ux-sand-300};
127+
--ux-sand-400: #{$ux-sand-400};
128+
--ux-sand-500: #{$ux-sand-500};
129+
--ux-sand-600: #{$ux-sand-600};
130+
--ux-sand-700: #{$ux-sand-700};
131+
--ux-sand-800: #{$ux-sand-800};
132+
--ux-sand-900: #{$ux-sand-900};
133+
--ux-teal-100: #{$ux-teal-100};
134+
--ux-teal-200: #{$ux-teal-200};
135+
--ux-teal-300: #{$ux-teal-300};
136+
--ux-teal-400: #{$ux-teal-400};
137+
--ux-teal-500: #{$ux-teal-500};
138+
--ux-teal-600: #{$ux-teal-600};
139+
--ux-teal-700: #{$ux-teal-700};
140+
--ux-teal-800: #{$ux-teal-800};
141+
--ux-teal-900: #{$ux-teal-900};
142+
--ux-yellow-100: #{$ux-yellow-100};
143+
--ux-yellow-200: #{$ux-yellow-200};
144+
--ux-yellow-300: #{$ux-yellow-300};
145+
--ux-yellow-400: #{$ux-yellow-400};
146+
--ux-yellow-500: #{$ux-yellow-500};
147+
--ux-yellow-600: #{$ux-yellow-600};
148+
--ux-yellow-700: #{$ux-yellow-700};
149+
--ux-yellow-800: #{$ux-yellow-800};
150+
--ux-yellow-900: #{$ux-yellow-900};
151+
--ux-purple-100: #{$ux-purple-100};
152+
--ux-purple-200: #{$ux-purple-200};
153+
--ux-purple-300: #{$ux-purple-300};
154+
--ux-purple-400: #{$ux-purple-400};
155+
--ux-purple-500: #{$ux-purple-500};
156+
--ux-purple-600: #{$ux-purple-600};
157+
--ux-purple-700: #{$ux-purple-700};
158+
--ux-purple-800: #{$ux-purple-800};
159+
--ux-purple-900: #{$ux-purple-900};
160+
161+
--synth-spacing-1: #{$synth-spacing-1};
162+
--synth-spacing-2: #{$synth-spacing-2};
163+
--synth-spacing-3: #{$synth-spacing-3};
164+
--synth-spacing-4: #{$synth-spacing-4};
165+
--synth-spacing-5: #{$synth-spacing-5};
166+
--synth-spacing-6: #{$synth-spacing-6};
167+
--synth-spacing-7: #{$synth-spacing-7};
168+
--synth-spacing-8: #{$synth-spacing-8};
169+
--synth-spacing-9: #{$synth-spacing-9};
170+
--synth-spacing-10: #{$synth-spacing-10};
171+
--synth-spacing-11: #{$synth-spacing-11};
172+
--synth-spacing-12: #{$synth-spacing-12};
173+
174+
--synth-success-green-dark: #{$synth-success-green-dark};
175+
--synth-success-green-medium: #{$synth-success-green-medium};
176+
--synth-success-green-light: #{$synth-success-green-light};
177+
--synth-error-red-dark: #{$synth-error-red-dark};
178+
--synth-error-red-medium: #{$synth-error-red-medium};
179+
--synth-error-red-light: #{$synth-error-red-light};
180+
--synth-warning-amber-dark: #{$synth-warning-amber-dark};
181+
--synth-warning-amber-medium: #{$synth-warning-amber-medium};
182+
--synth-warning-amber-light: #{$synth-warning-amber-light};
183+
--synth-warning-amber-alternate: #{$synth-warning-amber-alternate};
184+
--synth-alert-bg-neutral: #{$synth-alert-bg-neutral};
185+
--synth-div-stroke-neutral: #{$synth-div-stroke-neutral};
186+
--synth-header-neutral: #{$synth-header-neutral};
187+
--synth-page-neutral: #{$synth-page-neutral};
188+
--synth-text-neutral: #{$synth-text-neutral};
189+
--synth-unselected-neutral: #{$synth-unselected-neutral};
190+
--synth-accent-green: #{$synth-accent-green};
191+
--synth-dark-background-selected-blue: #{$synth-dark-background-selected-blue};
192+
--synth-dark-background-pressed-blue: #{$synth-dark-background-pressed-blue};
193+
--synth-hover-state: #{$synth-hover-state};
194+
--synth-indicator-stroke-green: #{$synth-indicator-stroke-green};
195+
--synth-navbar-blue: #{$synth-navbar-blue};
196+
--synth-primary-cta-blue: #{$synth-primary-cta-blue};
197+
--synth-selected-state-green: #{$synth-selected-state-green};
198+
--synth-hyperlink-color: #{$synth-hyperlink-color};
199+
--synth-hover-blue: #{$synth-hover-blue};
200+
--synth-header-gray-blue: #{$synth-header-gray-blue};
201+
202+
--synth-font-family: #{$synth-font-family};
203+
--synth-font-weight-regular: #{$synth-font-weight-regular};
204+
--synth-font-weight-medium: #{$synth-font-weight-medium};
205+
--synth-font-weight-bold: #{$synth-font-weight-bold};
206+
--synth-font-size-base: #{$synth-font-size-base};
207+
208+
--z-index-1050: #{$z-index-1050};
209+
--z-index-1045: #{$z-index-1045};
210+
--z-index-1040: #{$z-index-1040};
211+
--z-index-1030: #{$z-index-1030};
212+
--z-index-1025: #{$z-index-1025};
213+
--z-index-1020: #{$z-index-1020};
214+
--z-index-115: #{$z-index-115};
215+
--z-index-100: #{$z-index-100};
216+
--z-index-30: #{$z-index-30};
217+
--z-index-20: #{$z-index-20};
218+
--z-index-11: #{$z-index-11};
219+
--z-index-10: #{$z-index-10};
220+
--z-index-3: #{$z-index-3};
221+
--z-index-2: #{$z-index-2};
222+
--z-index-1: #{$z-index-1};
223+
--z-index-popover: #{$z-index-popover};
224+
--z-index-flash: #{$z-index-flash};
225+
--z-index-drawer: #{$z-index-drawer};
226+
--z-index-modal-backdrop: #{$z-index-modal-backdrop};
227+
--z-index-fixed: #{$z-index-fixed};
228+
--z-index-overlay: #{$z-index-overlay};
229+
--z-index-table-cell-sticky-column: #{$z-index-table-cell-sticky-column};
230+
--z-index-table-foot-sticky-row: #{$z-index-table-foot-sticky-row};
231+
}

src/Drawer/DrawerBody.jsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,18 @@
1-
import React from 'react';
1+
import React, { forwardRef } from 'react';
22
import * as propTypes from 'prop-types';
33

44
import './DrawerBody.scss';
55

6-
const DrawerBody = ({
6+
const DrawerBody = forwardRef(({
77
children,
8-
}) => (
9-
<div className="Drawer__body">
8+
}, ref) => (
9+
<div
10+
className="Drawer__body"
11+
ref={ref}
12+
>
1013
{children}
1114
</div>
12-
);
15+
));
1316

1417
DrawerBody.propTypes = {
1518
children: propTypes.node.isRequired,

yarn.lock

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -11542,10 +11542,10 @@ safe-regex-test@^1.0.0:
1154211542
resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a"
1154311543
integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==
1154411544

11545-
sanitize-html@^2.11.0:
11546-
version "2.11.0"
11547-
resolved "https://registry.yarnpkg.com/sanitize-html/-/sanitize-html-2.11.0.tgz#9a6434ee8fcaeddc740d8ae7cd5dd71d3981f8f6"
11548-
integrity sha512-BG68EDHRaGKqlsNjJ2xUB7gpInPA8gVx/mvjO743hZaeMCZ2DwzW7xvsqZ+KNU4QKwj86HJ3uu2liISf2qBBUA==
11545+
sanitize-html@^2.12.1:
11546+
version "2.12.1"
11547+
resolved "https://registry.yarnpkg.com/sanitize-html/-/sanitize-html-2.12.1.tgz#280a0f5c37305222921f6f9d605be1f6558914c7"
11548+
integrity sha512-Plh+JAn0UVDpBRP/xEjsk+xDCoOvMBwQUf/K+/cBAVuTbtX8bj2VB7S1sL1dssVpykqp0/KPSesHrqXtokVBpA==
1154911549
dependencies:
1155011550
deepmerge "^4.2.2"
1155111551
escape-string-regexp "^4.0.0"
@@ -12917,9 +12917,9 @@ webidl-conversions@^6.1.0:
1291712917
integrity sha512-qBIvFLGiBpLjfwmYAaHPXsn+ho5xZnGvyGvsarywGNc8VyQJUMHJ8OBKGGrPER0okBeMDaan4mNBlgBROxuI8w==
1291812918

1291912919
webpack-dev-middleware@^6.1.1:
12920-
version "6.1.1"
12921-
resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-6.1.1.tgz#6bbc257ec83ae15522de7a62f995630efde7cc3d"
12922-
integrity sha512-y51HrHaFeeWir0YO4f0g+9GwZawuigzcAdRNon6jErXy/SqV/+O6eaVAzDqE6t3e3NpGeR5CS+cCDaTC+V3yEQ==
12920+
version "6.1.2"
12921+
resolved "https://registry.yarnpkg.com/webpack-dev-middleware/-/webpack-dev-middleware-6.1.2.tgz#0463232e59b7d7330fa154121528d484d36eb973"
12922+
integrity sha512-Wu+EHmX326YPYUpQLKmKbTyZZJIB8/n6R09pTmB03kJmnMsVPTo9COzHZFr01txwaCAuZvfBJE4ZCHRcKs5JaQ==
1292312923
dependencies:
1292412924
colorette "^2.0.10"
1292512925
memfs "^3.4.12"

0 commit comments

Comments
 (0)