@artsy/palette-mobile 3.3.0 → 3.4.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.
|
@@ -110,7 +110,7 @@ exports.Input = (0, react_1.forwardRef)(({ containerStyle, description, descript
|
|
|
110
110
|
borderWidth: 1,
|
|
111
111
|
borderColor: color((0, exports.computeBorderColor)({ disabled, error: !!error, focused })),
|
|
112
112
|
minHeight: multiline ? exports.INPUT_HEIGHT_MULTILINE : exports.INPUT_HEIGHT,
|
|
113
|
-
backgroundColor: disabled ? color("black5") : color("
|
|
113
|
+
backgroundColor: disabled ? color("black5") : color("background"),
|
|
114
114
|
},
|
|
115
115
|
style,
|
|
116
116
|
], children: [renderLeftHandSection?.(), !!icon && ((0, jsx_runtime_1.jsx)(atoms_1.Flex, { pl: "1", justifyContent: "center", flexGrow: 0, backgroundColor: "background", children: icon })), (0, jsx_runtime_1.jsxs)(atoms_1.Flex, { flex: 1, children: [placeholderMeasuringHack, (0, jsx_runtime_1.jsx)(StyledInput, { multiline: multiline,
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: import("react").ForwardRefExoticComponent<import("./Input").InputProps & import("react").RefAttributes<import("react-native").TextInput>>;
|
|
5
|
+
};
|
|
6
|
+
export default _default;
|
|
7
|
+
export declare const Styled: () => JSX.Element;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.Styled = void 0;
|
|
4
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
const svgs_1 = require("../../svgs");
|
|
6
|
+
const atoms_1 = require("../../atoms");
|
|
7
|
+
const storybookHelpers_1 = require("../../storybookHelpers");
|
|
8
|
+
const Input_1 = require("./Input");
|
|
9
|
+
exports.default = {
|
|
10
|
+
title: "Input",
|
|
11
|
+
component: Input_1.Input,
|
|
12
|
+
};
|
|
13
|
+
const Styled = () => ((0, jsx_runtime_1.jsx)(storybookHelpers_1.List, { style: { marginLeft: 50 }, contentContainerStyle: { alignItems: "flex-start" }, children: (0, jsx_runtime_1.jsxs)(atoms_1.Flex, { width: 300, height: 120, children: [(0, jsx_runtime_1.jsx)(Input_1.Input, {}), (0, jsx_runtime_1.jsx)(Input_1.Input, { style: { borderWidth: 0 }, icon: (0, jsx_runtime_1.jsx)(svgs_1.MagnifyingGlassIcon, {}), focusable: true, placeholder: "Search", enableClearButton: true })] }) }));
|
|
14
|
+
exports.Styled = Styled;
|
|
@@ -6,6 +6,6 @@ const hooks_1 = require("../hooks");
|
|
|
6
6
|
const Icon_1 = require("./Icon");
|
|
7
7
|
const MagnifyingGlassIcon = ({ fill, ...restProps }) => {
|
|
8
8
|
const color = (0, hooks_1.useColor)();
|
|
9
|
-
return ((0, jsx_runtime_1.jsx)(Icon_1.Icon, { ...restProps, viewBox: "0 0 18 18", children: (0, jsx_runtime_1.jsx)(Icon_1.Path, { d: "M11.5 3a3.5 3.5 0 1 1 0 7 3.5 3.5 0 0 1 0-7zm0-1A4.5 4.5 0 1 0 16 6.5 4.49 4.49 0 0 0 11.5 2zM9.442 9.525l-.88-.88L2.06 15.06l.88.88 6.502-6.415z", fill: color(fill), fillRule: "nonzero" }) }));
|
|
9
|
+
return ((0, jsx_runtime_1.jsx)(Icon_1.Icon, { ...restProps, viewBox: "0 0 18 18", children: (0, jsx_runtime_1.jsx)(Icon_1.Path, { d: "M11.5 3a3.5 3.5 0 1 1 0 7 3.5 3.5 0 0 1 0-7zm0-1A4.5 4.5 0 1 0 16 6.5 4.49 4.49 0 0 0 11.5 2zM9.442 9.525l-.88-.88L2.06 15.06l.88.88 6.502-6.415z", fill: color(fill ?? "onBackgroundHigh"), fillRule: "nonzero" }) }));
|
|
10
10
|
};
|
|
11
11
|
exports.MagnifyingGlassIcon = MagnifyingGlassIcon;
|
package/dist/svgs/XCircleIcon.js
CHANGED
|
@@ -6,6 +6,6 @@ const Icon_1 = require("./Icon");
|
|
|
6
6
|
const hooks_1 = require("../hooks");
|
|
7
7
|
const XCircleIcon = ({ fill, ...restProps }) => {
|
|
8
8
|
const color = (0, hooks_1.useColor)();
|
|
9
|
-
return ((0, jsx_runtime_1.jsxs)(Icon_1.Icon, { ...restProps, viewBox: "0 0 18 18", children: [(0, jsx_runtime_1.jsx)(Icon_1.Circle, { cx: 9, cy: 9, r: 9, fill: "
|
|
9
|
+
return ((0, jsx_runtime_1.jsxs)(Icon_1.Icon, { ...restProps, viewBox: "0 0 18 18", children: [(0, jsx_runtime_1.jsx)(Icon_1.Circle, { cx: 9, cy: 9, r: 9, fill: color("background") }), (0, jsx_runtime_1.jsx)(Icon_1.Path, { fillRule: "evenodd", clipRule: "evenodd", d: "M9 16C12.866 16 16 12.866 16 9C16 5.13401 12.866 2 9 2C5.13401 2 2 5.13401 2 9C2 12.866 5.13401 16 9 16ZM12.3588 12.3587C12.0659 12.6516 11.591 12.6516 11.2981 12.3587L9 10.0607L6.70189 12.3588C6.409 12.6517 5.93413 12.6517 5.64123 12.3588C5.34834 12.0659 5.34834 11.591 5.64123 11.2981L7.93934 8.99999L5.64124 6.70189C5.34835 6.409 5.34835 5.93412 5.64124 5.64123C5.93413 5.34834 6.40901 5.34834 6.7019 5.64123L9 7.93933L11.2981 5.64125C11.591 5.34835 12.0659 5.34835 12.3587 5.64125C12.6516 5.93414 12.6516 6.40901 12.3587 6.70191L10.0607 8.99999L12.3588 11.2981C12.6516 11.591 12.6516 12.0659 12.3588 12.3587Z", fill: color(fill) })] }));
|
|
10
10
|
};
|
|
11
11
|
exports.XCircleIcon = XCircleIcon;
|