techsbcn-storybook 2.12.0 → 2.13.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.
package/dist/index.js
CHANGED
|
@@ -139,15 +139,17 @@ var SearchComponent = (props) => {
|
|
|
139
139
|
setAnchorEl(null);
|
|
140
140
|
};
|
|
141
141
|
const randId = Math.random().toString(36).substring(7);
|
|
142
|
+
const inlineExtraActions = !!props.extraActions && !!props.inlineExtraActions;
|
|
143
|
+
const extraActions = props.extraActions && /* @__PURE__ */ React10__default.default.createElement(material.Box, { className: "extra-actions", sx: { display: "flex", flexWrap: "wrap", gap: 1, mt: inlineExtraActions ? 0 : 2 } }, props.extraActions.map((action, i) => /* @__PURE__ */ React10__default.default.createElement(React10__default.default.Fragment, { key: i }, action.action)));
|
|
142
144
|
return /* @__PURE__ */ React10__default.default.createElement(material.Box, { className: `search-component ${props.className}` }, /* @__PURE__ */ React10__default.default.createElement(material.Box, { sx: { mb: props.divider ? 2 : 0, px: 2 } }, /* @__PURE__ */ React10__default.default.createElement(material.Grid, { container: true, sx: { alignItems: "center" } }, /* @__PURE__ */ React10__default.default.createElement(
|
|
143
145
|
material.Grid,
|
|
144
146
|
{
|
|
145
147
|
size: {
|
|
146
148
|
xs: props.actions ? 8 : 12,
|
|
147
|
-
md: props.actions && props.searchBar ? 4 : props.searchBar ? 7 : props.actions ? 6 : 12
|
|
149
|
+
md: inlineExtraActions ? "grow" : props.actions && props.searchBar ? 4 : props.searchBar ? 7 : props.actions ? 6 : 12
|
|
148
150
|
}
|
|
149
151
|
},
|
|
150
|
-
/* @__PURE__ */ React10__default.default.createElement(
|
|
152
|
+
/* @__PURE__ */ React10__default.default.createElement(material.Box, { sx: { display: "flex", alignItems: "center", flexWrap: "wrap", gap: 2 } }, /* @__PURE__ */ React10__default.default.createElement(
|
|
151
153
|
material.Box,
|
|
152
154
|
{
|
|
153
155
|
sx: {
|
|
@@ -158,7 +160,7 @@ var SearchComponent = (props) => {
|
|
|
158
160
|
className: `${props.enableAfter ? "main-background-color-after" : ""} title`
|
|
159
161
|
},
|
|
160
162
|
props.title
|
|
161
|
-
)
|
|
163
|
+
), inlineExtraActions && extraActions)
|
|
162
164
|
), props.actions && /* @__PURE__ */ React10__default.default.createElement(material.Grid, { size: { xs: props.title ? 4 : 12 }, sx: { display: { xs: "block", md: "none" } } }, /* @__PURE__ */ React10__default.default.createElement(material.Box, { sx: { display: { xs: "none", md: "flex" } } }, ActionsList(props.actions)), /* @__PURE__ */ React10__default.default.createElement(material.Box, { sx: { display: { xs: "flex", md: "none" } } }, props.actions.length > 1 ? /* @__PURE__ */ React10__default.default.createElement(material.Box, { sx: { ml: "auto" } }, /* @__PURE__ */ React10__default.default.createElement(
|
|
163
165
|
material.IconButton,
|
|
164
166
|
{
|
|
@@ -185,27 +187,36 @@ var SearchComponent = (props) => {
|
|
|
185
187
|
className: "search-menu-actions"
|
|
186
188
|
},
|
|
187
189
|
props.actions.map((action, i) => /* @__PURE__ */ React10__default.default.createElement(material.MenuItem, { key: i, className: "wrapper-actions" }, /* @__PURE__ */ React10__default.default.createElement(material.Box, { className: "btn-action main-color", sx: { color: "primary.main" } }, action.action)))
|
|
188
|
-
)) : /* @__PURE__ */ React10__default.default.createElement(material.Box, { sx: { ml: "auto" }, className: `wrapper-actions ${props.title ? "min-action-width" : ""}` }, ActionsList(props.actions)))), (props.searchBar || props.filters || props.actions) && /* @__PURE__ */ React10__default.default.createElement(
|
|
189
|
-
material.
|
|
190
|
+
)) : /* @__PURE__ */ React10__default.default.createElement(material.Box, { sx: { ml: "auto" }, className: `wrapper-actions ${props.title ? "min-action-width" : ""}` }, ActionsList(props.actions)))), (props.searchBar || props.filters || props.actions) && /* @__PURE__ */ React10__default.default.createElement(
|
|
191
|
+
material.Grid,
|
|
190
192
|
{
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
width: "100%",
|
|
195
|
-
...(props.searchBar || props.filters) && { mt: { xs: 2, md: 0 } }
|
|
193
|
+
size: {
|
|
194
|
+
xs: 12,
|
|
195
|
+
md: inlineExtraActions ? "auto" : props.actions && props.searchBar ? 8 : props.actions ? 6 : 5
|
|
196
196
|
}
|
|
197
197
|
},
|
|
198
|
-
|
|
199
|
-
!!props.fixedOpen || props.filters && props.searchBar && /* @__PURE__ */ React10__default.default.createElement(
|
|
198
|
+
/* @__PURE__ */ React10__default.default.createElement(material.Box, { sx: { display: "flex", alignItems: "center" } }, /* @__PURE__ */ React10__default.default.createElement(
|
|
200
199
|
material.Box,
|
|
201
200
|
{
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
201
|
+
sx: {
|
|
202
|
+
ml: "auto",
|
|
203
|
+
display: "flex",
|
|
204
|
+
width: "100%",
|
|
205
|
+
...(props.searchBar || props.filters) && { mt: { xs: 2, md: 0 } }
|
|
206
|
+
}
|
|
205
207
|
},
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
208
|
+
props.searchBar,
|
|
209
|
+
!!props.fixedOpen || props.filters && props.searchBar && /* @__PURE__ */ React10__default.default.createElement(
|
|
210
|
+
material.Box,
|
|
211
|
+
{
|
|
212
|
+
onClick: () => setIsOpen(!isOpen),
|
|
213
|
+
className: "tune-btn main-background-color",
|
|
214
|
+
sx: { bgcolor: "primary.main", color: "primary.contrastText", "&:hover": { boxShadow: 4 } }
|
|
215
|
+
},
|
|
216
|
+
/* @__PURE__ */ React10__default.default.createElement(material.Badge, { badgeContent: props.activeFiltersCount, color: "error" }, /* @__PURE__ */ React10__default.default.createElement(iconsMaterial.Tune, null))
|
|
217
|
+
)
|
|
218
|
+
), props.actions && /* @__PURE__ */ React10__default.default.createElement(material.Box, { sx: { display: { xs: "none", md: "block" } }, className: "wrapper-actions" }, ActionsList(props.actions)))
|
|
219
|
+
)), !inlineExtraActions && extraActions), props.divider && /* @__PURE__ */ React10__default.default.createElement(material.Divider, null), /* @__PURE__ */ React10__default.default.createElement(material.Collapse, { in: isOpen }, /* @__PURE__ */ React10__default.default.createElement(material.Box, { className: "filters", sx: { px: 2, mt: 2, mb: props.divider ? 0 : 1 } }, /* @__PURE__ */ React10__default.default.createElement(material.Grid, { container: true, spacing: 3, sx: { justifyContent: "end" } }, props.filters && props.filters.length > 0 && props.filters.map((filter, i) => /* @__PURE__ */ React10__default.default.createElement(material.Grid, { key: i, size: { xs: 12, sm: props.filtersSize ?? 6, xl: props.filtersSize ?? 4 } }, filter.doubleFilter ? DoubleFilter(filter.doubleFilter) : filter.singleFilter))))));
|
|
209
220
|
};
|
|
210
221
|
|
|
211
222
|
// src/components/wrappers/LinearProgressComponent/LinearProgressComponent.scss
|