@brizy/media-gallery
Version:
104 lines (103 loc) • 2.97 kB
JavaScript
function _define_property(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _object_spread(target) {
for(var i = 1; i < arguments.length; i++){
var source = arguments[i] != null ? arguments[i] : {};
var ownKeys = Object.keys(source);
if (typeof Object.getOwnPropertySymbols === "function") {
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
}));
}
ownKeys.forEach(function(key) {
_define_property(target, key, source[key]);
});
}
return target;
}
import React, { useMemo } from "react";
import { CloseOulined } from "@brizy/ui-icons/lib/icons/CloseOulined";
import { Search as IconSearch } from "@brizy/ui-icons/lib/icons/Search";
import { Card } from "@brizy/ui/lib/Card";
import { Align } from "@brizy/ui/lib/Align";
import { Icon } from "@brizy/ui/lib/Icon";
import { Text } from "@brizy/ui/lib/Input/Text";
import { useTranslation } from "../../../../locale/useTranslation";
import { Space } from "@brizy/ui/lib/Space";
var cardWrapperSize = {
custom: [
0,
0,
0,
15
]
};
var spacing = [
0,
9,
0,
0
];
var closeSpacing = [
0,
0,
4,
0
];
var inputTheme = {
color: "white",
background: "transparent"
};
export var Search = function(param) {
var value = param.value, onChange = param.onChange, onClose = param.onClose;
var t = useTranslation().t;
var suffix = useMemo(function() {
return value ? {
suffix: /*#__PURE__*/ React.createElement(Space, {
spacing: closeSpacing
}, /*#__PURE__*/ React.createElement(Icon, {
source: CloseOulined,
color: "white",
size: "8px",
onClick: onClose
}))
} : {};
}, [
value,
onClose
]);
return /*#__PURE__*/ React.createElement(Card, {
size: cardWrapperSize,
borderStyle: "none",
width: "100%",
height: "65px",
color: "gray-darkest"
}, /*#__PURE__*/ React.createElement(Align, {
alignY: "center"
}, /*#__PURE__*/ React.createElement(Text, _object_spread({
value: value,
onChange: onChange,
placeholder: t("Search uploaded media"),
size: "large",
theme: inputTheme,
border: "none",
prefix: /*#__PURE__*/ React.createElement(Space, {
spacing: spacing
}, /*#__PURE__*/ React.createElement(Icon, {
source: IconSearch,
color: "white",
size: "16px"
}))
}, suffix))));
};