ywana-core8 0.0.731 → 0.0.733

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.cjs CHANGED
@@ -2479,6 +2479,71 @@ var ColorField = function ColorField(props) {
2479
2479
  }));
2480
2480
  };
2481
2481
 
2482
+ /**
2483
+ * Multi Selector
2484
+ */
2485
+
2486
+ var MultiSelector = function MultiSelector(props) {
2487
+ var _props$options = props.options,
2488
+ options = _props$options === void 0 ? [] : _props$options,
2489
+ className = props.className;
2490
+
2491
+ var _useState = React.useState([]),
2492
+ selections = _useState[0],
2493
+ setSelections = _useState[1];
2494
+
2495
+ React.useEffect(function () {
2496
+ var initialSelections = options.filter(function (option) {
2497
+ return option.selected === true;
2498
+ }).map(function (option) {
2499
+ return option.value;
2500
+ });
2501
+ setSelections(initialSelections);
2502
+ }, []);
2503
+
2504
+ function toggleSelection(value) {
2505
+ var onChange = props.onChange;
2506
+ var next = selections.includes(value) ? selections.filter(function (item) {
2507
+ return item != value;
2508
+ }) : selections.concat([value]);
2509
+ setSelections(next);
2510
+ if (onChange) onChange(next);
2511
+ }
2512
+
2513
+ var items = options.map(function (option) {
2514
+ return _extends({}, option, {
2515
+ selected: selections.includes(option.value),
2516
+ onToggle: toggleSelection
2517
+ });
2518
+ });
2519
+ return /*#__PURE__*/React__default["default"].createElement("ul", {
2520
+ className: "multiselector " + className
2521
+ }, items.map(function (option) {
2522
+ return /*#__PURE__*/React__default["default"].createElement(ToggleButton, option);
2523
+ }));
2524
+ };
2525
+ /**
2526
+ * Toggle Button
2527
+ */
2528
+
2529
+ var ToggleButton = function ToggleButton(props) {
2530
+ var label = props.label,
2531
+ value = props.value,
2532
+ _props$selected = props.selected,
2533
+ selected = _props$selected === void 0 ? false : _props$selected,
2534
+ onToggle = props.onToggle;
2535
+
2536
+ function toggle() {
2537
+ if (onToggle) onToggle(value);
2538
+ }
2539
+
2540
+ var selectedStyle = selected ? 'selected' : '';
2541
+ return /*#__PURE__*/React__default["default"].createElement("li", {
2542
+ className: selectedStyle + " " + value,
2543
+ onClick: toggle
2544
+ }, label);
2545
+ };
2546
+
2482
2547
  /**
2483
2548
  * Login Box
2484
2549
  */
@@ -10898,6 +10963,7 @@ exports.Menu = Menu;
10898
10963
  exports.MenuIcon = MenuIcon;
10899
10964
  exports.MenuItem = MenuItem;
10900
10965
  exports.MenuSeparator = MenuSeparator;
10966
+ exports.MultiSelector = MultiSelector;
10901
10967
  exports.Page = Page;
10902
10968
  exports.PageContext = PageContext;
10903
10969
  exports.PageProvider = PageProvider;
@@ -10930,6 +10996,7 @@ exports.Text = Text;
10930
10996
  exports.TextArea = TextArea;
10931
10997
  exports.TextField = TextField;
10932
10998
  exports.Thumbnail = Thumbnail;
10999
+ exports.ToggleButton = ToggleButton;
10933
11000
  exports.TokenField = TokenField;
10934
11001
  exports.Tooltip = Tooltip;
10935
11002
  exports.Tree = Tree;