@elliemae/ds-mobile 3.60.0-next.59 → 3.60.0-next.60
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.
- package/dist/cjs/MobileDatePicker/Input.js +3 -1
- package/dist/cjs/MobileDatePicker/Input.js.map +2 -2
- package/dist/cjs/MobileDropdownMenu/MobileDropdownInput.js +3 -1
- package/dist/cjs/MobileDropdownMenu/MobileDropdownInput.js.map +2 -2
- package/dist/cjs/MobileTimePicker/Input.js +3 -1
- package/dist/cjs/MobileTimePicker/Input.js.map +2 -2
- package/dist/esm/MobileDatePicker/Input.js +4 -2
- package/dist/esm/MobileDatePicker/Input.js.map +2 -2
- package/dist/esm/MobileDropdownMenu/MobileDropdownInput.js +4 -2
- package/dist/esm/MobileDropdownMenu/MobileDropdownInput.js.map +2 -2
- package/dist/esm/MobileTimePicker/Input.js +4 -2
- package/dist/esm/MobileTimePicker/Input.js.map +2 -2
- package/package.json +17 -17
|
@@ -59,7 +59,9 @@ const StyledInput = import_ds_system.styled.input`
|
|
|
59
59
|
|
|
60
60
|
input[type='date']&:active,
|
|
61
61
|
input[type='date']&:focus {
|
|
62
|
-
|
|
62
|
+
outline: none;
|
|
63
|
+
border: 1px solid ${({ theme }) => theme.colors.brand[700]};
|
|
64
|
+
border-radius: 2px;
|
|
63
65
|
}
|
|
64
66
|
|
|
65
67
|
&:before {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileDatePicker/Input.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { styled,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { styled, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='date']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='date']&:active,\n input[type='date']&:focus {\n outline: none;\n border: 1px solid ${({ theme }) => theme.colors.brand[700]};\n border-radius: 2px;\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='date']&::-webkit-datetime-edit,\n input[type='date']&::-webkit-inner-spin-button,\n input[type='date']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput innerRef={innerRef} {...props} />;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8C0B;AA7CjD,uBAAiD;AAEjD,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMpD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBAC7C,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,EAAE,CAAC;AAAA;AAAA;AAAA,wBAGlD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAM1C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,aAKjD,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAE;AAAA,gBACpG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB,CAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWzF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,4CAAC,eAAY,UAAqB,GAAG,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -54,7 +54,9 @@ const MobileDropdownInput = import_ds_system.styled.input`
|
|
|
54
54
|
|
|
55
55
|
&:active,
|
|
56
56
|
&:focus {
|
|
57
|
-
|
|
57
|
+
outline: none;
|
|
58
|
+
border: 1px solid ${({ theme }) => theme.colors.brand[700]};
|
|
59
|
+
border-radius: 2px;
|
|
58
60
|
}
|
|
59
61
|
`;
|
|
60
62
|
const MobileDropdownInputWrap = import_ds_system.styled.span`
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileDropdownMenu/MobileDropdownInput.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\n/* eslint-disable @typescript-eslint/ban-ts-comment, @typescript-eslint/no-unused-vars, @typescript-eslint/no-explicit-any */\n/* tslint:disable */\n// @ts-nocheck\n// What's with all the above disables?\n// this is what a legacy 7 year old codebase looks like.\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\n/* eslint-disable @typescript-eslint/ban-ts-comment, @typescript-eslint/no-unused-vars, @typescript-eslint/no-explicit-any */\n/* tslint:disable */\n// @ts-nocheck\n// What's with all the above disables?\n// this is what a legacy 7 year old codebase looks like.\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\n\nexport const MobileDropdownInput = styled.input`\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n caret-color: transparent;\n padding-right: 32px;\n padding-left: 10px;\n border-radius: 2px;\n width: 100%;\n background: ${(props) => props.theme.colors.neutral['000']};\n height: 32px;\n line-height: 32px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n\n &:active,\n &:focus {\n outline: none;\n border: 1px solid ${({ theme }) => theme.colors.brand[700]};\n border-radius: 2px;\n }\n`;\n\nexport const MobileDropdownInputWrap = styled.span`\n position: relative;\n width: 100%;\n display: inline-block;\n height: 32px;\n`;\n\nconst CaretWrap = styled.span`\n width: 32px;\n height: 32px;\n position: absolute;\n right: 0;\n top: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const Caret = ({ onClick }): JSX.Element => (\n <CaretWrap onClick={onClick}>\n <ChevronDown color={['brand-primary', '600']} />\n </CaretWrap>\n);\n\nexport const DSMobileDropdownTriggerInput = ({\n inputProps,\n caretProps,\n selectedItemsText,\n}: {\n inputProps: Record<string, unknown>;\n caretProps: Record<string, unknown>;\n selectedItemsText?: string;\n}): JSX.Element => (\n <MobileDropdownInputWrap data-testid=\"ds-mobile-ddwn-menu\">\n <MobileDropdownInput {...inputProps} readOnly value={selectedItemsText ?? inputProps.value} />\n\n <Caret {...caretProps} />\n </MobileDropdownInputWrap>\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmDnB;AA7CJ,sBAA4B;AAC5B,uBAAuB;AAEhB,MAAM,sBAAsB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAS1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA,sBAGtC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,wBAKxC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAKvD,MAAM,0BAA0B,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAO9C,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWlB,MAAM,QAAQ,CAAC,EAAE,QAAQ,MAC9B,4CAAC,aAAU,SACT,sDAAC,+BAAY,OAAO,CAAC,iBAAiB,KAAK,GAAG,GAChD;AAGK,MAAM,+BAA+B,CAAC;AAAA,EAC3C;AAAA,EACA;AAAA,EACA;AACF,MAKE,6CAAC,2BAAwB,eAAY,uBACnC;AAAA,8CAAC,uBAAqB,GAAG,YAAY,UAAQ,MAAC,OAAO,qBAAqB,WAAW,OAAO;AAAA,EAE5F,4CAAC,SAAO,GAAG,YAAY;AAAA,GACzB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -59,7 +59,9 @@ const StyledInput = import_ds_system.styled.input`
|
|
|
59
59
|
|
|
60
60
|
input[type='time']&:active,
|
|
61
61
|
input[type='time']&:focus {
|
|
62
|
-
|
|
62
|
+
outline: none;
|
|
63
|
+
border: 1px solid ${({ theme }) => theme.colors.brand[700]};
|
|
64
|
+
border-radius: 2px;
|
|
63
65
|
}
|
|
64
66
|
|
|
65
67
|
&:before {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileTimePicker/Input.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { __UNSAFE_SPACE_TO_DIMSUM, styled } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='time']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='time']&:active,\n input[type='time']&:focus {\n outline: none;\n border: 1px solid ${({ theme }) => theme.colors.brand[700]};\n border-radius: 2px;\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='time']&::-webkit-datetime-edit,\n input[type='time']&::-webkit-inner-spin-button,\n input[type='time']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput innerRef={innerRef} {...props} />;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8C0B;AA7CjD,uBAAiD;AAEjD,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMpD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBAC7C,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,EAAE,CAAC;AAAA;AAAA;AAAA,wBAGlD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAM1C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,aAKjD,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAE;AAAA,gBACpG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB,CAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWzF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,4CAAC,eAAY,UAAqB,GAAG,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import { styled,
|
|
3
|
+
import { styled, __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
|
|
4
4
|
const StyledInput = styled.input`
|
|
5
5
|
input[type='date']& {
|
|
6
6
|
-webkit-appearance: none;
|
|
@@ -26,7 +26,9 @@ const StyledInput = styled.input`
|
|
|
26
26
|
|
|
27
27
|
input[type='date']&:active,
|
|
28
28
|
input[type='date']&:focus {
|
|
29
|
-
|
|
29
|
+
outline: none;
|
|
30
|
+
border: 1px solid ${({ theme }) => theme.colors.brand[700]};
|
|
31
|
+
border-radius: 2px;
|
|
30
32
|
}
|
|
31
33
|
|
|
32
34
|
&:before {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileDatePicker/Input.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled,
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='date']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='date']&:active,\n input[type='date']&:focus {\n outline: none;\n border: 1px solid ${({ theme }) => theme.colors.brand[700]};\n border-radius: 2px;\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='date']&::-webkit-datetime-edit,\n input[type='date']&::-webkit-inner-spin-button,\n input[type='date']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput innerRef={innerRef} {...props} />;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC8C0B;AA7CjD,SAAS,QAAQ,gCAAgC;AAEjD,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMpD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBAC7C,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE,CAAC;AAAA;AAAA;AAAA,wBAGlD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAM1C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,aAKjD,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAE;AAAA,gBACpG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB,CAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWzF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,oBAAC,eAAY,UAAqB,GAAG,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { ChevronDown } from "@elliemae/ds-icons";
|
|
4
|
-
import {
|
|
4
|
+
import { styled } from "@elliemae/ds-system";
|
|
5
5
|
const MobileDropdownInput = styled.input`
|
|
6
6
|
-webkit-appearance: none;
|
|
7
7
|
-moz-appearance: none;
|
|
@@ -18,7 +18,9 @@ const MobileDropdownInput = styled.input`
|
|
|
18
18
|
|
|
19
19
|
&:active,
|
|
20
20
|
&:focus {
|
|
21
|
-
|
|
21
|
+
outline: none;
|
|
22
|
+
border: 1px solid ${({ theme }) => theme.colors.brand[700]};
|
|
23
|
+
border-radius: 2px;
|
|
22
24
|
}
|
|
23
25
|
`;
|
|
24
26
|
const MobileDropdownInputWrap = styled.span`
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileDropdownMenu/MobileDropdownInput.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unsafe-assignment */\n/* eslint-disable @typescript-eslint/ban-ts-comment, @typescript-eslint/no-unused-vars, @typescript-eslint/no-explicit-any */\n/* tslint:disable */\n// @ts-nocheck\n// What's with all the above disables?\n// this is what a legacy 7 year old codebase looks like.\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unsafe-assignment */\n/* eslint-disable @typescript-eslint/ban-ts-comment, @typescript-eslint/no-unused-vars, @typescript-eslint/no-explicit-any */\n/* tslint:disable */\n// @ts-nocheck\n// What's with all the above disables?\n// this is what a legacy 7 year old codebase looks like.\nimport { ChevronDown } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\n\nexport const MobileDropdownInput = styled.input`\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n caret-color: transparent;\n padding-right: 32px;\n padding-left: 10px;\n border-radius: 2px;\n width: 100%;\n background: ${(props) => props.theme.colors.neutral['000']};\n height: 32px;\n line-height: 32px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n\n &:active,\n &:focus {\n outline: none;\n border: 1px solid ${({ theme }) => theme.colors.brand[700]};\n border-radius: 2px;\n }\n`;\n\nexport const MobileDropdownInputWrap = styled.span`\n position: relative;\n width: 100%;\n display: inline-block;\n height: 32px;\n`;\n\nconst CaretWrap = styled.span`\n width: 32px;\n height: 32px;\n position: absolute;\n right: 0;\n top: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const Caret = ({ onClick }): JSX.Element => (\n <CaretWrap onClick={onClick}>\n <ChevronDown color={['brand-primary', '600']} />\n </CaretWrap>\n);\n\nexport const DSMobileDropdownTriggerInput = ({\n inputProps,\n caretProps,\n selectedItemsText,\n}: {\n inputProps: Record<string, unknown>;\n caretProps: Record<string, unknown>;\n selectedItemsText?: string;\n}): JSX.Element => (\n <MobileDropdownInputWrap data-testid=\"ds-mobile-ddwn-menu\">\n <MobileDropdownInput {...inputProps} readOnly value={selectedItemsText ?? inputProps.value} />\n\n <Caret {...caretProps} />\n </MobileDropdownInputWrap>\n);\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACmDnB,cAaF,YAbE;AA7CJ,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AAEhB,MAAM,sBAAsB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAS1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA,sBAGtC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,wBAKxC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAKvD,MAAM,0BAA0B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAO9C,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWlB,MAAM,QAAQ,CAAC,EAAE,QAAQ,MAC9B,oBAAC,aAAU,SACT,8BAAC,eAAY,OAAO,CAAC,iBAAiB,KAAK,GAAG,GAChD;AAGK,MAAM,+BAA+B,CAAC;AAAA,EAC3C;AAAA,EACA;AAAA,EACA;AACF,MAKE,qBAAC,2BAAwB,eAAY,uBACnC;AAAA,sBAAC,uBAAqB,GAAG,YAAY,UAAQ,MAAC,OAAO,qBAAqB,WAAW,OAAO;AAAA,EAE5F,oBAAC,SAAO,GAAG,YAAY;AAAA,GACzB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import {
|
|
3
|
+
import { __UNSAFE_SPACE_TO_DIMSUM, styled } from "@elliemae/ds-system";
|
|
4
4
|
const StyledInput = styled.input`
|
|
5
5
|
input[type='time']& {
|
|
6
6
|
-webkit-appearance: none;
|
|
@@ -26,7 +26,9 @@ const StyledInput = styled.input`
|
|
|
26
26
|
|
|
27
27
|
input[type='time']&:active,
|
|
28
28
|
input[type='time']&:focus {
|
|
29
|
-
|
|
29
|
+
outline: none;
|
|
30
|
+
border: 1px solid ${({ theme }) => theme.colors.brand[700]};
|
|
31
|
+
border-radius: 2px;
|
|
30
32
|
}
|
|
31
33
|
|
|
32
34
|
&:before {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileTimePicker/Input.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { __UNSAFE_SPACE_TO_DIMSUM, styled } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='time']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='time']&:active,\n input[type='time']&:focus {\n outline: none;\n border: 1px solid ${({ theme }) => theme.colors.brand[700]};\n border-radius: 2px;\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='time']&::-webkit-datetime-edit,\n input[type='time']&::-webkit-inner-spin-button,\n input[type='time']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput innerRef={innerRef} {...props} />;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC8C0B;AA7CjD,SAAS,0BAA0B,cAAc;AAEjD,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMpD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBAC7C,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE,CAAC;AAAA;AAAA;AAAA,wBAGlD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAM1C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,aAKjD,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAE;AAAA,gBACpG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB,CAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWzF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,oBAAC,eAAY,UAAqB,GAAG,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-mobile",
|
|
3
|
-
"version": "3.60.0-next.
|
|
3
|
+
"version": "3.60.0-next.60",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - System",
|
|
6
6
|
"files": [
|
|
@@ -44,28 +44,28 @@
|
|
|
44
44
|
"@elliemae/ds-legacy-form": "1.0.16",
|
|
45
45
|
"react-window": "~1.8.8",
|
|
46
46
|
"react-window-infinite-loader": "~1.0.8",
|
|
47
|
-
"@elliemae/ds-accordion": "3.60.0-next.
|
|
48
|
-
"@elliemae/ds-backdrop": "3.60.0-next.
|
|
49
|
-
"@elliemae/ds-button-v2": "3.60.0-next.
|
|
50
|
-
"@elliemae/ds-circular-progress-indicator": "3.60.0-next.
|
|
51
|
-
"@elliemae/ds-form-checkbox": "3.60.0-next.
|
|
52
|
-
"@elliemae/ds-grid": "3.60.0-next.
|
|
53
|
-
"@elliemae/ds-icon": "3.60.0-next.
|
|
54
|
-
"@elliemae/ds-indeterminate-progress-indicator": "3.60.0-next.
|
|
55
|
-
"@elliemae/ds-
|
|
56
|
-
"@elliemae/ds-
|
|
57
|
-
"@elliemae/ds-shared": "3.60.0-next.
|
|
58
|
-
"@elliemae/ds-system": "3.60.0-next.
|
|
59
|
-
"@elliemae/ds-tabs": "3.60.0-next.
|
|
60
|
-
"@elliemae/ds-truncated-expandable-text": "3.60.0-next.
|
|
47
|
+
"@elliemae/ds-accordion": "3.60.0-next.60",
|
|
48
|
+
"@elliemae/ds-backdrop": "3.60.0-next.60",
|
|
49
|
+
"@elliemae/ds-button-v2": "3.60.0-next.60",
|
|
50
|
+
"@elliemae/ds-circular-progress-indicator": "3.60.0-next.60",
|
|
51
|
+
"@elliemae/ds-form-checkbox": "3.60.0-next.60",
|
|
52
|
+
"@elliemae/ds-grid": "3.60.0-next.60",
|
|
53
|
+
"@elliemae/ds-icon": "3.60.0-next.60",
|
|
54
|
+
"@elliemae/ds-indeterminate-progress-indicator": "3.60.0-next.60",
|
|
55
|
+
"@elliemae/ds-icons": "3.60.0-next.60",
|
|
56
|
+
"@elliemae/ds-props-helpers": "3.60.0-next.60",
|
|
57
|
+
"@elliemae/ds-shared": "3.60.0-next.60",
|
|
58
|
+
"@elliemae/ds-system": "3.60.0-next.60",
|
|
59
|
+
"@elliemae/ds-tabs": "3.60.0-next.60",
|
|
60
|
+
"@elliemae/ds-truncated-expandable-text": "3.60.0-next.60"
|
|
61
61
|
},
|
|
62
62
|
"devDependencies": {
|
|
63
63
|
"@elliemae/pui-theme": "~2.13.0",
|
|
64
64
|
"jest": "^30.0.0",
|
|
65
65
|
"styled-components": "~5.3.9",
|
|
66
66
|
"styled-system": "^5.1.5",
|
|
67
|
-
"@elliemae/ds-monorepo-devops": "3.60.0-next.
|
|
68
|
-
"@elliemae/ds-test-utils": "3.60.0-next.
|
|
67
|
+
"@elliemae/ds-monorepo-devops": "3.60.0-next.60",
|
|
68
|
+
"@elliemae/ds-test-utils": "3.60.0-next.60"
|
|
69
69
|
},
|
|
70
70
|
"peerDependencies": {
|
|
71
71
|
"@elliemae/pui-theme": "~2.13.0",
|