Skip to content

Commit c4b290c

Browse files
Merge branch 'release/1.22.1'
2 parents d392afd + 20f4b6a commit c4b290c

File tree

10 files changed

+396
-6
lines changed

10 files changed

+396
-6
lines changed
Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
name: "Create new release"
2+
3+
on:
4+
workflow_dispatch:
5+
inputs:
6+
version:
7+
description: 'The version you want to release.'
8+
required: true
9+
10+
jobs:
11+
create-new-release:
12+
name: Create new release
13+
runs-on: ubuntu-latest
14+
steps:
15+
- uses: actions/checkout@v2
16+
with:
17+
fetch-depth: 0
18+
19+
- name: Create release branch
20+
run: git checkout -b release/${{ github.event.inputs.version }}
21+
22+
- name: Initialize mandatory git config
23+
uses: fregante/setup-git-user@v1
24+
25+
- name: Bump version in package.json
26+
run: yarn version --new-version ${{ github.event.inputs.version }} --no-git-tag-version
27+
28+
- name: Commit manifest files
29+
id: make-commit
30+
run: |
31+
git add package.json
32+
git commit --message "Prepare release ${{ github.event.inputs.version }}"
33+
34+
echo "::set-output name=commit::$(git rev-parse HEAD)"
35+
36+
- name: Publish release branch
37+
run: git push origin release/${{ github.event.inputs.version }}
38+
39+
- run: git fetch
40+
41+
- name: Checkout main
42+
run: git checkout main
43+
44+
- name: Merge release branch to main
45+
run: git merge --no-ff release/${{ github.event.inputs.version }}
46+
47+
- name: Push main branch
48+
run: git push origin main
49+
50+
- name: Create tag
51+
run: git tag -a ${{ github.event.inputs.version }} -m v${{ github.event.inputs.version }}
52+
53+
- name: Checkout develop
54+
run: git checkout develop
55+
56+
- name: Merge release branch to develop
57+
run: git merge --no-ff release/${{ github.event.inputs.version }}
58+
59+
- name: Push develop branch
60+
run: git push origin develop
61+
62+
- name: Delete release branch
63+
run: git branch -d release/${{ github.event.inputs.version }}
64+
65+
- name: Extract Package Version
66+
id: extract_version
67+
uses: Saionaro/[email protected]
68+
69+
- name: Create Release
70+
id: create_release
71+
uses: actions/create-release@v1
72+
env:
73+
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
74+
with:
75+
tag_name: v${{ steps.extract_version.outputs.version }}
76+
release_name: Release v${{ steps.extract_version.outputs.version }}
77+
body_path:
78+
draft: false
79+
prerelease: false
80+
81+
# Upload assets to the release
82+
- name: Upload Release Asset
83+
id: upload-release-asset
84+
uses: actions/upload-release-asset@v1
85+
env:
86+
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
87+
with:
88+
upload_url: ${{ steps.create_release.outputs.upload_url }}
89+
asset_path: ./user-interviews-ui-design-system-${{ steps.extract_version.outputs.version }}.tgz
90+
asset_name: user-interviews-ui-design-system-${{ steps.extract_version.outputs.version }}.tgz
91+
asset_content_type: application/tar+gzip

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@user-interviews/ui-design-system",
3-
"version": "1.22.0",
3+
"version": "1.22.1",
44
"dependencies": {
55
"react-router-dom": "^5.2.0",
66
"react-select": "^3.0.8",

spec/__snapshots__/Storyshots.test.js.snap

Lines changed: 154 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5519,6 +5519,160 @@ exports[`Storyshots Design System/Selects/Creatable Default 1`] = `
55195519
</div>
55205520
`;
55215521

5522+
exports[`Storyshots Design System/Selects/Single Custom Option With Checkbox 1`] = `
5523+
<div
5524+
style={
5525+
Object {
5526+
"padding": "1rem",
5527+
}
5528+
}
5529+
>
5530+
<label
5531+
htmlFor="multi-select"
5532+
id="select-label-custom-option"
5533+
>
5534+
Custom option with checkbox
5535+
</label>
5536+
<div
5537+
className="SingleSelect css-2b097c-container"
5538+
id="multi-select"
5539+
onKeyDown={[Function]}
5540+
>
5541+
<div
5542+
className=" css-15ub2n0-control"
5543+
onMouseDown={[Function]}
5544+
onTouchEnd={[Function]}
5545+
>
5546+
<div
5547+
className=" css-g1d714-ValueContainer"
5548+
>
5549+
<div
5550+
className=" css-1269n2i-placeholder"
5551+
>
5552+
Select...
5553+
</div>
5554+
<input
5555+
aria-autocomplete="list"
5556+
aria-labelledby="select-label"
5557+
className="css-62g3xt-dummyInput"
5558+
disabled={false}
5559+
id="react-select-10-input"
5560+
onBlur={[Function]}
5561+
onChange={[Function]}
5562+
onFocus={[Function]}
5563+
readOnly={true}
5564+
tabIndex="0"
5565+
value=""
5566+
/>
5567+
</div>
5568+
<div
5569+
className=" css-1hb7zxy-IndicatorsContainer"
5570+
>
5571+
<span
5572+
className=" css-43ykx9-indicatorSeparator"
5573+
/>
5574+
<div
5575+
aria-hidden="true"
5576+
className=" css-7sl878-indicatorContainer"
5577+
onMouseDown={[Function]}
5578+
onTouchEnd={[Function]}
5579+
>
5580+
<svg
5581+
aria-hidden="true"
5582+
className="css-6q0nyr-Svg"
5583+
focusable="false"
5584+
height={20}
5585+
viewBox="0 0 20 20"
5586+
width={20}
5587+
>
5588+
<path
5589+
d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
5590+
/>
5591+
</svg>
5592+
</div>
5593+
</div>
5594+
</div>
5595+
</div>
5596+
</div>
5597+
`;
5598+
5599+
exports[`Storyshots Design System/Selects/Single Custom Value Container 1`] = `
5600+
<div
5601+
style={
5602+
Object {
5603+
"padding": "1rem",
5604+
}
5605+
}
5606+
>
5607+
<label
5608+
htmlFor="custom-value-container-select"
5609+
id="select-label-custom-value-container"
5610+
>
5611+
Custom value container
5612+
</label>
5613+
<div
5614+
className="SingleSelect css-2b097c-container"
5615+
id="custom-value-container-select"
5616+
onKeyDown={[Function]}
5617+
>
5618+
<div
5619+
className=" css-15ub2n0-control"
5620+
onMouseDown={[Function]}
5621+
onTouchEnd={[Function]}
5622+
>
5623+
<div
5624+
className=" css-g1d714-ValueContainer"
5625+
>
5626+
<div
5627+
className=" css-1269n2i-placeholder"
5628+
>
5629+
Select...
5630+
</div>
5631+
<input
5632+
aria-autocomplete="list"
5633+
aria-labelledby="select-label"
5634+
className="css-62g3xt-dummyInput"
5635+
disabled={false}
5636+
id="react-select-11-input"
5637+
onBlur={[Function]}
5638+
onChange={[Function]}
5639+
onFocus={[Function]}
5640+
readOnly={true}
5641+
tabIndex="0"
5642+
value=""
5643+
/>
5644+
</div>
5645+
<div
5646+
className=" css-1hb7zxy-IndicatorsContainer"
5647+
>
5648+
<span
5649+
className=" css-43ykx9-indicatorSeparator"
5650+
/>
5651+
<div
5652+
aria-hidden="true"
5653+
className=" css-7sl878-indicatorContainer"
5654+
onMouseDown={[Function]}
5655+
onTouchEnd={[Function]}
5656+
>
5657+
<svg
5658+
aria-hidden="true"
5659+
className="css-6q0nyr-Svg"
5660+
focusable="false"
5661+
height={20}
5662+
viewBox="0 0 20 20"
5663+
width={20}
5664+
>
5665+
<path
5666+
d="M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
5667+
/>
5668+
</svg>
5669+
</div>
5670+
</div>
5671+
</div>
5672+
</div>
5673+
</div>
5674+
`;
5675+
55225676
exports[`Storyshots Design System/Selects/Single Default 1`] = `
55235677
<div
55245678
style={

src/Select/Option.jsx

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import React from 'react';
2+
import { components } from 'react-select';
3+
4+
import CheckboxButton from 'src/CheckboxButton';
5+
import './Option.scss';
6+
7+
// Replaceable Components
8+
// Option: Component responsible for displaying an option in the menu with a Checkbox.
9+
//
10+
// This is a replaceable component. If you need to deviate from this replaceable component,
11+
// reach out to the DS team first before creating your own replaceable component.
12+
//
13+
// See: https://react-select.com/components#replaceable-components
14+
15+
/* eslint-disable react/prop-types */
16+
const Option = ({ ...props }) => (
17+
<components.Option {...props}>
18+
<div className="Option">
19+
<label>{props.label}</label>
20+
<CheckboxButton
21+
checked={props.isSelected}
22+
id={props.label}
23+
onChange={() => null}
24+
/>
25+
</div>
26+
</components.Option>
27+
);
28+
/* eslint-enable react/prop-types */
29+
30+
export default Option;

src/Select/Option.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
.Option {
2+
display: flex;
3+
justify-content: space-between;
4+
align-items: center;
5+
}

src/Select/SingleSelect.jsx

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ const SingleSelect = ({
1111
'aria-label': ariaLabel,
1212
'aria-labelledby': ariaLabelledBy,
1313
className,
14+
closeMenuOnSelect,
1415
defaultValue,
1516
disabled,
1617
getOptionLabel,
@@ -19,6 +20,7 @@ const SingleSelect = ({
1920
id,
2021
inputId,
2122
isLoading,
23+
isMulti,
2224
isSearchable,
2325
modal,
2426
name,
@@ -34,13 +36,15 @@ const SingleSelect = ({
3436
aria-label={ariaLabel}
3537
aria-labelledby={ariaLabelledBy}
3638
className={classNames('SingleSelect', className)}
39+
closeMenuOnSelect={closeMenuOnSelect}
3740
defaultValue={defaultValue}
3841
getOptionLabel={getOptionLabel}
3942
getOptionValue={getOptionValue}
4043
id={id}
4144
inputId={inputId}
4245
isClearable={isClearable}
4346
isDisabled={disabled || isLoading}
47+
isMulti={isMulti}
4448
isSearchable={isSearchable}
4549
menuPortalTarget={modal ? document.body : undefined}
4650
name={name}
@@ -64,6 +68,7 @@ SingleSelect.propTypes = {
6468
'aria-label': propTypes.string,
6569
'aria-labelledby': propTypes.string,
6670
className: propTypes.string,
71+
closeMenuOnSelect: propTypes.bool,
6772
defaultValue: propTypes.object,
6873
disabled: propTypes.bool,
6974
getOptionLabel: propTypes.func,
@@ -72,6 +77,7 @@ SingleSelect.propTypes = {
7277
inputId: propTypes.string,
7378
isClearable: propTypes.bool,
7479
isLoading: propTypes.bool,
80+
isMulti: propTypes.bool,
7581
isSearchable: propTypes.bool,
7682
modal: propTypes.bool,
7783
name: propTypes.string,
@@ -87,6 +93,7 @@ SingleSelect.defaultProps = {
8793
'aria-label': undefined,
8894
'aria-labelledby': undefined,
8995
className: undefined,
96+
closeMenuOnSelect: true,
9097
defaultValue: undefined,
9198
disabled: false,
9299
getOptionLabel: undefined,
@@ -95,6 +102,7 @@ SingleSelect.defaultProps = {
95102
id: undefined,
96103
inputId: undefined,
97104
isLoading: false,
105+
isMulti: undefined,
98106
isSearchable: false,
99107
modal: false,
100108
name: undefined,

0 commit comments

Comments
 (0)