@ncds/ui-admin 0.0.34 → 0.0.36

package/dist/cjs/src/components/input/InputBase.js

@@ -0,0 +1,184 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InputBase = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _uiAdminIcon = _interopRequireDefault(require("@ncds/ui-admin-icon"));
+var _react = require("react");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _color = require("../../../constant/color");
+var _Label = require("../shared/label/Label");
+var _HintText = require("../shared/hintText/HintText");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var __assign = void 0 && (void 0).__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var validationSvgSize = {
+  xs: 14,
+  md: 16
+};
+var generalSvgSize = {
+  xs: 14,
+  md: 20
+};
+var InputBase = exports.InputBase = /*#__PURE__*/(0, _react.forwardRef)(function (_a, ref) {
+  var _b = _a.size,
+    size = _b === void 0 ? 'md' : _b,
+    required = _a.required,
+    label = _a.label,
+    hintText = _a.hintText,
+    disabled = _a.disabled,
+    validation = _a.validation,
+    destructive = _a.destructive,
+    leadingElement = _a.leadingElement,
+    trailingElement = _a.trailingElement,
+    showHelpIcon = _a.showHelpIcon,
+    props = __rest(_a, ["size", "required", "label", "hintText", "disabled", "validation", "destructive", "leadingElement", "trailingElement", "showHelpIcon"]);
+  var renderOutsideSlot = function (slot) {
+    if (slot.type === 'custom' && slot.placement !== 'outside') {
+      return null;
+    }
+    switch (slot.type) {
+      case 'button':
+        return (0, _jsxRuntime.jsx)("button", __assign({
+          type: slot.isSubmit ? 'submit' : 'button',
+          className: (0, _classnames.default)('ncua-input__button', "ncua-input__button--".concat(size)),
+          onClick: slot.onClick
+        }, {
+          children: slot.label
+        }));
+      case 'text':
+        return (0, _jsxRuntime.jsx)("span", __assign({
+          className: (0, _classnames.default)('ncua-input__leading-text', "ncua-input__leading-text--".concat(size))
+        }, {
+          children: slot.text
+        }));
+      case 'custom':
+        return slot.children;
+      default:
+        return null;
+    }
+  };
+  var renderInsideSlot = function (slot, position) {
+    var _a, _b;
+    switch (slot.type) {
+      case 'icon':
+        return (0, _jsxRuntime.jsx)("div", __assign({
+          className: "ncua-input__icon-wrap"
+        }, {
+          children: (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
+            className: (0, _classnames.default)("ncua-input__".concat(position, "-icon"), slot.className),
+            name: slot.icon,
+            color: slot.color ? _color.COLOR[slot.color] : undefined,
+            width: (_a = slot.size) !== null && _a !== void 0 ? _a : generalSvgSize[size],
+            height: (_b = slot.size) !== null && _b !== void 0 ? _b : generalSvgSize[size]
+          })
+        }));
+      case 'custom':
+        return slot.children;
+      default:
+        return null;
+    }
+  };
+  var renderClearButton = function () {
+    if (!props.clearText) return null;
+    return (0, _jsxRuntime.jsx)("button", __assign({
+      className: "ncua-input__icon-wrap ncua-input__right-icon ncua-input__clear",
+      onClick: props.onClearText
+    }, {
+      children: (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
+        name: "x",
+        className: "ncua-input__clear-icon",
+        width: validationSvgSize[size],
+        height: validationSvgSize[size]
+      })
+    }));
+  };
+  var renderStatusIcon = function () {
+    if (destructive) {
+      return (0, _jsxRuntime.jsx)("div", __assign({
+        className: "ncua-input__icon-wrap ncua-input__right-icon"
+      }, {
+        children: (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
+          name: "info-circle",
+          className: "ncua-input__destructive-icon",
+          width: validationSvgSize[size],
+          height: validationSvgSize[size]
+        })
+      }));
+    }
+    if (validation) {
+      return (0, _jsxRuntime.jsx)("div", __assign({
+        className: "ncua-input__icon-wrap ncua-input__right-icon"
+      }, {
+        children: (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
+          name: "check-circle",
+          className: "ncua-input__validation-icon",
+          width: validationSvgSize[size],
+          height: validationSvgSize[size]
+        })
+      }));
+    }
+    return null;
+  };
+  var renderLabel = function () {
+    if (!label) return null;
+    return (0, _jsxRuntime.jsxs)("div", __assign({
+      className: (0, _classnames.default)('ncua-input__label', "ncua-input__label--".concat(size))
+    }, {
+      children: [(0, _jsxRuntime.jsx)(_Label.Label, __assign({
+        isRequired: required,
+        htmlFor: props.id
+      }, {
+        children: label
+      })), showHelpIcon && (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
+        className: "ncua-input__help-icon",
+        name: "help-circle"
+      })]
+    }));
+  };
+  return (0, _jsxRuntime.jsxs)("div", __assign({
+    className: (0, _classnames.default)('ncua-input', "ncua-input--".concat(size), {
+      destructive: destructive,
+      'is-disabled': disabled,
+      'ncua-input__trailing-button': (trailingElement === null || trailingElement === void 0 ? void 0 : trailingElement.type) === 'button',
+      'ncua-input__leading-text-wrap': (leadingElement === null || leadingElement === void 0 ? void 0 : leadingElement.type) === 'text'
+    })
+  }, {
+    children: [renderLabel(), (0, _jsxRuntime.jsxs)("div", __assign({
+      className: "ncua-input__content"
+    }, {
+      children: [leadingElement && renderOutsideSlot(leadingElement), (0, _jsxRuntime.jsxs)("div", __assign({
+        className: (0, _classnames.default)('ncua-input__field', "ncua-input__field--".concat(size))
+      }, {
+        children: [leadingElement && renderInsideSlot(leadingElement, 'left'), (0, _jsxRuntime.jsx)("input", __assign({
+          ref: ref,
+          type: "text",
+          disabled: disabled
+        }, props)), trailingElement && renderInsideSlot(trailingElement, 'right'), renderClearButton(), renderStatusIcon()]
+      })), trailingElement && renderOutsideSlot(trailingElement)]
+    })), hintText && (0, _jsxRuntime.jsx)(_HintText.HintText, __assign({
+      className: "ncua-input__hint-text",
+      destructive: destructive
+    }, {
+      children: hintText
+    }))]
+  }));
+});

