@dhis2-ui/file-input 6.23.5 → 7.0.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.
@@ -32,29 +32,29 @@ const FileListItem = ({
32
32
  dataTest
33
33
  }) => /*#__PURE__*/_react.default.createElement("p", {
34
34
  "data-test": dataTest,
35
- className: _style.default.dynamic([["2855437039", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800]]]) + " " + ((0, _classnames.default)('selected-file', className) || "")
35
+ className: _style.default.dynamic([["3793849083", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800, _uiConstants.theme.focus]]]) + " " + ((0, _classnames.default)('selected-file', className) || "")
36
36
  }, /*#__PURE__*/_react.default.createElement("span", {
37
- className: _style.default.dynamic([["2855437039", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800]]]) + " " + "icon"
37
+ className: _style.default.dynamic([["3793849083", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800, _uiConstants.theme.focus]]]) + " " + "icon"
38
38
  }, loading ? /*#__PURE__*/_react.default.createElement(_loader.CircularLoader, {
39
39
  extrasmall: true
40
40
  }) : /*#__PURE__*/_react.default.createElement(_uiIcons.IconAttachment16, {
41
41
  color: _uiConstants.colors.grey700
42
42
  })), /*#__PURE__*/_react.default.createElement("span", {
43
- className: _style.default.dynamic([["2855437039", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800]]]) + " " + "text"
43
+ className: _style.default.dynamic([["3793849083", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800, _uiConstants.theme.focus]]]) + " " + "text"
44
44
  }, /*#__PURE__*/_react.default.createElement("span", {
45
- className: _style.default.dynamic([["2855437039", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800]]]) + " " + "label"
45
+ className: _style.default.dynamic([["3793849083", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800, _uiConstants.theme.focus]]]) + " " + "label"
46
46
  }, label), loading && onCancel && cancelText && /*#__PURE__*/_react.default.createElement("span", {
47
47
  onClick: event => onCancel({}, event),
48
48
  "data-test": `${dataTest}-cancel`,
49
- className: _style.default.dynamic([["2855437039", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800]]]) + " " + "action"
49
+ className: _style.default.dynamic([["3793849083", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800, _uiConstants.theme.focus]]]) + " " + "action"
50
50
  }, cancelText), !loading && /*#__PURE__*/_react.default.createElement("span", {
51
51
  onClick: event => onRemove({}, event),
52
52
  "data-test": `${dataTest}-remove`,
53
- className: _style.default.dynamic([["2855437039", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800]]]) + " " + "action"
53
+ className: _style.default.dynamic([["3793849083", [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800, _uiConstants.theme.focus]]]) + " " + "action"
54
54
  }, removeText)), /*#__PURE__*/_react.default.createElement(_style.default, {
55
- id: "2855437039",
56
- dynamic: [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800]
57
- }, [`p.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin:0;padding-top:${_uiConstants.spacers.dp4};}`, ".icon.__jsx-style-dynamic-selector{margin-right:4px;-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding-top:1px;}", ".text.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}", `.label.__jsx-style-dynamic-selector{font-size:14px;color:${_uiConstants.colors.grey900};word-break:break-all;}`, ".label.__jsx-style-dynamic-selector::after{content:' ';display:inline-block;width:12px;}", `.action.__jsx-style-dynamic-selector{font-size:12px;line-height:12px;margin-top:0;-webkit-text-decoration:underline;text-decoration:underline;cursor:pointer;color:${_uiConstants.colors.grey700};}`, `.action.__jsx-style-dynamic-selector:hover{color:${_uiConstants.colors.red700};}`, `.action.__jsx-style-dynamic-selector:active{color:${_uiConstants.colors.red800};}`]));
55
+ id: "3793849083",
56
+ dynamic: [_uiConstants.spacers.dp4, _uiConstants.colors.grey900, _uiConstants.colors.grey700, _uiConstants.colors.red700, _uiConstants.colors.red800, _uiConstants.theme.focus]
57
+ }, [`p.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin:0;padding-top:${_uiConstants.spacers.dp4};}`, ".icon.__jsx-style-dynamic-selector{margin-right:4px;-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding-top:1px;}", ".text.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}", `.label.__jsx-style-dynamic-selector{font-size:14px;color:${_uiConstants.colors.grey900};word-break:break-all;}`, ".label.__jsx-style-dynamic-selector::after{content:' ';display:inline-block;width:12px;}", `.action.__jsx-style-dynamic-selector{font-size:12px;line-height:12px;margin-top:0;-webkit-text-decoration:underline;text-decoration:underline;cursor:pointer;color:${_uiConstants.colors.grey700};}`, `.action.__jsx-style-dynamic-selector:hover{color:${_uiConstants.colors.red700};}`, `.action.__jsx-style-dynamic-selector:active{color:${_uiConstants.colors.red800};}`, `.action.__jsx-style-dynamic-selector:focus{outline:3px solid ${_uiConstants.theme.focus};outline-offset:2px;}`]));
58
58
 
