disco_app 0.10.3 → 0.10.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (20) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/disco_app/components/ui-kit/cards/card-section.es6.jsx +2 -2
  3. data/app/assets/javascripts/disco_app/components/ui-kit/cards/cart-section-title.es6.jsx +11 -3
  4. data/app/assets/javascripts/disco_app/components/ui-kit/forms/button.es6.jsx +3 -2
  5. data/app/assets/javascripts/disco_app/components/ui-kit/forms/input-select.es6.jsx +8 -2
  6. data/app/assets/javascripts/disco_app/components/ui-kit/forms/input-text.es6.jsx +12 -2
  7. data/app/assets/javascripts/disco_app/components/ui-kit/forms/input-time.es6.jsx +7 -0
  8. data/app/assets/javascripts/disco_app/components/ui-kit/forms/ui-form__element.es6.jsx +17 -0
  9. data/app/assets/javascripts/disco_app/components/ui-kit/forms/ui-form__group.es6.jsx +11 -0
  10. data/app/assets/javascripts/disco_app/components/ui-kit/forms/ui-form__section.es6.jsx +11 -0
  11. data/app/assets/javascripts/disco_app/components/ui-kit/ui-layout/ui-page-actions.es6.jsx +5 -40
  12. data/app/assets/javascripts/disco_app/components/ui-kit/ui-layout/ui-page-actions__buttons.es6.jsx +27 -0
  13. data/app/assets/stylesheets/disco_app/disco_app.scss +2 -0
  14. data/app/assets/stylesheets/disco_app/ui-kit/_ui-forms.scss +69 -0
  15. data/app/assets/stylesheets/disco_app/ui-kit/_ui-kit.scss +14 -11
  16. data/app/assets/stylesheets/disco_app/ui-kit/_ui-page-actions.scss +3 -1
  17. data/app/assets/stylesheets/disco_app/ui-kit/_ui-stack.scss +39 -0
  18. data/app/models/disco_app/concerns/synchronises.rb +1 -1
  19. data/lib/disco_app/version.rb +1 -1
  20. metadata +8 -1
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 55b6e027313db5f034873fc0d138df85fc662c82be60a510e56e431179cfd34a
4
- data.tar.gz: 1a12ff5b38091517ce4c74c10b8ef3c2d830cbf7a32ed5014d50d86b993e4e03
3
+ metadata.gz: 67c1382ade46bd8b42313b42c9909b4be0fe58413a16ffe7a648a790ef586013
4
+ data.tar.gz: b22447a345d05be4698c2853e3cbe9495a45e8562802ca173a8cbe657953675f
5
5
  SHA512:
6
- metadata.gz: 96d90ea57565818f97bfd7c1d19ce54fac6db48d6ab9e71e6199e3f3f00dbadde7fe1d7350b7f31d962afb7f6b1b442d101ac848c28bc611acdc71665de3c3e7
7
- data.tar.gz: 3c8605e4d8804db6d665c24ba11b5ff2d9e861539557b70cf4c4230b860f1a4451976762ebe847e31c5d58062ef983bc5d7927dc90bcae06879febb36afdcec2
6
+ metadata.gz: c06b73bcd5bef5ef52e56958ecaaabf57c94c58019eda073410d7626da493e4c782880ce8cc87b1ded926a34faf25e053949af8298809d69de9f33aad2acc81e
7
+ data.tar.gz: 80349c2dceb7d75b80034b017606503f041838658a080c8884b88256996b14364daebe948e8e06da7c4e333ed4ecf744c2f09b267291d8dc44a7695588567081
@@ -1,4 +1,4 @@
1
- const CardSection = ({ title, children, wrappable, borderless }) => {
1
+ const CardSection = ({ title, title_small, children, wrappable, borderless }) => {
2
2
 
3
3
  const className = classNames({
4
4
  'next-card__section': true,
@@ -10,7 +10,7 @@ const CardSection = ({ title, children, wrappable, borderless }) => {
10
10
 
11
11
  const showTitle = () => {
12
12
  if (title) {
13
- return <CardSectionTitle title={title}/>;
13
+ return <CardSectionTitle title={title} small={title_small} />;
14
14
  } else {
15
15
  return null;
16
16
  }
@@ -1,9 +1,17 @@
1
- const CardSectionTitle = ({ title }) => {
1
+ const CardSectionTitle = ({ title, small }) => {
2
+
3
+ const className = classNames({
4
+ 'next-heading': true,
5
+ 'next-heading--small': small,
6
+ 'next-heading--half-margin': small
7
+ });
8
+
2
9
  return (
3
- <h3 className="next-heading">{title}</h3>
10
+ <h2 className={className}>{title}</h2>
4
11
  );
5
12
  };
6
13
 
7
14
  CardSectionTitle.propTypes = {
8
- title: React.PropTypes.string.isRequired
15
+ title: React.PropTypes.string.isRequired,
16
+ small: React.PropTypes.bool
9
17
  };
@@ -1,8 +1,9 @@
1
- const Button = ({ children, disabled, name=false, onClick = ()=>{}, primary = false, type = 'button' }) => {
1
+ const Button = ({ children, disabled, name=false, onClick = ()=>{}, primary = false, destroy = false, type = 'button' }) => {
2
2
 
3
3
  const className = classNames({
4
4
  'btn': true,
5
- 'btn-primary': primary
5
+ 'btn-primary': primary,
6
+ 'btn-destroy': destroy
6
7
  });
7
8
 
8
9
  return(
@@ -1,4 +1,4 @@
1
- const InputSelect = ({ id, label, labelHidden, name, options, value, onChange }) => {
1
+ const InputSelect = ({ id, label, labelHidden, name, options, value, defaultValue, helpMessage, onChange }) => {
2
2
 
3
3
  const optionElements = options.map((option) => {
4
4
  return <option key={option.value} value={option.value}>{option.label}</option>;
@@ -13,15 +13,21 @@ const InputSelect = ({ id, label, labelHidden, name, options, value, onChange })
13
13
  onChange(e.target.value);
14
14
  };
15
15
 
16
+ let helpElement = null;
17
+ if(helpMessage) {
18
+ helpElement = <p className="next-input__help-text">{helpMessage}</p>;
19
+ }
20
+
16
21
  return(
17
22
  <div className="next-input-wrapper">
18
23
  <label className={labelClassName} htmlFor={id}>{label}</label>
19
24
  <div className="next-select__wrapper next-input--has-content">
20
- <select className="next-select rule-field" id={id} name={name} value={value} onChange={handleChange}>
25
+ <select className="next-select rule-field" id={id} name={name} value={value} defaultValue={defaultValue} onChange={handleChange}>
21
26
  {optionElements}
22
27
  </select>
23
28
  <NextIcon name="next-chevron-down" size={12} />
24
29
  </div>
30
+ {helpElement}
25
31
  </div>
26
32
  )
27
33
 
@@ -1,7 +1,7 @@
1
1
  class InputText extends BaseInput {
2
2
 
3
3
  render() {
4
- const { errors, name, value, defaultValue, disabled, helpMessage, label, labelHidden, onChange, placeholder } = this.props;
4
+ const { errors, inputType, name, value, defaultValue, disabled, helpMessage, label, labelHidden, onChange, onKeyDown, onKeyUp, placeholder } = this.props;
5
5
 
6
6
  const wrapperClassName = classNames({
7
7
  'next-input-wrapper': true,
@@ -17,6 +17,14 @@ class InputText extends BaseInput {
17
17
  onChange && onChange(e.target.value);
18
18
  };
19
19
 
20
+ const handleKeyDown = (e) => {
21
+ onKeyDown && onKeyDown(e);
22
+ };
23
+
24
+ const handleKeyUp = (e) => {
25
+ onKeyUp && onKeyUp(e);
26
+ };
27
+
20
28
  let helpElement = null;
21
29
  if(helpMessage) {
22
30
  helpElement = <p className="next-input__help-text">{helpMessage}</p>;
@@ -33,8 +41,10 @@ class InputText extends BaseInput {
33
41
  defaultValue={defaultValue}
34
42
  name={name}
35
43
  onChange={handleChange}
44
+ onKeyDown={handleKeyDown}
45
+ onKeyUp={handleKeyUp}
36
46
  placeholder={placeholder}
37
- type="text"
47
+ type={inputType || 'text'}
38
48
  />
39
49
  {helpElement}
40
50
  </div>
@@ -0,0 +1,7 @@
1
+ class InputTime extends InputText {
2
+
3
+ render() {
4
+ return <InputText inputType="time" {...this.props} />
5
+ }
6
+
7
+ }
@@ -0,0 +1,17 @@
1
+ const UIFormElement = ({ helpText, children }) => {
2
+
3
+ const className = classNames({
4
+ 'ui-form__element': true,
5
+ 'ui-form__section--help-text': helpText
6
+ });
7
+
8
+ return (
9
+ <div className={className}>
10
+ {children}
11
+ </div>
12
+ );
13
+ };
14
+
15
+ UIFormElement.propTypes = {
16
+ children: React.PropTypes.node
17
+ };
@@ -0,0 +1,11 @@
1
+ const UIFormGroup = ({ children }) => {
2
+ return (
3
+ <div className="ui-form__group">
4
+ {children}
5
+ </div>
6
+ );
7
+ };
8
+
9
+ UIFormGroup.propTypes = {
10
+ children: React.PropTypes.node
11
+ };
@@ -0,0 +1,11 @@
1
+ const UIFormSection = ({ children }) => {
2
+ return (
3
+ <div className="ui-form__section">
4
+ {children}
5
+ </div>
6
+ );
7
+ };
8
+
9
+ UIFormSection.propTypes = {
10
+ children: React.PropTypes.node
11
+ };
@@ -1,48 +1,13 @@
1
- const UIPageActions = ({ label, disabled, secondaryButtons, secondaryHref, secondaryLabel }) => {
2
-
3
- const buttonClassName = classNames({
4
- 'btn': true,
5
- 'btn-primary': !disabled,
6
- 'disabled': disabled
7
- });
8
-
9
- let secondaryElement = null;
10
- if(secondaryButtons) {
11
- secondaryElement = (
12
- <div className="ui-page-actions__secondary">
13
- <div className="button-group">
14
- {secondaryButtons}
15
- </div>
16
- </div>
17
- );
18
- } else if(secondaryHref) {
19
- secondaryElement = (
20
- <div className="ui-page-actions__secondary">
21
- <div className="button-group">
22
- <a className="btn" href={secondaryHref}>{secondaryLabel}</a>
23
- </div>
24
- </div>
25
- );
26
- }
27
-
1
+ const UIPageActions = ({ primary, secondary }) => {
28
2
  return (
29
3
  <div className="ui-page-actions">
30
- {secondaryElement}
31
- <div className="ui-page-actions__primary">
32
- <div className="button-group button-group--right-aligned">
33
- <button name="button" type="submit" className={buttonClassName} disabled={disabled}>
34
- {label}
35
- </button>
36
- </div>
37
- </div>
4
+ <UIPageActionsButtons primary={false} buttons={secondary} />
5
+ <UIPageActionsButtons primary={true} buttons={primary} />
38
6
  </div>
39
7
  );
40
8
  };
41
9
 
42
10
  UIPageActions.propTypes = {
43
- label: React.PropTypes.string.isRequired,
44
- disabled: React.PropTypes.bool,
45
- secondaryButtons: React.PropTypes.node,
46
- secondaryHref: React.PropTypes.string,
47
- secondaryLabel: React.PropTypes.string
11
+ primary: React.PropTypes.array.isRequired,
12
+ secondary: React.PropTypes.array.isRequired
48
13
  };
@@ -0,0 +1,27 @@
1
+ const UIPageActionsButtons = ({ primary, buttons }) => {
2
+
3
+ const className = classNames({
4
+ 'ui-page-actions__primary': primary,
5
+ 'ui-page-actions__secondary': !primary
6
+ });
7
+
8
+ const buttonGroupClassName = classNames({
9
+ 'button-group': true,
10
+ 'button-group--right-aligned': primary
11
+ });
12
+
13
+ return (
14
+ <div className={className}>
15
+ <div className={buttonGroupClassName}>
16
+ {buttons.map((button, index) => {
17
+ return React.cloneElement(button, { key: index});
18
+ })}
19
+ </div>
20
+ </div>
21
+ );
22
+ };
23
+
24
+ UIPageActionsButtons.propTypes = {
25
+ primary: React.PropTypes.bool.isRequired,
26
+ buttons: React.PropTypes.array.isRequired
27
+ };
@@ -13,6 +13,8 @@ $font-family: -apple-system, "BlinkMacSystemFont", "San Francisco", "Roboto", "S
13
13
  @import 'ui-kit/ui-type';
14
14
  @import 'ui-kit/ui-icons';
15
15
  @import 'ui-kit/ui-layout';
16
+ @import 'ui-kit/ui-forms';
17
+ @import 'ui-kit/ui-stack';
16
18
  @import 'ui-kit/ui-empty-state';
17
19
  @import 'ui-kit/ui-footer-help';
18
20
  @import 'ui-kit/ui-page-actions';
@@ -0,0 +1,69 @@
1
+ //
2
+ // ui-forms.scss
3
+ // Styles for forms not provided by the Channel SDK
4
+ // UI Kit.
5
+ // --------------------------------------------------
6
+
7
+ .ui-form__section {
8
+ display: -webkit-flex;
9
+ display: -ms-flexbox;
10
+ display: flex;
11
+ -webkit-flex-direction: column;
12
+ -ms-flex-direction: column;
13
+ flex-direction: column;
14
+ -webkit-flex-shrink: 0;
15
+ -ms-flex-negative: 0;
16
+ flex-shrink: 0;
17
+ -webkit-flex-wrap: wrap;
18
+ -ms-flex-wrap: wrap;
19
+ flex-wrap: wrap;
20
+ margin: -8px;
21
+
22
+ .next-input-wrapper {
23
+ box-sizing: border-box;
24
+ margin: 0;
25
+ display: -webkit-flex;
26
+ display: -ms-flexbox;
27
+ display: flex;
28
+ -webkit-flex-direction: column;
29
+ -ms-flex-direction: column;
30
+ flex-direction: column;
31
+ min-width: 220px;
32
+ padding: 8px;
33
+ }
34
+ }
35
+
36
+ .ui-form__group {
37
+ display: -webkit-flex;
38
+ display: -ms-flexbox;
39
+ display: flex;
40
+ -webkit-flex-wrap: wrap;
41
+ -ms-flex-wrap: wrap;
42
+ flex-wrap: wrap;
43
+
44
+ > .ui-form__element, .next-input-wrapper {
45
+ max-width: 100%;
46
+ -webkit-flex: 1 0 220px;
47
+ -ms-flex: 1 0 220px;
48
+ flex: 1 0 220px;
49
+ }
50
+ }
51
+
52
+ .ui-form__element {
53
+ box-sizing: border-box;
54
+ display: -webkit-flex;
55
+ display: -ms-flexbox;
56
+ display: flex;
57
+ -webkit-flex-grow: 1;
58
+ -ms-flex-positive: 1;
59
+ flex-grow: 1;
60
+ -webkit-flex-direction: column;
61
+ -ms-flex-direction: column;
62
+ flex-direction: column;
63
+ min-width: 220px;
64
+ padding: 8px;
65
+ }
66
+
67
+ .ui-form__element.ui-form__section--help-text {
68
+ padding-top: 0;
69
+ }
@@ -403,7 +403,7 @@ html {
403
403
  }
404
404
 
405
405
  body {
406
- color: rgba(0,0,0,0.9);
406
+ color: #1a1a1a;
407
407
  font-size: 1.07143rem;
408
408
  line-height: 1.42857rem;
409
409
  font-weight: 400;
@@ -439,7 +439,6 @@ a.is-disabled {
439
439
  }
440
440
 
441
441
  h1, h2, h3, h4, h5, h6 {
442
- color: #212529;
443
442
  font-weight: 400;
444
443
  margin: 0;
445
444
  }
@@ -1228,7 +1227,7 @@ a.type--subdued:hover {
1228
1227
 
1229
1228
  .ui-layout {
1230
1229
  max-width: 1036px;
1231
- margin: 20px auto 0;
1230
+ margin: 20px auto;
1232
1231
  }
1233
1232
 
1234
1233
  .ui-layout--full-width {
@@ -3664,27 +3663,24 @@ input[type=checkbox].next-checkbox {
3664
3663
  -webkit-appearance: none;
3665
3664
  -moz-appearance: none;
3666
3665
  width: 100%;
3667
- color: rgba(0,0,0,0.9);
3668
3666
  font-size: 1.14286rem;
3669
3667
  line-height: 1.71429rem;
3670
3668
  font-weight: 400;
3671
3669
  text-transform: initial;
3672
3670
  letter-spacing: initial;
3673
- -webkit-font-smoothing: antialiased;
3674
- -moz-osx-font-smoothing: grayscale;
3675
3671
  background: transparent;
3676
3672
  padding: 5px 10px;
3677
3673
  padding-right: 32px;
3678
3674
  border: 0;
3679
3675
  box-sizing: border-box;
3680
- height: auto;
3676
+ height: 36px;
3681
3677
  max-width: none;
3682
3678
  display: block;
3683
3679
  }
3684
3680
 
3685
3681
  .next-select:focus {
3686
3682
  outline: none;
3687
- border: none;
3683
+ border: 0;
3688
3684
  }
3689
3685
 
3690
3686
  .next-select option {
@@ -3795,7 +3791,6 @@ input[type=checkbox].next-checkbox {
3795
3791
  }
3796
3792
 
3797
3793
  .next-heading {
3798
- color: rgba(0,0,0,0.9);
3799
3794
  font-size: 1.21429rem;
3800
3795
  line-height: 1.71429rem;
3801
3796
  font-weight: 600;
@@ -3823,7 +3818,15 @@ input[type=checkbox].next-checkbox {
3823
3818
  }
3824
3819
 
3825
3820
  .next-heading--small {
3826
- font-size: 15px;
3821
+ font-size: 0.92857rem;
3822
+ line-height: 1.42857rem;
3823
+ font-weight: 600;
3824
+ text-transform: uppercase;
3825
+ letter-spacing: 0.04em;
3826
+
3827
+ @media screen and (min-width: 640px) {
3828
+ font-size: 0.85714rem;
3829
+ }
3827
3830
  }
3828
3831
 
3829
3832
  .next-heading--large {
@@ -5065,7 +5068,6 @@ td a.subdued:hover {
5065
5068
  }
5066
5069
 
5067
5070
  .ui-annotated-section__annotation {
5068
- color: rgba(0,0,0,0.56);
5069
5071
  -webkit-box-flex: 1;
5070
5072
  -webkit-flex: 1 0 240px;
5071
5073
  -ms-flex: 1 0 240px;
@@ -5077,6 +5079,7 @@ td a.subdued:hover {
5077
5079
  }
5078
5080
 
5079
5081
  .ui-annotated-section__description {
5082
+ color: #707070;
5080
5083
  padding: 0 20px 20px 20px;
5081
5084
  }
5082
5085
 
@@ -6,8 +6,10 @@
6
6
 
7
7
  .ui-page-actions {
8
8
  @include flexbox();
9
- margin: 0 auto 20px auto;
9
+ margin: 0 auto;
10
10
  max-width: 1036px;
11
+ padding: 20px 0;
12
+ border-top: 1px solid #d3dbe2;
11
13
  }
12
14
 
13
15
  .ui-page-actions__primary {
@@ -0,0 +1,39 @@
1
+ .ui-stack {
2
+ display: -webkit-flex;
3
+ display: -ms-flexbox;
4
+ display: flex;
5
+ margin-left: -1.42857rem;
6
+ margin-top: -1.42857rem;
7
+
8
+ > * {
9
+ margin-left: 1.42857rem;
10
+ margin-top: 1.42857rem;
11
+ -webkit-flex: 0 1 auto;
12
+ -ms-flex: 0 1 auto;
13
+ flex: 0 1 auto;
14
+ }
15
+ }
16
+
17
+ .ui-stack--wrap {
18
+ -webkit-flex-wrap: wrap;
19
+ -ms-flex-wrap: wrap;
20
+ flex-wrap: wrap;
21
+ }
22
+
23
+ .ui-stack--alignment-center {
24
+ -webkit-align-items: center;
25
+ -ms-flex-align: center;
26
+ -ms-grid-row-align: center;
27
+ align-items: center;
28
+ }
29
+
30
+ .ui-stack-item {
31
+ min-width: 0;
32
+ max-width: 100%;
33
+ }
34
+
35
+ .ui-stack-item--fill {
36
+ -webkit-flex: 1 1 auto;
37
+ -ms-flex: 1 1 auto;
38
+ flex: 1 1 auto;
39
+ }
@@ -20,7 +20,7 @@ module DiscoApp::Concerns::Synchronises
20
20
  instance.shop = shop
21
21
  instance.data = data
22
22
  end
23
- rescue ActiveRecord::RecordNotUnique
23
+ rescue ActiveRecord::RecordNotUnique, PG::UniqueViolation
24
24
  retry
25
25
  end
26
26
 
@@ -1,3 +1,3 @@
1
1
  module DiscoApp
2
- VERSION = '0.10.3'
2
+ VERSION = '0.10.4'
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: disco_app
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.10.3
4
+ version: 0.10.4
5
5
  platform: ruby
6
6
  authors:
7
7
  - Gavin Ballard
@@ -379,6 +379,10 @@ files:
379
379
  - app/assets/javascripts/disco_app/components/ui-kit/forms/input-select.es6.jsx
380
380
  - app/assets/javascripts/disco_app/components/ui-kit/forms/input-text.es6.jsx
381
381
  - app/assets/javascripts/disco_app/components/ui-kit/forms/input-textarea.es6.jsx
382
+ - app/assets/javascripts/disco_app/components/ui-kit/forms/input-time.es6.jsx
383
+ - app/assets/javascripts/disco_app/components/ui-kit/forms/ui-form__element.es6.jsx
384
+ - app/assets/javascripts/disco_app/components/ui-kit/forms/ui-form__group.es6.jsx
385
+ - app/assets/javascripts/disco_app/components/ui-kit/forms/ui-form__section.es6.jsx
382
386
  - app/assets/javascripts/disco_app/components/ui-kit/icons/icon-chevron.es6.jsx
383
387
  - app/assets/javascripts/disco_app/components/ui-kit/icons/next-icon.es6.jsx
384
388
  - app/assets/javascripts/disco_app/components/ui-kit/input_select.es6.jsx
@@ -391,6 +395,7 @@ files:
391
395
  - app/assets/javascripts/disco_app/components/ui-kit/ui-layout/ui-layout-sections.es6.jsx
392
396
  - app/assets/javascripts/disco_app/components/ui-kit/ui-layout/ui-layout.es6.jsx
393
397
  - app/assets/javascripts/disco_app/components/ui-kit/ui-layout/ui-page-actions.es6.jsx
398
+ - app/assets/javascripts/disco_app/components/ui-kit/ui-layout/ui-page-actions__buttons.es6.jsx
394
399
  - app/assets/javascripts/disco_app/disco_app.js
395
400
  - app/assets/javascripts/disco_app/frame.js
396
401
  - app/assets/javascripts/disco_app/shopify-turbolinks.js
@@ -408,10 +413,12 @@ files:
408
413
  - app/assets/stylesheets/disco_app/mixins/_flexbox.scss
409
414
  - app/assets/stylesheets/disco_app/ui-kit/_ui-empty-state.scss
410
415
  - app/assets/stylesheets/disco_app/ui-kit/_ui-footer-help.scss
416
+ - app/assets/stylesheets/disco_app/ui-kit/_ui-forms.scss
411
417
  - app/assets/stylesheets/disco_app/ui-kit/_ui-icons.scss
412
418
  - app/assets/stylesheets/disco_app/ui-kit/_ui-kit.scss
413
419
  - app/assets/stylesheets/disco_app/ui-kit/_ui-layout.scss
414
420
  - app/assets/stylesheets/disco_app/ui-kit/_ui-page-actions.scss
421
+ - app/assets/stylesheets/disco_app/ui-kit/_ui-stack.scss
415
422
  - app/assets/stylesheets/disco_app/ui-kit/_ui-tabs.scss
416
423
  - app/assets/stylesheets/disco_app/ui-kit/_ui-type.scss
417
424
  - app/controllers/disco_app/admin/app_settings_controller.rb