package/dist/cjs/src/components/input/PasswordInput.js

@@ -0,0 +1,94 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PasswordInput = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _react = require("react");
+var _InputBase = require("./InputBase");
+var _uiAdminIcon = require("@ncds/ui-admin-icon");
+var _classnames = _interopRequireDefault(require("classnames"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var __assign = void 0 && (void 0).__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var svgSize = {
+  xs: 14,
+  md: 20
+};
+var PasswordInput = exports.PasswordInput = /*#__PURE__*/(0, _react.forwardRef)(function (_a, ref) {
+  var _b = _a.size,
+    size = _b === void 0 ? 'md' : _b,
+    props = __rest(_a, ["size"]);
+  var inputRef = (0, _react.useRef)(null);
+  var _c = (0, _react.useState)(false),
+    isVisible = _c[0],
+    setIsVisible = _c[1];
+  var _d = (0, _react.useState)(false),
+    hasContent = _d[0],
+    setHasContent = _d[1];
+  var svgProps = {
+    width: svgSize[size],
+    height: svgSize[size]
+  };
+  var handleVisibilityChange = function () {
+    setIsVisible(!isVisible);
+  };
+  (0, _react.useEffect)(function () {
+    if (inputRef.current) {
+      setHasContent(!!inputRef.current.value);
+      var handleInput_1 = function () {
+        var _a;
+        setHasContent(!!((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.value));
+      };
+      inputRef.current.addEventListener('input', handleInput_1);
+      return function () {
+        var _a;
+        (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('input', handleInput_1);
+      };
+    }
+  }, []);
+  return (0, _jsxRuntime.jsx)(_InputBase.InputBase, __assign({
+    ref: function (node) {
+      if (typeof ref === 'function') {
+        ref(node);
+      } else if (ref) {
+        ref.current = node;
+      }
+      inputRef.current = node;
+    },
+    size: size,
+    type: isVisible ? 'text' : 'password',
+    leadingElement: {
+      type: 'icon',
+      icon: 'lock-01',
+      color: hasContent ? 'gray600' : 'gray300'
+    },
+    trailingElement: {
+      type: 'custom',
+      placement: 'inside',
+      children: (0, _jsxRuntime.jsx)("button", __assign({
+        className: (0, _classnames.default)('ncua-input__icon-wrap', 'ncua-input__right-icon', 'ncua-input__password-icon'),
+        onClick: handleVisibilityChange
+      }, {
+        children: isVisible ? (0, _jsxRuntime.jsx)(_uiAdminIcon.Eye, __assign({}, svgProps)) : (0, _jsxRuntime.jsx)(_uiAdminIcon.EyeOff, __assign({}, svgProps))
+      }))
+    }
+  }, props));
+});

package/dist/cjs/src/components/input/Textarea.js

@@ -0,0 +1,115 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Textarea = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _react = require("react");
+var _Label = require("../shared/label/Label");
+var _HintText = require("../shared/hintText/HintText");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var __assign = void 0 && (void 0).__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var Textarea = exports.Textarea = /*#__PURE__*/(0, _react.forwardRef)(function (_a, ref) {
+  var _b;
+  var className = _a.className,
+    _c = _a.size,
+    size = _c === void 0 ? 'md' : _c,
+    label = _a.label,
+    required = _a.required,
+    disabled = _a.disabled,
+    hintText = _a.hintText,
+    characterCount = _a.characterCount,
+    destructive = _a.destructive,
+    props = __rest(_a, ["className", "size", "label", "required", "disabled", "hintText", "characterCount", "destructive"]);
+  var textareaRef = (0, _react.useRef)(null);
+  var _d = (0, _react.useState)(0),
+    textCount = _d[0],
+    setTextCount = _d[1];
+  var shouldShowHintArea = hintText || characterCount;
+  (0, _react.useEffect)(function () {
+    if (textareaRef.current && characterCount) {
+      setTextCount(textareaRef.current.value.length);
+      var handleInput_1 = function () {
+        var _a, _b;
+        setTextCount((_b = (_a = textareaRef.current) === null || _a === void 0 ? void 0 : _a.value.length) !== null && _b !== void 0 ? _b : 0);
+      };
+      textareaRef.current.addEventListener('input', handleInput_1);
+      return function () {
+        var _a;
+        (_a = textareaRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('input', handleInput_1);
+      };
+    }
+  }, [characterCount]);
+  return (0, _jsxRuntime.jsxs)("div", __assign({
+    className: (0, _classnames.default)('ncua-input', 'ncua-input--textarea', "ncua-input--textarea--".concat(size), {
+      destructive: destructive,
+      'is-disabled': disabled
+    }, className)
+  }, {
+    children: [label && (0, _jsxRuntime.jsx)(_Label.Label, __assign({
+      htmlFor: props.id,
+      isRequired: required
+    }, {
+      children: label
+    })), (0, _jsxRuntime.jsx)("div", __assign({
+      className: "ncua-input__content"
+    }, {
+      children: (0, _jsxRuntime.jsx)("div", __assign({
+        className: "ncua-input__field"
+      }, {
+        children: (0, _jsxRuntime.jsx)("textarea", __assign({
+          ref: function (node) {
+            if (typeof ref === 'function') {
+              ref(node);
+            } else if (ref) {
+              ref.current = node;
+            }
+            textareaRef.current = node;
+          },
+          className: "ncua-input__textarea",
+          disabled: disabled
+        }, props))
+      }))
+    })), shouldShowHintArea && (0, _jsxRuntime.jsxs)("div", __assign({
+      className: "ncua-input__text-count-wrap"
+    }, {
+      children: [hintText && (0, _jsxRuntime.jsx)(_HintText.HintText, __assign({
+        as: "div",
+        destructive: destructive
+      }, {
+        children: hintText
+      })), characterCount && (0, _jsxRuntime.jsx)("div", __assign({
+        className: "ncua-input__text-count"
+      }, {
+        children: (0, _jsxRuntime.jsxs)("span", __assign({
+          className: "ncua-input__text-count-text"
+        }, {
+          children: [(0, _jsxRuntime.jsx)("span", __assign({
+            className: "ncua-input__text-count-text-count"
+          }, {
+            children: textCount
+          })), "/", (_b = props.maxLength) !== null && _b !== void 0 ? _b : 0]
+        }))
+      }))]
+    }))]
+  }));
+});

package/dist/cjs/src/components/input/index.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _InputBase = require("./InputBase");
+Object.keys(_InputBase).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _InputBase[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _InputBase[key];
+    }
+  });
+});
+var _PasswordInput = require("./PasswordInput");
+Object.keys(_PasswordInput).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _PasswordInput[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _PasswordInput[key];
+    }
+  });
+});
+var _Textarea = require("./Textarea");
+Object.keys(_Textarea).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Textarea[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Textarea[key];
+    }
+  });
+});