59
59
  exports.FileListItem = FileListItem;
60
60
  FileListItem.defaultProps = {
@@ -1,7 +1,7 @@
1
1
  import _JSXStyle from "styled-jsx/style";
2
2
  import { CircularLoader } from '@dhis2-ui/loader';
3
3
  import propTypes from '@dhis2/prop-types';
4
- import { colors, spacers } from '@dhis2/ui-constants';
4
+ import { theme, colors, spacers } from '@dhis2/ui-constants';
5
5
  import { IconAttachment16 } from '@dhis2/ui-icons';
6
6
  import cx from 'classnames';
7
7
  import React from 'react';
@@ -17,29 +17,29 @@ const FileListItem = ({
17
17
  dataTest
18
18
  }) => /*#__PURE__*/React.createElement("p", {
19
19
  "data-test": dataTest,
20
- className: _JSXStyle.dynamic([["2855437039", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800]]]) + " " + (cx('selected-file', className) || "")
20
+ className: _JSXStyle.dynamic([["3793849083", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800, theme.focus]]]) + " " + (cx('selected-file', className) || "")
21
21
  }, /*#__PURE__*/React.createElement("span", {
22
- className: _JSXStyle.dynamic([["2855437039", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800]]]) + " " + "icon"
22
+ className: _JSXStyle.dynamic([["3793849083", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800, theme.focus]]]) + " " + "icon"
23
23
  }, loading ? /*#__PURE__*/React.createElement(CircularLoader, {
24
24
  extrasmall: true
25
25
  }) : /*#__PURE__*/React.createElement(IconAttachment16, {
26
26
  color: colors.grey700
27
27
  })), /*#__PURE__*/React.createElement("span", {
28
- className: _JSXStyle.dynamic([["2855437039", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800]]]) + " " + "text"
28
+ className: _JSXStyle.dynamic([["3793849083", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800, theme.focus]]]) + " " + "text"
29
29
  }, /*#__PURE__*/React.createElement("span", {
30
- className: _JSXStyle.dynamic([["2855437039", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800]]]) + " " + "label"
30
+ className: _JSXStyle.dynamic([["3793849083", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800, theme.focus]]]) + " " + "label"
31
31
  }, label), loading && onCancel && cancelText && /*#__PURE__*/React.createElement("span", {
32
32
  onClick: event => onCancel({}, event),
33
33
  "data-test": `${dataTest}-cancel`,
34
- className: _JSXStyle.dynamic([["2855437039", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800]]]) + " " + "action"
34
+ className: _JSXStyle.dynamic([["3793849083", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800, theme.focus]]]) + " " + "action"
35
35
  }, cancelText), !loading && /*#__PURE__*/React.createElement("span", {
36
36
  onClick: event => onRemove({}, event),
37
37
  "data-test": `${dataTest}-remove`,
38
- className: _JSXStyle.dynamic([["2855437039", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800]]]) + " " + "action"
38
+ className: _JSXStyle.dynamic([["3793849083", [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800, theme.focus]]]) + " " + "action"
39
39
  }, removeText)), /*#__PURE__*/React.createElement(_JSXStyle, {
40
- id: "2855437039",
41
- dynamic: [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800]
42
- }, [`p.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin:0;padding-top:${spacers.dp4};}`, ".icon.__jsx-style-dynamic-selector{margin-right:4px;-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding-top:1px;}", ".text.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}", `.label.__jsx-style-dynamic-selector{font-size:14px;color:${colors.grey900};word-break:break-all;}`, ".label.__jsx-style-dynamic-selector::after{content:' ';display:inline-block;width:12px;}", `.action.__jsx-style-dynamic-selector{font-size:12px;line-height:12px;margin-top:0;-webkit-text-decoration:underline;text-decoration:underline;cursor:pointer;color:${colors.grey700};}`, `.action.__jsx-style-dynamic-selector:hover{color:${colors.red700};}`, `.action.__jsx-style-dynamic-selector:active{color:${colors.red800};}`]));
40
+ id: "3793849083",
41
+ dynamic: [spacers.dp4, colors.grey900, colors.grey700, colors.red700, colors.red800, theme.focus]
42
+ }, [`p.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin:0;padding-top:${spacers.dp4};}`, ".icon.__jsx-style-dynamic-selector{margin-right:4px;-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding-top:1px;}", ".text.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}", `.label.__jsx-style-dynamic-selector{font-size:14px;color:${colors.grey900};word-break:break-all;}`, ".label.__jsx-style-dynamic-selector::after{content:' ';display:inline-block;width:12px;}", `.action.__jsx-style-dynamic-selector{font-size:12px;line-height:12px;margin-top:0;-webkit-text-decoration:underline;text-decoration:underline;cursor:pointer;color:${colors.grey700};}`, `.action.__jsx-style-dynamic-selector:hover{color:${colors.red700};}`, `.action.__jsx-style-dynamic-selector:active{color:${colors.red800};}`, `.action.__jsx-style-dynamic-selector:focus{outline:3px solid ${theme.focus};outline-offset:2px;}`]));
43
43
 
