tntd 2.4.0 → 2.5.1
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/es/color-picker/ColorPicker.js +136 -0
- package/es/color-picker/ColorPicker.js.map +1 -0
- package/es/color-picker/index.js +14 -0
- package/es/color-picker/index.js.map +1 -0
- package/es/color-picker/index.less +234 -0
- package/es/color-picker/tip.svg +23 -0
- package/es/ellipsis/index.js +1 -1
- package/es/ellipsis/index.js.map +1 -1
- package/es/index.js +1 -0
- package/es/index.js.map +1 -1
- package/es/input/index.js +1 -0
- package/es/input/index.js.map +1 -1
- package/es/input/input.js +70 -12
- package/es/input/input.js.map +1 -1
- package/es/label/label.less +11 -0
- package/es/locale/en_US.js +2 -1
- package/es/locale/en_US.js.map +1 -1
- package/es/locale/zh_CN.js +2 -1
- package/es/locale/zh_CN.js.map +1 -1
- package/es/select/select.js.map +1 -1
- package/es/select/select.less +1 -4
- package/lib/color-picker/ColorPicker.d.ts +16 -0
- package/lib/color-picker/ColorPicker.d.ts.map +1 -0
- package/lib/color-picker/ColorPicker.js +162 -0
- package/lib/color-picker/ColorPicker.js.map +1 -0
- package/lib/color-picker/index.d.ts +2 -0
- package/lib/color-picker/index.d.ts.map +1 -0
- package/lib/color-picker/index.js +21 -0
- package/lib/color-picker/index.js.map +1 -0
- package/lib/color-picker/index.less +234 -0
- package/lib/color-picker/tip.svg +23 -0
- package/lib/ellipsis/index.js +1 -1
- package/lib/ellipsis/index.js.map +1 -1
- package/lib/index.d.ts +1 -0
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +7 -0
- package/lib/index.js.map +1 -1
- package/lib/input/index.d.ts +1 -0
- package/lib/input/index.d.ts.map +1 -1
- package/lib/input/index.js +12 -0
- package/lib/input/index.js.map +1 -1
- package/lib/input/input.d.ts +20 -3
- package/lib/input/input.d.ts.map +1 -1
- package/lib/input/input.js +60 -39
- package/lib/input/input.js.map +1 -1
- package/lib/label/label.less +11 -0
- package/lib/locale/default.d.ts +1 -0
- package/lib/locale/default.d.ts.map +1 -1
- package/lib/locale/en_US.d.ts +1 -0
- package/lib/locale/en_US.d.ts.map +1 -1
- package/lib/locale/en_US.js +2 -1
- package/lib/locale/en_US.js.map +1 -1
- package/lib/locale/zh_CN.d.ts +1 -0
- package/lib/locale/zh_CN.d.ts.map +1 -1
- package/lib/locale/zh_CN.js +2 -1
- package/lib/locale/zh_CN.js.map +1 -1
- package/lib/query-form/Field/fieldsMap.d.ts +1 -1
- package/lib/select/select.d.ts +2 -1
- package/lib/select/select.d.ts.map +1 -1
- package/lib/select/select.js.map +1 -1
- package/lib/select/select.less +1 -4
- package/package.json +2 -1
package/es/input/input.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input.js","sourceRoot":"","sources":["../../src/input/input.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;
|
|
1
|
+
{"version":3,"file":"input.js","sourceRoot":"","sources":["../../src/input/input.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AAQxD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,eAAe,CAAA;AACpD,OAAO,UAAU,MAAM,YAAY,CAAA;AAEnC,OAAO,KAAK,MAAM,OAAO,CAAA;AA2BzB,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAgD,EAAE,EAAE;QAApD,EAAE,SAAS,EAAE,WAAW,OAAwB,EAAnB,KAAK,cAAlC,4BAAoC,CAAF;IAAmB,OAAA,CACzE,oBAAC,cAAc,QACZ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;QACpB,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,CAAC,CAAA;QAEvC,OAAO,CACL,oBAAC,SAAS,oBACJ,KAAK,IACT,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE;gBAC/B,CAAC,GAAG,SAAS,UAAU,CAAC,EAAE,WAAW,KAAK,SAAS;aACpD,CAAC,IACF,CACH,CAAA;IACH,CAAC,CACc,CAClB,CAAA;CAAA,CAAA;AAED,KAAK,CAAC,KAAK,GAAG,CAAC,EAAgD,EAAE,EAAE;QAApD,EAAE,SAAS,EAAE,WAAW,OAAwB,EAAnB,KAAK,cAAlC,4BAAoC,CAAF;IAAmB,OAAA,CAClE,oBAAC,cAAc,QACZ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;QACpB,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,CAAC,CAAA;QAEvC,OAAO,CACL,oBAAC,SAAS,CAAC,KAAK,oBACV,KAAK,IACT,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE;gBAC/B,CAAC,GAAG,SAAS,UAAU,CAAC,EAAE,WAAW,KAAK,SAAS;aACpD,CAAC,IACF,CACH,CAAA;IACH,CAAC,CACc,CAClB,CAAA;CAAA,CAAA;AACD,KAAK,CAAC,MAAM,GAAG,CAAC,EAAiD,EAAE,EAAE;QAArD,EAAE,SAAS,EAAE,WAAW,OAAyB,EAApB,KAAK,cAAlC,4BAAoC,CAAF;IAAoB,OAAA,CACpE,oBAAC,cAAc,QACZ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;QACpB,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,CAAC,CAAA;QAEvC,OAAO,CACL,oBAAC,SAAS,CAAC,MAAM,oBACX,KAAK,IACT,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE;gBAC/B,CAAC,GAAG,SAAS,UAAU,CAAC,EAAE,WAAW,KAAK,SAAS;aACpD,CAAC,IACF,CACH,CAAA;IACH,CAAC,CACc,CAClB,CAAA;CAAA,CAAA;AACD,KAAK,CAAC,QAAQ,GAAG,CAAC,EAAmD,EAAE,EAAE;QAAvD,EAAE,SAAS,EAAE,WAAW,OAA2B,EAAtB,KAAK,cAAlC,4BAAoC,CAAF;IAAsB,OAAA,CACxE,oBAAC,cAAc,QACZ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;QACpB,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,CAAC,CAAA;QAEvC,OAAO,CACL,oBAAC,SAAS,CAAC,QAAQ,oBACb,KAAK,IACT,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE;gBAC/B,CAAC,GAAG,SAAS,UAAU,CAAC,EAAE,WAAW,KAAK,SAAS;aACpD,CAAC,IACF,CACH,CAAA;IACH,CAAC,CACc,CAClB,CAAA;CAAA,CAAA;AACD,KAAK,CAAC,QAAQ,GAAG,CAAC,EAAmD,EAAE,EAAE;QAAvD,EAAE,SAAS,EAAE,WAAW,OAA2B,EAAtB,KAAK,cAAlC,4BAAoC,CAAF;IAAsB,OAAA,CACxE,oBAAC,cAAc,QACZ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;QACpB,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,CAAC,CAAA;QAEvC,OAAO,CACL,oBAAC,SAAS,CAAC,QAAQ,oBACb,KAAK,IACT,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE;gBAC/B,CAAC,GAAG,SAAS,UAAU,CAAC,EAAE,WAAW,KAAK,SAAS;aACpD,CAAC,IACF,CACH,CAAA;IACH,CAAC,CACc,CAClB,CAAA;CAAA,CAAA","sourcesContent":["import { ConfigConsumer } from 'antd/es/config-provider'\nimport type {\n GroupProps as AntdGroupProps,\n InputProps as AntdInputProps,\n TextAreaProps as AntdTextAreaProps,\n PasswordProps as AntdPasswordProps,\n SearchProps as AntdSearchProps,\n} from 'antd/es/input'\nimport { default as AntdInput } from 'antd/es/input'\nimport classNames from 'classnames'\n\nimport React from 'react'\n\nexport interface InputProps extends AntdInputProps {\n // 线框风格\n borderStyle?: 'outline'\n}\n\nexport interface GroupProps extends AntdGroupProps {\n // 线框风格\n borderStyle?: 'outline'\n}\n\nexport interface TextAreaProps extends AntdTextAreaProps {\n // 线框风格\n borderStyle?: 'outline'\n}\n\nexport interface PasswordProps extends AntdPasswordProps {\n // 线框风格\n borderStyle?: 'outline'\n}\n\nexport interface SearchProps extends AntdSearchProps {\n // 线框风格\n borderStyle?: 'outline'\n}\n\nexport const Input = ({ className, borderStyle, ...props }: InputProps) => (\n <ConfigConsumer>\n {({ getPrefixCls }) => {\n const prefixCls = getPrefixCls('input')\n\n return (\n <AntdInput\n {...props}\n className={classNames(className, {\n [`${prefixCls}-outline`]: borderStyle === 'outline',\n })}\n />\n )\n }}\n </ConfigConsumer>\n)\n\nInput.Group = ({ className, borderStyle, ...props }: GroupProps) => (\n <ConfigConsumer>\n {({ getPrefixCls }) => {\n const prefixCls = getPrefixCls('input')\n\n return (\n <AntdInput.Group\n {...props}\n className={classNames(className, {\n [`${prefixCls}-outline`]: borderStyle === 'outline',\n })}\n />\n )\n }}\n </ConfigConsumer>\n)\nInput.Search = ({ className, borderStyle, ...props }: SearchProps) => (\n <ConfigConsumer>\n {({ getPrefixCls }) => {\n const prefixCls = getPrefixCls('input')\n\n return (\n <AntdInput.Search\n {...props}\n className={classNames(className, {\n [`${prefixCls}-outline`]: borderStyle === 'outline',\n })}\n />\n )\n }}\n </ConfigConsumer>\n)\nInput.TextArea = ({ className, borderStyle, ...props }: TextAreaProps) => (\n <ConfigConsumer>\n {({ getPrefixCls }) => {\n const prefixCls = getPrefixCls('input')\n\n return (\n <AntdInput.TextArea\n {...props}\n className={classNames(className, {\n [`${prefixCls}-outline`]: borderStyle === 'outline',\n })}\n />\n )\n }}\n </ConfigConsumer>\n)\nInput.Password = ({ className, borderStyle, ...props }: PasswordProps) => (\n <ConfigConsumer>\n {({ getPrefixCls }) => {\n const prefixCls = getPrefixCls('input')\n\n return (\n <AntdInput.Password\n {...props}\n className={classNames(className, {\n [`${prefixCls}-outline`]: borderStyle === 'outline',\n })}\n />\n )\n }}\n </ConfigConsumer>\n)\n"]}
|
package/es/label/label.less
CHANGED
|
@@ -46,4 +46,15 @@
|
|
|
46
46
|
margin-left: 4px;
|
|
47
47
|
color: #8b919e;
|
|
48
48
|
}
|
|
49
|
+
|
|
50
|
+
.make-border-inherit-classes(@i: length(@preset-colors)) when (@i > 0) {
|
|
51
|
+
.make-border-inherit-classes(@i - 1);
|
|
52
|
+
@color: extract(@preset-colors, @i);
|
|
53
|
+
|
|
54
|
+
&-@{color} {
|
|
55
|
+
border-color: inherit;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.make-border-inherit-classes();
|
|
49
60
|
}
|
package/es/locale/en_US.js
CHANGED
package/es/locale/en_US.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"en_US.js","sourceRoot":"","sources":["../../src/locale/en_US.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,sBAAsB,CAAA;AAE/C,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAA;AAE9B,MAAM,KAAK,GAAG,KAAK,CAAC,EAAE,EAAE,YAAY,EAAE;IACpC,KAAK,EAAE;QACL,kBAAkB,EAAE,YAAY;QAChC,gBAAgB,EAAE,SAAS;KAC5B;IACD,KAAK,EAAE;QACL,WAAW,EAAE,yBAAyB;QACtC,YAAY,EAAE,eAAe;QAC7B,mBAAmB,EAAE,sBAAsB;QAC3C,cAAc,EAAE,iBAAiB;QACjC,SAAS,EAAE,uBAAuB;QAClC,MAAM,EAAE,mBAAmB;KAC5B;IACD,MAAM,EAAE;QACN,IAAI,EAAE,MAAM;KACb;IACD,SAAS,EAAE;QACT,KAAK,EAAE,0CAA0C;QACjD,KAAK,EAAE,0CAA0C;QACjD,KAAK,EAAE,yCAAyC;KACjD;IACD,YAAY,EAAE;QACZ,MAAM,EAAE,SAAS;KAClB;IACD,cAAc,EAAE;QACd,IAAI,EAAE,MAAM;KACb;
|
|
1
|
+
{"version":3,"file":"en_US.js","sourceRoot":"","sources":["../../src/locale/en_US.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,sBAAsB,CAAA;AAE/C,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAA;AAE9B,MAAM,KAAK,GAAG,KAAK,CAAC,EAAE,EAAE,YAAY,EAAE;IACpC,KAAK,EAAE;QACL,kBAAkB,EAAE,YAAY;QAChC,gBAAgB,EAAE,SAAS;KAC5B;IACD,KAAK,EAAE;QACL,WAAW,EAAE,yBAAyB;QACtC,YAAY,EAAE,eAAe;QAC7B,mBAAmB,EAAE,sBAAsB;QAC3C,cAAc,EAAE,iBAAiB;QACjC,SAAS,EAAE,uBAAuB;QAClC,MAAM,EAAE,mBAAmB;KAC5B;IACD,MAAM,EAAE;QACN,IAAI,EAAE,MAAM;KACb;IACD,SAAS,EAAE;QACT,KAAK,EAAE,0CAA0C;QACjD,KAAK,EAAE,0CAA0C;QACjD,KAAK,EAAE,yCAAyC;KACjD;IACD,YAAY,EAAE;QACZ,MAAM,EAAE,SAAS;KAClB;IACD,cAAc,EAAE;QACd,IAAI,EAAE,MAAM;KACb;IACD,WAAW,EAAE,EAAE;CAChB,CAAC,CAAA;AAEF,eAAe,KAAK,CAAA","sourcesContent":["import sourceLocale from 'antd/es/locale/en_US'\n\nimport { merge } from 'lodash'\n\nconst en_US = merge({}, sourceLocale, {\n Table: {\n loadingDescription: 'loading...',\n emptyDescription: 'No data',\n },\n Empty: {\n noGraphData: 'No graph data available',\n noPermission: 'No permission',\n createdSuccessfully: 'Created successfully',\n creationFailed: 'Creation failed',\n noNetwork: 'Network not connected',\n noData: 'No data available',\n },\n Handle: {\n more: 'more',\n },\n Exception: {\n '403': \"Sorry, we don't have access to this page\",\n '404': 'Sorry, there are no results on this page',\n '500': \"I'm sorry, the server reported an error\",\n },\n TntdCascader: {\n noDate: 'no date',\n },\n TntdSecondPage: {\n back: 'Back',\n },\n ColorPicker: {},\n})\n\nexport default en_US\n"]}
|
package/es/locale/zh_CN.js
CHANGED
package/es/locale/zh_CN.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"zh_CN.js","sourceRoot":"","sources":["../../src/locale/zh_CN.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,sBAAsB,CAAA;AAE/C,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAA;AAE9B,MAAM,KAAK,GAAG,KAAK,CAAC,EAAE,EAAE,YAAY,EAAE;IACpC,KAAK,EAAE;QACL,kBAAkB,EAAE,UAAU;QAC9B,gBAAgB,EAAE,MAAM;KACzB;IACD,KAAK,EAAE;QACL,WAAW,EAAE,MAAM;QACnB,YAAY,EAAE,MAAM;QACpB,mBAAmB,EAAE,MAAM;QAC3B,cAAc,EAAE,MAAM;QACtB,SAAS,EAAE,OAAO;QAClB,MAAM,EAAE,MAAM;KACf;IACD,MAAM,EAAE;QACN,IAAI,EAAE,IAAI;KACX;IACD,SAAS,EAAE;QACT,KAAK,EAAE,eAAe;QACtB,KAAK,EAAE,YAAY;QACnB,KAAK,EAAE,WAAW;KACnB;IACD,YAAY,EAAE;QACZ,MAAM,EAAE,MAAM;KACf;IACD,cAAc,EAAE;QACd,IAAI,EAAE,IAAI;KACX;
|
|
1
|
+
{"version":3,"file":"zh_CN.js","sourceRoot":"","sources":["../../src/locale/zh_CN.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,sBAAsB,CAAA;AAE/C,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAA;AAE9B,MAAM,KAAK,GAAG,KAAK,CAAC,EAAE,EAAE,YAAY,EAAE;IACpC,KAAK,EAAE;QACL,kBAAkB,EAAE,UAAU;QAC9B,gBAAgB,EAAE,MAAM;KACzB;IACD,KAAK,EAAE;QACL,WAAW,EAAE,MAAM;QACnB,YAAY,EAAE,MAAM;QACpB,mBAAmB,EAAE,MAAM;QAC3B,cAAc,EAAE,MAAM;QACtB,SAAS,EAAE,OAAO;QAClB,MAAM,EAAE,MAAM;KACf;IACD,MAAM,EAAE;QACN,IAAI,EAAE,IAAI;KACX;IACD,SAAS,EAAE;QACT,KAAK,EAAE,eAAe;QACtB,KAAK,EAAE,YAAY;QACnB,KAAK,EAAE,WAAW;KACnB;IACD,YAAY,EAAE;QACZ,MAAM,EAAE,MAAM;KACf;IACD,cAAc,EAAE;QACd,IAAI,EAAE,IAAI;KACX;IACD,WAAW,EAAE,EAAE;CAChB,CAAC,CAAA;AAEF,eAAe,KAAK,CAAA","sourcesContent":["import sourceLocale from 'antd/es/locale/zh_CN'\n\nimport { merge } from 'lodash'\n\nconst zh_CN = merge({}, sourceLocale, {\n Table: {\n loadingDescription: '数据加载中...',\n emptyDescription: '暂无数据',\n },\n Empty: {\n noGraphData: '暂无图表',\n noPermission: '暂无权限',\n createdSuccessfully: '创建成功',\n creationFailed: '创建失败',\n noNetwork: '网络未连接',\n noData: '暂无数据',\n },\n Handle: {\n more: '更多',\n },\n Exception: {\n '403': '很抱歉,暂无该页面访问权限',\n '404': '很抱歉,本页暂无结果',\n '500': '很抱歉,服务器报错',\n },\n TntdCascader: {\n noDate: '暂无数据',\n },\n TntdSecondPage: {\n back: '返回',\n },\n ColorPicker: {},\n})\n\nexport default zh_CN\n"]}
|
package/es/select/select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","sourceRoot":"","sources":["../../src/select/select.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"select.js","sourceRoot":"","sources":["../../src/select/select.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AACxC,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAA;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AAExD,OAAO,UAAU,MAAM,YAAY,CAAA;AAQnC,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EAAiD,EAAE,EAAE;QAArD,EAAE,SAAS,EAAE,WAAW,OAAyB,EAApB,KAAK,cAAlC,4BAAoC,CAAF;IACvD,OAAO,CACL,oBAAC,cAAc,QACZ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;QACpB,MAAM,SAAS,GAAG,YAAY,CAAC,QAAQ,CAAC,CAAA;QAExC,OAAO,CACL,oBAAC,UAAU,oBACL,KAAK,IACT,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE;gBAC/B,CAAC,GAAG,SAAS,UAAU,CAAC,EAAE,WAAW,KAAK,SAAS;aACpD,CAAC,IACF,CACH,CAAA;IACH,CAAC,CACc,CAClB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,QAAQ,GAAG,UAAU,CAAC,QAAQ,CAAA;AACrC,MAAM,CAAC,MAAM,GAAG,UAAU,CAAC,MAAM,CAAA","sourcesContent":["import React, { ReactNode } from 'react'\nimport { default as AntdSelect } from 'antd/es/select'\nimport { ConfigConsumer } from 'antd/es/config-provider'\nimport type { SelectProps as AntdSelectProps } from 'antd/es/select'\nimport classNames from 'classnames'\n\nexport interface SelectProps extends AntdSelectProps {\n // 线框风格\n borderStyle?: 'outline'\n children?: ReactNode\n}\n\nexport const Select = ({ className, borderStyle, ...props }: SelectProps) => {\n return (\n <ConfigConsumer>\n {({ getPrefixCls }) => {\n const prefixCls = getPrefixCls('select')\n\n return (\n <AntdSelect\n {...props}\n className={classNames(className, {\n [`${prefixCls}-outline`]: borderStyle === 'outline',\n })}\n />\n )\n }}\n </ConfigConsumer>\n )\n}\n\nSelect.OptGroup = AntdSelect.OptGroup\nSelect.Option = AntdSelect.Option\n"]}
|
package/es/select/select.less
CHANGED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export default function ColorPicker({ value: _value, onChange, visible: vs, allowClear, disabled, className, mode, style, size, placeholder, placement, locale, ...otherProps }: {
|
|
2
|
+
[x: string]: any;
|
|
3
|
+
value: any;
|
|
4
|
+
onChange: any;
|
|
5
|
+
visible: any;
|
|
6
|
+
allowClear: any;
|
|
7
|
+
disabled: any;
|
|
8
|
+
className: any;
|
|
9
|
+
mode?: string | undefined;
|
|
10
|
+
style?: {} | undefined;
|
|
11
|
+
size: any;
|
|
12
|
+
placeholder: any;
|
|
13
|
+
placement?: string | undefined;
|
|
14
|
+
locale: any;
|
|
15
|
+
}): JSX.Element;
|
|
16
|
+
//# sourceMappingURL=ColorPicker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColorPicker.d.ts","sourceRoot":"","sources":["../../src/color-picker/ColorPicker.js"],"names":[],"mappings":"AAmDA;;;;;;;;;;;;;;gBAiGC"}
|
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports["default"] = ColorPicker;
|
|
8
|
+
require("antd/lib/icon/style");
|
|
9
|
+
var _icon = _interopRequireDefault(require("antd/lib/icon"));
|
|
10
|
+
require("antd/lib/popover/style");
|
|
11
|
+
var _popover = _interopRequireDefault(require("antd/lib/popover"));
|
|
12
|
+
var _toLower2 = _interopRequireDefault(require("lodash/toLower"));
|
|
13
|
+
var _upperFirst2 = _interopRequireDefault(require("lodash/upperFirst"));
|
|
14
|
+
var _isObject2 = _interopRequireDefault(require("lodash/isObject"));
|
|
15
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
16
|
+
var _reactColor = require("react-color");
|
|
17
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
18
|
+
var _tip = _interopRequireDefault(require("./tip.svg"));
|
|
19
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
20
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
21
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
22
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
23
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
24
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
25
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
26
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
27
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
28
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
29
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
30
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
31
|
+
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
32
|
+
var t = {};
|
|
33
|
+
for (var p in s) {
|
|
34
|
+
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
35
|
+
}
|
|
36
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
37
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
38
|
+
}
|
|
39
|
+
return t;
|
|
40
|
+
};
|
|
41
|
+
var prefixCls = 'tnt-color-picker';
|
|
42
|
+
var modeMap = {
|
|
43
|
+
AlphaPicker: _reactColor.AlphaPicker,
|
|
44
|
+
BlockPicker: _reactColor.BlockPicker,
|
|
45
|
+
ChromePicker: _reactColor.ChromePicker,
|
|
46
|
+
CirclePicker: _reactColor.CirclePicker,
|
|
47
|
+
CompactPicker: _reactColor.CompactPicker,
|
|
48
|
+
GithubPicker: _reactColor.GithubPicker,
|
|
49
|
+
HuePicker: _reactColor.HuePicker,
|
|
50
|
+
MaterialPicker: _reactColor.MaterialPicker,
|
|
51
|
+
PhotoshopPicker: _reactColor.PhotoshopPicker,
|
|
52
|
+
SketchPicker: _reactColor.SketchPicker,
|
|
53
|
+
SliderPicker: _reactColor.SliderPicker,
|
|
54
|
+
SwatchesPicker: _reactColor.SwatchesPicker,
|
|
55
|
+
TwitterPicker: _reactColor.TwitterPicker
|
|
56
|
+
};
|
|
57
|
+
var propsFormatMap = {
|
|
58
|
+
SketchPicker: function SketchPicker(_a) {
|
|
59
|
+
var colors = _a.colors,
|
|
60
|
+
otherProps = __rest(_a, ["colors"]);
|
|
61
|
+
if (colors) {
|
|
62
|
+
return Object.assign({
|
|
63
|
+
presetColors: colors
|
|
64
|
+
}, otherProps);
|
|
65
|
+
}
|
|
66
|
+
return otherProps;
|
|
67
|
+
}
|
|
68
|
+
};
|
|
69
|
+
function ColorPicker(_a) {
|
|
70
|
+
var _cn;
|
|
71
|
+
var _value = _a.value,
|
|
72
|
+
onChange = _a.onChange,
|
|
73
|
+
vs = _a.visible,
|
|
74
|
+
allowClear = _a.allowClear,
|
|
75
|
+
disabled = _a.disabled,
|
|
76
|
+
className = _a.className,
|
|
77
|
+
_a$mode = _a.mode,
|
|
78
|
+
mode = _a$mode === void 0 ? 'sketch' : _a$mode,
|
|
79
|
+
_a$style = _a.style,
|
|
80
|
+
style = _a$style === void 0 ? {} : _a$style,
|
|
81
|
+
size = _a.size,
|
|
82
|
+
placeholder = _a.placeholder,
|
|
83
|
+
_a$placement = _a.placement,
|
|
84
|
+
placement = _a$placement === void 0 ? 'bottomLeft' : _a$placement,
|
|
85
|
+
locale = _a.locale,
|
|
86
|
+
otherProps = __rest(_a, ["value", "onChange", "visible", "allowClear", "disabled", "className", "mode", "style", "size", "placeholder", "placement", "locale"]);
|
|
87
|
+
var _useState = (0, _react.useState)(vs),
|
|
88
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
89
|
+
visible = _useState2[0],
|
|
90
|
+
setVisible = _useState2[1];
|
|
91
|
+
var _useState3 = (0, _react.useState)(_value),
|
|
92
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
93
|
+
value = _useState4[0],
|
|
94
|
+
setValue = _useState4[1];
|
|
95
|
+
(0, _react.useEffect)(function () {
|
|
96
|
+
setValue(_value);
|
|
97
|
+
}, [_value]);
|
|
98
|
+
var handleChange = (0, _react.useCallback)(function (color) {
|
|
99
|
+
var value;
|
|
100
|
+
if ((0, _isObject2["default"])(color === null || color === void 0 ? void 0 : color.rgb)) {
|
|
101
|
+
value = "rgba(".concat(color.rgb.r, ",").concat(color.rgb.g, ",").concat(color.rgb.b, ",").concat(color.rgb.a, ")");
|
|
102
|
+
}
|
|
103
|
+
if (onChange) {
|
|
104
|
+
onChange(value);
|
|
105
|
+
} else {
|
|
106
|
+
setValue(value);
|
|
107
|
+
}
|
|
108
|
+
}, [onChange]);
|
|
109
|
+
var domClick = (0, _react.useCallback)(function () {
|
|
110
|
+
setVisible(true);
|
|
111
|
+
}, []);
|
|
112
|
+
var doClear = (0, _react.useCallback)(function (e) {
|
|
113
|
+
e.stopPropagation();
|
|
114
|
+
handleChange();
|
|
115
|
+
}, [handleChange]);
|
|
116
|
+
var _useMemo = (0, _react.useMemo)(function () {
|
|
117
|
+
var modeKey = (0, _upperFirst2["default"])((0, _toLower2["default"])(mode)) + 'Picker' || 'SketchPicker';
|
|
118
|
+
var ModePicker = modeMap[modeKey] || _reactColor.SketchPicker;
|
|
119
|
+
return [ModePicker, propsFormatMap[modeKey] || function (p) {
|
|
120
|
+
return p;
|
|
121
|
+
}];
|
|
122
|
+
}, [mode]),
|
|
123
|
+
_useMemo2 = _slicedToArray(_useMemo, 2),
|
|
124
|
+
ModePicker = _useMemo2[0],
|
|
125
|
+
propsFormat = _useMemo2[1];
|
|
126
|
+
return _react["default"].createElement(_popover["default"], {
|
|
127
|
+
placement: placement,
|
|
128
|
+
trigger: "click",
|
|
129
|
+
visible: visible && !disabled,
|
|
130
|
+
onVisibleChange: setVisible,
|
|
131
|
+
content: _react["default"].createElement(ModePicker, Object.assign({}, propsFormat(otherProps), {
|
|
132
|
+
color: value,
|
|
133
|
+
onChangeComplete: handleChange
|
|
134
|
+
})),
|
|
135
|
+
overlayClassName: "".concat(prefixCls, "-pop")
|
|
136
|
+
}, _react["default"].createElement("div", {
|
|
137
|
+
className: (0, _classnames["default"])(prefixCls, className, (_cn = {}, _defineProperty(_cn, "".concat(prefixCls, "-selected"), !!value), _defineProperty(_cn, "".concat(prefixCls, "-disabled"), disabled), _defineProperty(_cn, "".concat(prefixCls, "-active"), visible && !disabled), _defineProperty(_cn, "".concat(prefixCls, "-sm"), size === 'small'), _defineProperty(_cn, "".concat(prefixCls, "-lg"), size === 'large'), _cn)),
|
|
138
|
+
style: style,
|
|
139
|
+
onClick: domClick
|
|
140
|
+
}, _react["default"].createElement("div", {
|
|
141
|
+
className: "".concat(prefixCls, "-inner")
|
|
142
|
+
}, !!value ? _react["default"].createElement("div", {
|
|
143
|
+
className: "".concat(prefixCls, "-value")
|
|
144
|
+
}, _react["default"].createElement("div", {
|
|
145
|
+
className: "".concat(prefixCls, "-value-bg"),
|
|
146
|
+
style: {
|
|
147
|
+
background: value
|
|
148
|
+
}
|
|
149
|
+
})) : _react["default"].createElement("div", {
|
|
150
|
+
className: "".concat(prefixCls, "-placeholder")
|
|
151
|
+
}, placeholder), _react["default"].createElement("span", {
|
|
152
|
+
className: "".concat(prefixCls, "-img")
|
|
153
|
+
}, _react["default"].createElement("img", {
|
|
154
|
+
src: _tip["default"]
|
|
155
|
+
})), allowClear && !!value && !disabled && _react["default"].createElement("span", {
|
|
156
|
+
className: "".concat(prefixCls, "-clear"),
|
|
157
|
+
onClick: doClear
|
|
158
|
+
}, _react["default"].createElement(_icon["default"], {
|
|
159
|
+
type: "close-circle",
|
|
160
|
+
theme: "filled"
|
|
161
|
+
})))));
|
|
162
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColorPicker.js","sourceRoot":"","sources":["../../src/color-picker/ColorPicker.js"],"names":[],"mappings":"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","sourcesContent":["import React, { useState, useCallback, useEffect, useMemo } from 'react'\nimport { Popover, Icon } from 'antd'\nimport {\n AlphaPicker,\n BlockPicker,\n ChromePicker,\n CirclePicker,\n CompactPicker,\n GithubPicker,\n HuePicker,\n MaterialPicker,\n PhotoshopPicker,\n SketchPicker,\n SliderPicker,\n SwatchesPicker,\n TwitterPicker,\n} from 'react-color'\nimport cn from 'classnames'\nimport { get, isObject, upperFirst, toLower } from 'lodash'\nimport imgSrc from './tip.svg'\n\nconst prefixCls = 'tnt-color-picker'\n\nconst modeMap = {\n AlphaPicker,\n BlockPicker,\n ChromePicker,\n CirclePicker,\n CompactPicker,\n GithubPicker,\n HuePicker,\n MaterialPicker,\n PhotoshopPicker,\n SketchPicker,\n SliderPicker,\n SwatchesPicker,\n TwitterPicker,\n}\n\nconst propsFormatMap = {\n SketchPicker: ({ colors, ...otherProps }) => {\n if (colors) {\n return {\n presetColors: colors,\n ...otherProps,\n }\n }\n return otherProps\n },\n}\n\nexport default function ColorPicker({\n value: _value,\n onChange,\n visible: vs,\n allowClear,\n disabled,\n className,\n mode = 'sketch',\n style = {},\n size,\n placeholder,\n placement = 'bottomLeft',\n locale,\n ...otherProps\n}) {\n const [visible, setVisible] = useState(vs)\n const [value, setValue] = useState(_value)\n\n useEffect(() => {\n setValue(_value)\n }, [_value])\n\n const handleChange = useCallback(\n (color) => {\n let value\n if (isObject(color?.rgb)) {\n value = `rgba(${color.rgb.r},${color.rgb.g},${color.rgb.b},${color.rgb.a})`\n }\n if (onChange) {\n onChange(value)\n } else {\n setValue(value)\n }\n },\n [onChange]\n )\n\n const domClick = useCallback(() => {\n setVisible(true)\n }, [])\n\n const doClear = useCallback(\n (e) => {\n e.stopPropagation()\n handleChange()\n },\n [handleChange]\n )\n\n const [ModePicker, propsFormat] = useMemo(() => {\n const modeKey = upperFirst(toLower(mode)) + 'Picker' || 'SketchPicker'\n const ModePicker = modeMap[modeKey] || SketchPicker\n return [ModePicker, propsFormatMap[modeKey] || ((p) => p)]\n }, [mode])\n\n return (\n <Popover\n placement={placement}\n trigger=\"click\"\n visible={visible && !disabled}\n onVisibleChange={setVisible}\n content={\n <ModePicker {...propsFormat(otherProps)} color={value} onChangeComplete={handleChange} />\n }\n overlayClassName={`${prefixCls}-pop`}\n >\n <div\n className={cn(prefixCls, className, {\n [`${prefixCls}-selected`]: !!value,\n [`${prefixCls}-disabled`]: disabled,\n [`${prefixCls}-active`]: visible && !disabled,\n [`${prefixCls}-sm`]: size === 'small',\n [`${prefixCls}-lg`]: size === 'large',\n })}\n style={style}\n onClick={domClick}\n >\n <div className={`${prefixCls}-inner`}>\n {!!value ? (\n <div className={`${prefixCls}-value`}>\n <div className={`${prefixCls}-value-bg`} style={{ background: value }}></div>\n </div>\n ) : (\n <div className={`${prefixCls}-placeholder`}>{placeholder}</div>\n )}\n <span className={`${prefixCls}-img`}>\n <img src={imgSrc} />\n </span>\n {allowClear && !!value && !disabled && (\n <span className={`${prefixCls}-clear`} onClick={doClear}>\n <Icon type=\"close-circle\" theme=\"filled\" />\n </span>\n )}\n </div>\n </div>\n </Popover>\n )\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/color-picker/index.js"],"names":[],"mappings":"AAMA,0DAQC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = _default;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
require("classnames");
|
|
9
|
+
var _LocaleReceiver = _interopRequireDefault(require("antd/lib/locale-provider/LocaleReceiver"));
|
|
10
|
+
var _ColorPicker = _interopRequireDefault(require("./ColorPicker"));
|
|
11
|
+
require("./index.less");
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
13
|
+
function _default(props) {
|
|
14
|
+
return _react["default"].createElement(_LocaleReceiver["default"], {
|
|
15
|
+
componentName: "ColorPicker"
|
|
16
|
+
}, function (locale) {
|
|
17
|
+
return _react["default"].createElement(_ColorPicker["default"], Object.assign({
|
|
18
|
+
locale: locale
|
|
19
|
+
}, props));
|
|
20
|
+
});
|
|
21
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/color-picker/index.js"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AACzB,sBAA2B;AAC3B,4FAAmE;AACnE,gEAAuC;AACvC,wBAAqB;AAErB,mBAAyB,KAAK;IAC5B,OAAO,CACL,8BAAC,wBAAc,IAAC,aAAa,EAAC,aAAa,IACxC,CAAC,MAAM,EAAE,EAAE;QACV,OAAO,8BAAC,qBAAW,kBAAC,MAAM,EAAE,MAAM,IAAM,KAAK,EAAI,CAAA;IACnD,CAAC,CACc,CAClB,CAAA;AACH,CAAC;AARD,4BAQC","sourcesContent":["import React from 'react'\nimport cn from 'classnames'\nimport LocaleReceiver from 'antd/lib/locale-provider/LocaleReceiver'\nimport ColorPicker from './ColorPicker'\nimport './index.less'\n\nexport default function (props) {\n return (\n <LocaleReceiver componentName=\"ColorPicker\">\n {(locale) => {\n return <ColorPicker locale={locale} {...props} />\n }}\n </LocaleReceiver>\n )\n}\n"]}
|
|
@@ -0,0 +1,234 @@
|
|
|
1
|
+
@prefixCls: ~'tnt-color-picker';
|
|
2
|
+
|
|
3
|
+
.color-picker-size(@input-height, @input-padding-horizontal, @font-size) {
|
|
4
|
+
height: @input-height;
|
|
5
|
+
line-height: @input-height - 2px;
|
|
6
|
+
.@{prefixCls}-value {
|
|
7
|
+
height: @input-height - 4px;
|
|
8
|
+
line-height: @input-height - 4px;
|
|
9
|
+
}
|
|
10
|
+
.@{prefixCls}-placeholder {
|
|
11
|
+
height: @input-height - 2px;
|
|
12
|
+
padding: 0 @input-padding-horizontal;
|
|
13
|
+
font-size: @font-size;
|
|
14
|
+
}
|
|
15
|
+
.@{prefixCls}-img {
|
|
16
|
+
width: @input-height;
|
|
17
|
+
height: @input-height - 2px;
|
|
18
|
+
}
|
|
19
|
+
.@{prefixCls}-clear {
|
|
20
|
+
right: @input-height / 2 - 8px;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.hover(@color: @input-hover-border-color) {
|
|
25
|
+
border-color: @color;
|
|
26
|
+
.@{prefixCls}-img {
|
|
27
|
+
border-left-color: @color;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.active(@color: @outline-color) {
|
|
32
|
+
border-color: ~`colorPalette('@{color}', 5) `;
|
|
33
|
+
outline: 0;
|
|
34
|
+
box-shadow: @input-outline-offset @outline-blur-size @outline-width fade(@color, 20%);
|
|
35
|
+
.@{prefixCls}-img {
|
|
36
|
+
border-left-color: ~`colorPalette('@{color}', 5) `;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.@{prefixCls} {
|
|
41
|
+
box-sizing: border-box;
|
|
42
|
+
display: inline-block;
|
|
43
|
+
border: @border-width-base @border-style-base @select-border-color;
|
|
44
|
+
border-radius: @border-radius-base;
|
|
45
|
+
cursor: pointer;
|
|
46
|
+
position: relative;
|
|
47
|
+
width: 100%;
|
|
48
|
+
outline: 0;
|
|
49
|
+
list-style: none;
|
|
50
|
+
|
|
51
|
+
.@{prefixCls}-inner {
|
|
52
|
+
display: flex;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.@{prefixCls}-value {
|
|
56
|
+
margin: 1px;
|
|
57
|
+
flex: 1;
|
|
58
|
+
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAADFJREFUOE9jZGBgEGHAD97gk2YcNYBhmIQBgWSAP52AwoAQwJvQRg1gACckQoC2gQgAIF8IscwEtKYAAAAASUVORK5CYII=')
|
|
59
|
+
left center;
|
|
60
|
+
&-bg {
|
|
61
|
+
width: 100%;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.@{prefixCls}-placeholder {
|
|
66
|
+
color: @input-placeholder-color;
|
|
67
|
+
flex: 1;
|
|
68
|
+
overflow: hidden;
|
|
69
|
+
text-overflow: ellipsis;
|
|
70
|
+
word-break: break-all;
|
|
71
|
+
white-space: nowrap;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
.@{prefixCls}-value-bg,
|
|
75
|
+
.@{prefixCls}-placeholder {
|
|
76
|
+
&::after {
|
|
77
|
+
display: inline-block;
|
|
78
|
+
width: 0;
|
|
79
|
+
visibility: hidden;
|
|
80
|
+
content: '.';
|
|
81
|
+
pointer-events: none;
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.@{prefixCls}-img {
|
|
86
|
+
border-left: 1px solid @border-color-base;
|
|
87
|
+
background: #fff;
|
|
88
|
+
text-align: center;
|
|
89
|
+
img {
|
|
90
|
+
margin-top: -4px;
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.color-picker-size(@input-height-base, @input-padding-horizontal-base, @font-size-base);
|
|
95
|
+
|
|
96
|
+
&-disabled {
|
|
97
|
+
background: @input-disabled-bg;
|
|
98
|
+
cursor: not-allowed;
|
|
99
|
+
.@{prefixCls}-img {
|
|
100
|
+
background: #e9edf3;
|
|
101
|
+
}
|
|
102
|
+
.@{prefixCls}-placeholder {
|
|
103
|
+
color: @disabled-color;
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
&-clear {
|
|
108
|
+
position: absolute;
|
|
109
|
+
top: 50%;
|
|
110
|
+
width: 16px;
|
|
111
|
+
height: 16px;
|
|
112
|
+
margin-top: -7px;
|
|
113
|
+
background: @component-background;
|
|
114
|
+
cursor: pointer;
|
|
115
|
+
color: @disabled-color;
|
|
116
|
+
border-radius: 16px;
|
|
117
|
+
font-size: @font-size-sm;
|
|
118
|
+
line-height: 12px;
|
|
119
|
+
text-align: center;
|
|
120
|
+
display: none;
|
|
121
|
+
transition: color 0.3s ease, opacity 0.15s ease;
|
|
122
|
+
&:hover {
|
|
123
|
+
color: @text-color-secondary;
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
&:hover {
|
|
128
|
+
.@{prefixCls}-clear {
|
|
129
|
+
display: block;
|
|
130
|
+
}
|
|
131
|
+
.hover();
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
&-active {
|
|
135
|
+
.active();
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
&-lg {
|
|
139
|
+
.color-picker-size(@input-height-lg, @input-padding-horizontal-lg, @font-size-lg);
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
&-sm {
|
|
143
|
+
.color-picker-size(@input-height-sm, @input-padding-horizontal-sm, @font-size-base);
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
&-pop {
|
|
147
|
+
max-width: 100% !important;
|
|
148
|
+
padding: 0 !important;
|
|
149
|
+
.ant-popover {
|
|
150
|
+
&-inner {
|
|
151
|
+
&-content {
|
|
152
|
+
padding: 10px;
|
|
153
|
+
& > div > div {
|
|
154
|
+
box-shadow: none !important;
|
|
155
|
+
}
|
|
156
|
+
}
|
|
157
|
+
}
|
|
158
|
+
&-arrow {
|
|
159
|
+
display: none;
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
.twitter-picker {
|
|
163
|
+
width: 252px !important;
|
|
164
|
+
box-shadow: none !important;
|
|
165
|
+
border-width: 0 !important;
|
|
166
|
+
margin: 0 -5px -5px 0 !important;
|
|
167
|
+
> div {
|
|
168
|
+
display: none;
|
|
169
|
+
&:last-child {
|
|
170
|
+
display: block;
|
|
171
|
+
padding: 0 !important;
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
}
|
|
175
|
+
.sketch-picker {
|
|
176
|
+
box-shadow: none !important;
|
|
177
|
+
padding: 0 !important;
|
|
178
|
+
.flexbox-fix {
|
|
179
|
+
input {
|
|
180
|
+
box-sizing: content-box;
|
|
181
|
+
}
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
.block-picker {
|
|
185
|
+
box-shadow: none !important;
|
|
186
|
+
width: 150px;
|
|
187
|
+
> div:first-child {
|
|
188
|
+
display: none;
|
|
189
|
+
}
|
|
190
|
+
> div:last-child {
|
|
191
|
+
padding: 10px 0 0 !important;
|
|
192
|
+
}
|
|
193
|
+
}
|
|
194
|
+
.chrome-picker {
|
|
195
|
+
box-shadow: none !important;
|
|
196
|
+
> div:last-child {
|
|
197
|
+
padding: 16px 0 0 !important;
|
|
198
|
+
}
|
|
199
|
+
}
|
|
200
|
+
.compact-picker {
|
|
201
|
+
padding: 0 !important;
|
|
202
|
+
.flexbox-fix {
|
|
203
|
+
padding: 0 !important;
|
|
204
|
+
input {
|
|
205
|
+
box-sizing: content-box;
|
|
206
|
+
}
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
.material-picker {
|
|
210
|
+
padding: 0 !important;
|
|
211
|
+
}
|
|
212
|
+
.swatches-picker {
|
|
213
|
+
width: 301px !important;
|
|
214
|
+
& > div > div {
|
|
215
|
+
box-shadow: none !important;
|
|
216
|
+
& > div > div {
|
|
217
|
+
padding: 0 !important;
|
|
218
|
+
}
|
|
219
|
+
}
|
|
220
|
+
}
|
|
221
|
+
.slider-picker {
|
|
222
|
+
width: 300px;
|
|
223
|
+
}
|
|
224
|
+
.github-picker {
|
|
225
|
+
padding: 0 !important;
|
|
226
|
+
border: none !important;
|
|
227
|
+
box-shadow: none !important;
|
|
228
|
+
background: transparent !important;
|
|
229
|
+
& > div {
|
|
230
|
+
display: none;
|
|
231
|
+
}
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<svg width="13px" height="14px" viewBox="0 0 13 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
|
3
|
+
<title>编组</title>
|
|
4
|
+
<g id="云图3.3.1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
|
5
|
+
<g id="知识建模-实体定义02" transform="translate(-682.000000, -897.000000)" fill="#A0A6B1" fill-rule="nonzero">
|
|
6
|
+
<g id="编组" transform="translate(241.000000, 106.000000)">
|
|
7
|
+
<g id="内容" transform="translate(17.500000, 25.500000)">
|
|
8
|
+
<g id="编组-3" transform="translate(0.500000, 576.000000)">
|
|
9
|
+
<g id="编组-10" transform="translate(59.500000, 182.500000)">
|
|
10
|
+
<g id="编组-72" transform="translate(44.500000, 0.000000)">
|
|
11
|
+
<g id="编组-14" transform="translate(312.000000, 0.000000)">
|
|
12
|
+
<g id="编组" transform="translate(7.000000, 7.000000)">
|
|
13
|
+
<path d="M11.2681485,11.65 C11.6823621,11.65 12.0181485,11.9857864 12.0181485,12.4 C12.0181485,12.7796958 11.7359946,13.093491 11.3699191,13.1431534 L11.2681485,13.15 L1.2681485,13.15 C0.853934938,13.15 0.5181485,12.8142136 0.5181485,12.4 C0.5181485,12.0203042 0.800302382,11.706509 1.16637794,11.6568466 L1.2681485,11.65 L11.2681485,11.65 Z M6.50226506,0.548371285 L6.58638309,0.620989914 L7.43486985,1.46951268 L10.8289799,4.86361968 C11.1218726,5.15651219 11.1218735,5.6313848 10.8289818,5.92427838 L10.8289818,5.92427838 L6.16209179,10.5911984 C5.86919894,10.8840931 5.39432407,10.884094 5.10143015,10.5912003 L5.10143015,10.5912003 L1.70731715,7.19709032 C1.41442424,6.90419767 1.41442353,6.42932481 1.70731555,6.13643128 L1.70731555,6.13643128 L5.8441485,1.999317 L5.52571691,1.68164409 C5.23282535,1.38874921 5.23282804,0.913875476 5.52572291,0.620983914 C5.79199098,0.354718858 6.2086548,0.330515164 6.50226506,0.548371285 Z M10.9,7.6 C11.7,8.35816 12.1,8.95816 12.1,9.4 C12.1,10.06273 11.56273,10.6 10.9,10.6 C10.23727,10.6 9.7,10.06273 9.7,9.4 C9.7,8.95816 10.09999,8.35816 10.9,7.6 Z M6.904,3.06 L4.7771485,5.185317 L8.2901485,6.340317 L9.238,5.394 L6.904,3.06 Z" id="形状结合"></path>
|
|
14
|
+
</g>
|
|
15
|
+
</g>
|
|
16
|
+
</g>
|
|
17
|
+
</g>
|
|
18
|
+
</g>
|
|
19
|
+
</g>
|
|
20
|
+
</g>
|
|
21
|
+
</g>
|
|
22
|
+
</g>
|
|
23
|
+
</svg>
|
package/lib/ellipsis/index.js
CHANGED
|
@@ -74,7 +74,7 @@ var _default = function _default(props) {
|
|
|
74
74
|
if (elementRef.current) {
|
|
75
75
|
setLineHeight(getComputedStyle(elementRef.current, null).getPropertyValue('line-height'));
|
|
76
76
|
}
|
|
77
|
-
}
|
|
77
|
+
});
|
|
78
78
|
// original Node
|
|
79
79
|
var inner = typeof children === 'string' ? children : _popover ? content : title;
|
|
80
80
|
// for className
|