package/dist/cjs/src/components/modal/Modal.js

@@ -0,0 +1,194 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Modal = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _react = require("react");
+var _reactDom = _interopRequireDefault(require("react-dom"));
+var _ButtonCloseX = require("../button/ButtonCloseX");
+var _featuredIcon = require("../featured-icon");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var __assign = void 0 && (void 0).__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var Modal = function (_a) {
+  var isOpen = _a.isOpen,
+    onClose = _a.onClose,
+    children = _a.children,
+    _b = _a.size,
+    size = _b === void 0 ? 'md' : _b,
+    _c = _a.closeOnBackdropClick,
+    closeOnBackdropClick = _c === void 0 ? true : _c,
+    _d = _a.closeOnEsc,
+    closeOnEsc = _d === void 0 ? true : _d,
+    className = _a.className,
+    restProps = __rest(_a, ["isOpen", "onClose", "children", "size", "closeOnBackdropClick", "closeOnEsc", "className"]);
+  var modalRef = (0, _react.useRef)(null);
+  var handleBackdropClick = function (e) {
+    if (closeOnBackdropClick && e.target === e.currentTarget) {
+      onClose();
+    }
+  };
+  (0, _react.useEffect)(function () {
+    var handleKeyDown = function (e) {
+      if (isOpen && closeOnEsc && e.key === 'Escape') {
+        onClose();
+      }
+    };
+    if (isOpen) {
+      document.addEventListener('keydown', handleKeyDown);
+      document.body.style.overflow = 'hidden';
+    }
+    return function () {
+      document.removeEventListener('keydown', handleKeyDown);
+      document.body.style.overflow = '';
+    };
+  }, [isOpen, closeOnEsc, onClose]);
+  if (!isOpen) return null;
+  var modalContent = (0, _jsxRuntime.jsx)("div", __assign({
+    className: (0, _classnames.default)('ncua-modal-backdrop', className),
+    onClick: handleBackdropClick,
+    ref: modalRef
+  }, restProps, {
+    children: (0, _jsxRuntime.jsx)("div", __assign({
+      className: (0, _classnames.default)('ncua-modal', "ncua-modal--".concat(size))
+    }, {
+      children: children
+    }))
+  }));
+  return /*#__PURE__*/_reactDom.default.createPortal(modalContent, document.body);
+};
+exports.Modal = Modal;
+Modal.Header = function (_a) {
+  var children = _a.children,
+    onClose = _a.onClose,
+    featuredIcon = _a.featuredIcon,
+    title = _a.title,
+    subtitle = _a.subtitle,
+    _b = _a.align,
+    align = _b === void 0 ? 'left' : _b,
+    _c = _a.showDivider,
+    showDivider = _c === void 0 ? false : _c,
+    _d = _a.hideCloseButton,
+    hideCloseButton = _d === void 0 ? false : _d;
+  return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [(0, _jsxRuntime.jsxs)("header", __assign({
+      className: (0, _classnames.default)('ncua-modal__header', "ncua-modal__header--".concat(align), {
+        'ncua-modal__header--close-button': !hideCloseButton
+      })
+    }, {
+      children: [featuredIcon && (0, _jsxRuntime.jsx)(_featuredIcon.FeaturedIcon, {
+        name: featuredIcon.name,
+        color: featuredIcon.color,
+        theme: featuredIcon.theme,
+        size: "sm"
+      }), (0, _jsxRuntime.jsxs)("div", __assign({
+        className: "ncua-modal__title"
+      }, {
+        children: [(0, _jsxRuntime.jsx)("div", __assign({
+          className: "ncua-modal__title-text"
+        }, {
+          children: title
+        })), subtitle && (0, _jsxRuntime.jsx)("div", __assign({
+          className: "ncua-modal__title-subtitle"
+        }, {
+          children: subtitle
+        }))]
+      })), children, !hideCloseButton && (0, _jsxRuntime.jsx)(_ButtonCloseX.ButtonCloseX, {
+        className: "ncua-modal__close-button",
+        size: "sm",
+        theme: "light",
+        onClick: onClose
+      })]
+    })), showDivider && (0, _jsxRuntime.jsx)("div", {
+      className: "ncua-modal__header-divider"
+    })]
+  });
+};
+Modal.Content = function (_a) {
+  var children = _a.children;
+  return (0, _jsxRuntime.jsx)("div", __assign({
+    className: "ncua-modal__content"
+  }, {
+    children: children
+  }));
+};
+/**
+ * Modal.Actions - The actions area of the modal
+ *
+ * Examples:
+ *
+ * 1. Vertical layout (buttons stacked):
+ * <Modal.Actions layout="vertical" align="stretch">
+ *   <Button size="sm" label="Confirm" onClick={handleConfirm} hierarchy="primary" />
+ *   <Button size="sm" label="Cancel" onClick={handleCancel} hierarchy="secondary-gray" />
+ * </Modal.Actions>
+ *
+ * 2. Horizontal layout (buttons side by side):
+ * <Modal.Actions layout="horizontal" align="stretch">
+ *   <Button size="sm" label="Confirm" onClick={handleConfirm} hierarchy="primary" />
+ *   <Button size="sm" label="Cancel" onClick={handleCancel} hierarchy="secondary-gray" />
+ * </Modal.Actions>
+ *
+ * 3. Checkbox layout (checkbox on left, buttons on right):
+ * <Modal.Actions layout="checkbox" align="stretch" checkboxContent={
+ *   <>
+ *     <Checkbox text="Never show again" />
+ *     <a href="#">Settings</a>
+ *   </>
+ * }>
+ *   <Button size="sm" label="Cancel" onClick={handleCancel} hierarchy="secondary-gray" />
+ *   <Button size="sm" label="Confirm" onClick={handleConfirm} hierarchy="primary" />
+ * </Modal.Actions>
+ */
+Modal.Actions = function (_a) {
+  var children = _a.children,
+    _b = _a.layout,
+    layout = _b === void 0 ? 'vertical' : _b,
+    _c = _a.showDivider,
+    showDivider = _c === void 0 ? false : _c,
+    _d = _a.align,
+    align = _d === void 0 ? 'stretch' : _d,
+    checkboxContent = _a.checkboxContent;
+  return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [showDivider && (0, _jsxRuntime.jsx)("div", {
+      className: "ncua-modal__actions-divider"
+    }), (0, _jsxRuntime.jsxs)("div", __assign({
+      className: (0, _classnames.default)('ncua-modal__actions-wrapper', {
+        'ncua-modal__actions-wrapper--checkbox': layout === 'checkbox'
+      })
+    }, {
+      children: [layout === 'checkbox' && (0, _jsxRuntime.jsx)("div", __assign({
+        className: "ncua-modal__actions-checkbox"
+      }, {
+        children: (0, _jsxRuntime.jsx)("div", __assign({
+          className: "ncua-modal__actions-checkbox-content"
+        }, {
+          children: checkboxContent
+        }))
+      })), (0, _jsxRuntime.jsx)("div", __assign({
+        className: (0, _classnames.default)('ncua-modal__actions', "ncua-modal__actions--".concat(layout), "ncua-modal__actions--".concat(align))
+      }, {
+        children: children
+      }))]
+    }))]
+  });
+};

package/dist/cjs/src/components/modal/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Modal = require("./Modal");
+Object.keys(_Modal).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Modal[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Modal[key];
+    }
+  });
+});