44
44
  FileListItem.defaultProps = {
45
45
  dataTest: 'dhis2-uicore-filelistitem'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2-ui/file-input",
3
- "version": "6.23.5",
3
+ "version": "7.0.0",
4
4
  "description": "UI FileInput",
5
5
  "repository": {
6
6
  "type": "git",
@@ -29,16 +29,16 @@
29
29
  "@dhis2/d2-i18n": "^1.1.0",
30
30
  "react": "^16.8",
31
31
  "react-dom": "^16.8",
32
- "styled-jsx": "^3.2"
32
+ "styled-jsx": "^4"
33
33
  },
34
34
  "dependencies": {
35
- "@dhis2-ui/button": "6.23.5",
36
- "@dhis2-ui/field": "6.23.5",
37
- "@dhis2-ui/label": "6.23.5",
38
- "@dhis2-ui/loader": "6.23.5",
35
+ "@dhis2-ui/button": "7.0.0",
36
+ "@dhis2-ui/field": "7.0.0",
37
+ "@dhis2-ui/label": "7.0.0",
38
+ "@dhis2-ui/loader": "7.0.0",
39
39
  "@dhis2/prop-types": "^1.6.4",
40
- "@dhis2/ui-constants": "6.23.5",
41
- "@dhis2/ui-icons": "6.23.5",
40
+ "@dhis2/ui-constants": "7.0.0",
41
+ "@dhis2/ui-icons": "7.0.0",
42
42
  "classnames": "^2.3.1",
43
43
  "prop-types": "^15.7.2"
44
44
  },
@@ -49,6 +49,6 @@
49
49
  "@dhis2/d2-i18n": "^1.1.0",
50
50
  "react": "16.13",
51
51
  "react-dom": "16.13",
52
- "styled-jsx": "^3.4.4"
52
+ "styled-jsx": "^4.0.1"
53
53
  }
54
54
  }