@elliemae/ds-pills 2.0.0-rc.3 → 2.0.0-rc.7

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 (10) hide show
  1. package/cjs/components/Pill.js +1 -1
  2. package/cjs/components/PillButton.js +1 -1
  3. package/cjs/components/PillGroup.js +1 -1
  4. package/cjs/components/styled.js +6 -3
  5. package/esm/components/Pill.js +1 -1
  6. package/esm/components/PillButton.js +1 -1
  7. package/esm/components/PillGroup.js +1 -1
  8. package/esm/components/styled.js +6 -4
  9. package/package.json +12 -12
  10. package/types/components/styled.d.ts +11 -10
package/cjs/components/Pill.js CHANGED
@@ -38,7 +38,7 @@ const pillComponentGetter = {
38
38
 
39
39
  const DSPillV2 = props$1 => {
40
40
  const propsWithDefaults = dsPropsHelpers.useMemoMergePropsWithDefault(props$1, props.DSPillV2DefaultProps);
41
- dsPropsHelpers.useValidateTypescriptPropTypes(propsWithDefaults, DSPillV2WithSchema.toTypescript());
41
+ dsPropsHelpers.useValidateTypescriptPropTypes(propsWithDefaults, props.DSPillV2PropTypes);
42
42
  const {
43
43
  type
44
44
  } = propsWithDefaults;
package/cjs/components/PillButton.js CHANGED
@@ -34,7 +34,7 @@ const typeToClassName = {
34
34
 
35
35
  const DSPillButton = props$1 => {
36
36
  const propsWithDefaults = dsPropsHelpers.useMemoMergePropsWithDefault(props$1, props.DSPillButtonDefaultProps);
37
- dsPropsHelpers.useValidateTypescriptPropTypes(propsWithDefaults, DSPillButtonWithSchema.toTypescript());
37
+ dsPropsHelpers.useValidateTypescriptPropTypes(propsWithDefaults, props.DSPillButtonPropTypes);
38
38
 
39
39
  const {
40
40
  type,
package/cjs/components/PillGroup.js CHANGED
@@ -25,7 +25,7 @@ const DSPillGroupV2Context = /*#__PURE__*/React.createContext({
25
25
 
26
26
  const DSPillGroupV2 = props$1 => {
27
27
  const propsWithDefaults = dsPropsHelpers.useMemoMergePropsWithDefault(props$1, props.DSPillGroupDefaultProps);
28
- dsPropsHelpers.useValidateTypescriptPropTypes(propsWithDefaults, DSPillGroupV2WithSchema.toTypescript());
28
+ dsPropsHelpers.useValidateTypescriptPropTypes(propsWithDefaults, props.DSPillGroupPropTypes);
29
29
  const pillGroupUid = React.useMemo(() => "ds-pill-group-".concat(uid.uid()), []);
30
30
  const {
31
31
  children,
package/cjs/components/styled.js CHANGED
@@ -2,16 +2,19 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
+ var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
5
6
  var styled = require('styled-components');
7
+ var dsSystem = require('@elliemae/ds-system');
6
8
  var Grid = require('@elliemae/ds-grid');
7
9
  var dsButton = require('@elliemae/ds-button');
8
10
 
9
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
12
 
13
+ var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);
11
14
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
12
15
  var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
13
16
 
14
- /* eslint-disable max-lines */
17
+ var _templateObject, _templateObject2;
15
18
  // Common CSS
16
19
  // =============================================================================
17
20
 
@@ -19,10 +22,10 @@ const borderOutside = function (color) {
19
22
  let size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
20
23
  let zIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 2;
21
24
  let borderRadius = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '12px';
22
- return styled.css([":after{content:' ';position:absolute;top:0px;left:0px;right:0px;bottom:0px;border:", "px solid ", ";border-top-left-radius:", ";border-top-right-radius:", ";border-bottom-left-radius:", ";border-bottom-right-radius:", ";pointer-events:none;z-index:", ";}"], size, color, borderRadius, borderRadius, borderRadius, borderRadius, zIndex);
25
+ return dsSystem.css(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\n :after {\n content: ' ';\n position: absolute;\n top: 0px;\n left: 0px;\n right: 0px;\n bottom: 0px;\n border: ", "px solid ", ";\n border-top-left-radius: ", ";\n border-top-right-radius: ", ";\n border-bottom-left-radius: ", ";\n border-bottom-right-radius: ", ";\n pointer-events: none;\n z-index: ", ";\n }\n"])), size, color, borderRadius, borderRadius, borderRadius, borderRadius, zIndex);
23
26
  };
24
27
 
25
- const commonPillWrapperCss = /*#__PURE__*/styled.css(["height:", ";position:relative;width:fit-content;background-color:", ";outline:none;white-space:nowrap;padding:0px 12px 0 12px;border-radius:12px;font-size:13px;line-height:1;color:", ";", ";"], props => (props === null || props === void 0 ? void 0 : props.size) === 'm' ? '24px' : '18px', props => props.theme.colors.brand[200], props => props.theme.colors.brand[800], props => borderOutside(props.theme.colors.brand[300])); // =============================================================================
28
+ const commonPillWrapperCss = dsSystem.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default["default"](["\n height: ", ";\n\n position: relative;\n\n width: fit-content;\n\n background-color: ", ";\n\n outline: none;\n\n white-space: nowrap;\n\n padding: 0px 12px 0 12px;\n border-radius: 12px;\n\n font-size: 13px;\n line-height: 1;\n color: ", ";\n ", ";\n"])), props => (props === null || props === void 0 ? void 0 : props.size) === 'm' ? '24px' : '18px', props => props.theme.colors.brand[200], props => props.theme.colors.brand[800], props => borderOutside(props.theme.colors.brand[300])); // =============================================================================
26
29
  // Pills wrappers
27
30
  // =============================================================================
28
31
 
package/esm/components/Pill.js CHANGED
@@ -30,7 +30,7 @@ const pillComponentGetter = {
30
30
 
31
31
  const DSPillV2 = props => {
32
32
  const propsWithDefaults = useMemoMergePropsWithDefault(props, DSPillV2DefaultProps);
33
- useValidateTypescriptPropTypes(propsWithDefaults, DSPillV2WithSchema.toTypescript());
33
+ useValidateTypescriptPropTypes(propsWithDefaults, DSPillV2PropTypes);
34
34
  const {
35
35
  type
36
36
  } = propsWithDefaults;
package/esm/components/PillButton.js CHANGED
@@ -25,7 +25,7 @@ const typeToClassName = {
25
25
 
26
26
  const DSPillButton = props => {
27
27
  const propsWithDefaults = useMemoMergePropsWithDefault(props, DSPillButtonDefaultProps);
28
- useValidateTypescriptPropTypes(propsWithDefaults, DSPillButtonWithSchema.toTypescript());
28
+ useValidateTypescriptPropTypes(propsWithDefaults, DSPillButtonPropTypes);
29
29
 
30
30
  const {
31
31
  type,
package/esm/components/PillGroup.js CHANGED
@@ -16,7 +16,7 @@ const DSPillGroupV2Context = /*#__PURE__*/createContext({
16
16
 
17
17
  const DSPillGroupV2 = props => {
18
18
  const propsWithDefaults = useMemoMergePropsWithDefault(props, DSPillGroupDefaultProps);
19
- useValidateTypescriptPropTypes(propsWithDefaults, DSPillGroupV2WithSchema.toTypescript());
19
+ useValidateTypescriptPropTypes(propsWithDefaults, DSPillGroupPropTypes);
20
20
  const pillGroupUid = useMemo(() => "ds-pill-group-".concat(uid()), []);
21
21
  const {
22
22
  children,
package/esm/components/styled.js CHANGED
@@ -1,8 +1,10 @@
1
- import styled, { css } from 'styled-components';
1
+ import _taggedTemplateLiteral from '@babel/runtime/helpers/esm/taggedTemplateLiteral';
2
+ import styled from 'styled-components';
3
+ import { css } from '@elliemae/ds-system';
2
4
  import Grid from '@elliemae/ds-grid';
3
5
  import { DSButtonV2 } from '@elliemae/ds-button';
4
6
 
5
- /* eslint-disable max-lines */
7
+ var _templateObject, _templateObject2;
6
8
  // Common CSS
7
9
  // =============================================================================
8
10
 
@@ -10,10 +12,10 @@ const borderOutside = function (color) {
10
12
  let size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
11
13
  let zIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 2;
12
14
  let borderRadius = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '12px';
13
- return css([":after{content:' ';position:absolute;top:0px;left:0px;right:0px;bottom:0px;border:", "px solid ", ";border-top-left-radius:", ";border-top-right-radius:", ";border-bottom-left-radius:", ";border-bottom-right-radius:", ";pointer-events:none;z-index:", ";}"], size, color, borderRadius, borderRadius, borderRadius, borderRadius, zIndex);
15
+ return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n :after {\n content: ' ';\n position: absolute;\n top: 0px;\n left: 0px;\n right: 0px;\n bottom: 0px;\n border: ", "px solid ", ";\n border-top-left-radius: ", ";\n border-top-right-radius: ", ";\n border-bottom-left-radius: ", ";\n border-bottom-right-radius: ", ";\n pointer-events: none;\n z-index: ", ";\n }\n"])), size, color, borderRadius, borderRadius, borderRadius, borderRadius, zIndex);
14
16
  };
15
17
 
16
- const commonPillWrapperCss = /*#__PURE__*/css(["height:", ";position:relative;width:fit-content;background-color:", ";outline:none;white-space:nowrap;padding:0px 12px 0 12px;border-radius:12px;font-size:13px;line-height:1;color:", ";", ";"], props => (props === null || props === void 0 ? void 0 : props.size) === 'm' ? '24px' : '18px', props => props.theme.colors.brand[200], props => props.theme.colors.brand[800], props => borderOutside(props.theme.colors.brand[300])); // =============================================================================
18
+ const commonPillWrapperCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n height: ", ";\n\n position: relative;\n\n width: fit-content;\n\n background-color: ", ";\n\n outline: none;\n\n white-space: nowrap;\n\n padding: 0px 12px 0 12px;\n border-radius: 12px;\n\n font-size: 13px;\n line-height: 1;\n color: ", ";\n ", ";\n"])), props => (props === null || props === void 0 ? void 0 : props.size) === 'm' ? '24px' : '18px', props => props.theme.colors.brand[200], props => props.theme.colors.brand[800], props => borderOutside(props.theme.colors.brand[300])); // =============================================================================
17
19
  // Pills wrappers
18
20
  // =============================================================================
19
21
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-pills",
3
- "version": "2.0.0-rc.3",
3
+ "version": "2.0.0-rc.7",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Pills",
6
6
  "module": "./esm/index.js",
@@ -144,17 +144,17 @@
144
144
  "build": "node ../../scripts/build/build.js"
145
145
  },
146
146
  "dependencies": {
147
- "@elliemae/ds-classnames": "2.0.0-rc.3",
148
- "@elliemae/ds-dropdownmenu": "2.0.0-rc.3",
149
- "@elliemae/ds-form": "2.0.0-rc.3",
150
- "@elliemae/ds-grid": "2.0.0-rc.3",
151
- "@elliemae/ds-icons": "2.0.0-rc.3",
152
- "@elliemae/ds-modal": "2.0.0-rc.3",
153
- "@elliemae/ds-popover": "2.0.0-rc.3",
154
- "@elliemae/ds-shared": "2.0.0-rc.3",
155
- "@elliemae/ds-system": "2.0.0-rc.3",
156
- "@elliemae/ds-tooltip": "2.0.0-rc.3",
157
- "@elliemae/ds-utilities": "2.0.0-rc.3",
147
+ "@elliemae/ds-classnames": "2.0.0-rc.7",
148
+ "@elliemae/ds-dropdownmenu": "2.0.0-rc.7",
149
+ "@elliemae/ds-form": "2.0.0-rc.7",
150
+ "@elliemae/ds-grid": "2.0.0-rc.7",
151
+ "@elliemae/ds-icons": "2.0.0-rc.7",
152
+ "@elliemae/ds-modal": "2.0.0-rc.7",
153
+ "@elliemae/ds-popover": "2.0.0-rc.7",
154
+ "@elliemae/ds-shared": "2.0.0-rc.7",
155
+ "@elliemae/ds-system": "2.0.0-rc.7",
156
+ "@elliemae/ds-tooltip": "2.0.0-rc.7",
157
+ "@elliemae/ds-utilities": "2.0.0-rc.7",
158
158
  "prop-types": "~15.7.2",
159
159
  "react-desc": "~4.1.3",
160
160
  "uid": "~2.0.0"
package/types/components/styled.d.ts CHANGED
@@ -1,22 +1,22 @@
1
1
  /// <reference types="react" />
2
- export declare const StyledLabelPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, any, {
2
+ export declare const StyledLabelPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {
3
3
  size: 'm' | 's';
4
4
  }, never>;
5
- export declare const StyledValuePillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, any, {
5
+ export declare const StyledValuePillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {
6
6
  size: 'm' | 's';
7
7
  }, never>;
8
- export declare const StyledInputPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
9
- export declare const StyledDropdownPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, any, {
8
+ export declare const StyledInputPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
9
+ export declare const StyledDropdownPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {
10
10
  size: 'm' | 's';
11
11
  }, never>;
12
- export declare const StyledReadonlyPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
13
- export declare const StyledRemovablePillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, any, {
12
+ export declare const StyledReadonlyPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
13
+ export declare const StyledRemovablePillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {
14
14
  size: 'm' | 's';
15
15
  }, never>;
16
- export declare const StyledPillGroup: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
17
- export declare const StyledSpanWithTooltip: import("styled-components").StyledComponent<"span", any, {}, never>;
16
+ export declare const StyledPillGroup: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
17
+ export declare const StyledSpanWithTooltip: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
18
18
  export declare const StyledPillButton: import("styled-components").StyledComponent<{
19
- (props: import("@elliemae/ds-button/types/v2/DSButtonV2Types").DSButtonPropsT): JSX.Element;
19
+ (props: import("@elliemae/ds-button/types/v2/propTypes").DSButtonPropsT): JSX.Element;
20
20
  propTypes: {
21
21
  id: any;
22
22
  buttonType: any;
@@ -34,8 +34,9 @@ export declare const StyledPillButton: import("styled-components").StyledCompone
34
34
  'data-testid': any;
35
35
  role: any;
36
36
  children: any;
37
+ 'data-testemulatestate': any;
37
38
  };
38
- }, any, {
39
+ }, import("styled-components").DefaultTheme, {
39
40
  width: string;
40
41
  height: string;
41
42
  }, never>;