@pisell/materials 6.0.10 → 6.0.12

package/lib/components/dataSourceComponents/fields/Input.Subdomain/type.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/fields/Input.Subdomain/type.ts
+var type_exports = {};
+module.exports = __toCommonJS(type_exports);

package/lib/components/dataSourceComponents/fields/Translation/BaseTranslation.js

@@ -53,9 +53,20 @@ var Translation = ({
   value = defaultValue,
   onChange,
   placeholder,
-  disabled
+  disabled,
+  type = "text"
+  // 默认为普通文本输入
 }) => {
   const [open, setOpen] = (0, import_react.useState)(false);
+  const getInputComponent = (0, import_react.useCallback)(() => {
+    switch (type) {
+      case "textarea":
+        return import_antd.Input.TextArea;
+      default:
+        return import_antd.Input;
+    }
+  }, [type]);
+  const InputComponent = getInputComponent();
   const hasAnyTranslation = (0, import_react.useCallback)(() => {
     if (!value) {
       return false;
@@ -73,7 +84,7 @@ var Translation = ({
     [value, onChange]
   );
   const content = /* @__PURE__ */ import_react.default.createElement("div", { className: "translation-popover" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Space, { direction: "vertical", style: { width: "100%" }, size: 16 }, languageConfig.map(({ key, label }) => /* @__PURE__ */ import_react.default.createElement("div", { key, className: "translation-field" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "translation-label" }, label), /* @__PURE__ */ import_react.default.createElement(
-    import_antd.Input,
+    InputComponent,
     {
       value: (value == null ? void 0 : value[key]) || "",
       onChange: handleInputChange(key),
@@ -81,7 +92,7 @@ var Translation = ({
     }
   )))));
   return /* @__PURE__ */ import_react.default.createElement("div", { className: "translation-wrapper" }, /* @__PURE__ */ import_react.default.createElement(
-    import_antd.Input,
+    InputComponent,
     {
       value: (value == null ? void 0 : value.original) || "",
       onChange: handleInputChange("original"),
@@ -101,7 +112,7 @@ var Translation = ({
         }
         setOpen(open2);
       },
-      placement: "bottomRight"
+      placement: "bottom"
     },
     /* @__PURE__ */ import_react.default.createElement(
       "div",

package/lib/components/dataSourceComponents/fields/Translation/type.d.ts

@@ -12,4 +12,5 @@ export interface TranslationProps {
     disabled?: boolean;
     placeholder?: string;
     className?: string;
+    type?: 'text' | 'textarea';
 }

package/lib/components/dataSourceComponents/fields/Upload/BaseUpload.js

@@ -63,6 +63,8 @@ var BaseUpload = (props) => {
     typeMaxSizeMap,
     enableMultilingual,
     onChange,
+    mediaUploadUrl: propsMediaUploadUrl,
+    getHeaders: propsGetHeaders,
     ...restProps
   } = props;
   const [fileList, setFileList] = (0, import_react.useState)([]);
@@ -78,7 +80,7 @@ var BaseUpload = (props) => {
     fileListRef.current = fileList;
   }, [fileList]);
   const { appHelper } = (0, import_useEngineContext.default)();
-  const { mediaUploadUrl, getHeaders } = appHelper == null ? void 0 : appHelper.constants;
+  const { mediaUploadUrl, getHeaders } = (appHelper == null ? void 0 : appHelper.constants) || {};
   const handleImageError = (0, import_react.useCallback)((file) => {
     setErrorImageMap((prev) => ({
       ...prev,
@@ -482,7 +484,7 @@ var BaseUpload = (props) => {
     iconRender: () => /* @__PURE__ */ import_react.default.createElement(import_iconfont.default, { type: "pisell2-a-BlueFile1" }),
     listType: "picture-card",
     onChange: handleChange,
-    action: mediaUploadUrl,
+    action: propsMediaUploadUrl || mediaUploadUrl,
     method: "post",
     accept,
     name: "file",
@@ -494,7 +496,7 @@ var BaseUpload = (props) => {
       group_id: 0,
       ...(0, import_utils2.getFileMetadataParams)(file)
     }),
-    headers: getHeaders == null ? void 0 : getHeaders(),
+    headers: (propsGetHeaders == null ? void 0 : propsGetHeaders()) || (getHeaders == null ? void 0 : getHeaders()),
     beforeUpload,
     className: "pisell-data-source-upload"
     // itemRender: (originNode: React.ReactElement, file: UploadFile) => {

package/lib/components/dataSourceComponents/fields/Upload/ReadPretty.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { UploadProps } from './type';
 import './ReadPretty.less';
-declare const UploadReadPretty: (props: UploadProps) => React.JSX.Element[] | null;
+declare const UploadReadPretty: (props: UploadProps) => React.JSX.Element | null;
 export default UploadReadPretty;

package/lib/components/dataSourceComponents/fields/Upload/ReadPretty.js

@@ -59,7 +59,7 @@ var UploadReadPretty = (props) => {
   if (!normalizedValue.length) {
     return null;
   }
-  return normalizedValue.map((item, index) => /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ import_react.default.createElement("div", null, normalizedValue.map((item, index) => /* @__PURE__ */ import_react.default.createElement(
     import_antd.Image,
     {
       key: `${String(item)}-${index}`,
@@ -72,6 +72,6 @@ var UploadReadPretty = (props) => {
         maskClassName: "pisell-upload-read-pretty-mask"
       }
     }
-  ));
+  )));
 };
 var ReadPretty_default = UploadReadPretty;

package/lib/components/dataSourceComponents/fields/Upload/WithMode.js

@@ -39,11 +39,11 @@ var import_BaseUpload = __toESM(require("./BaseUpload"));
 var import_serve = require("./serve");
 var import_utils2 = require("@pisell/utils");
 var Upload = (props) => {
-  const { presetType } = props;
+  const { presetType, mediaConfig: propsMediaConfig } = props;
   const { getExtensionsByIds, getMaxSizeByIds } = (0, import_serve.useMediaTypes)();
-  const { data: mediaConfig } = (0, import_serve.useMediaConfig)();
-  const presetTypeString = getExtensionsByIds(presetType);
-  const maxSizeMap = getMaxSizeByIds(presetType);
+  const { data: mediaConfig } = (0, import_serve.useMediaConfig)(propsMediaConfig);
+  const presetTypeString = getExtensionsByIds(presetType || []);
+  const maxSizeMap = getMaxSizeByIds(presetType || []);
   const maxCount = (0, import_react.useMemo)(() => {
     const minArr = [];
     if ((0, import_utils2.isNumber)(mediaConfig == null ? void 0 : mediaConfig.upload_onetime_limit)) {

package/lib/components/dataSourceComponents/fields/Upload/index.less

@@ -31,7 +31,7 @@
   .pisell-lowcode-upload-list-item-container {
     .pisell-lowcode-upload-list-item-action {
       &:hover {
-        background: none;
+        background: none !important;
       }
     }
   }

package/lib/components/dataSourceComponents/fields/Upload/serve.d.ts

@@ -7,7 +7,7 @@ export interface MediaType {
     name: string;
     maxsize: number;
 }
-export declare const useMediaConfig: () => {
+export declare const useMediaConfig: (mediaConfig?: any) => {
     data: {
         upload_onetime_limit: any;
         upload_maxsize: any;

package/lib/components/dataSourceComponents/fields/Upload/serve.js

@@ -52,14 +52,14 @@ var getMediaTypeList = async () => {
   );
   return data;
 };
-var useMediaConfig = () => {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
+var useMediaConfig = (mediaConfig) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
   const context = (0, import_useEngineContext.default)();
-  const data = (_h = (_g = (_f = (_e = (_d = (_c = (_b = (_a = context.appHelper.utils) == null ? void 0 : _a.getApp) == null ? void 0 : _b.call(_a)) == null ? void 0 : _c.data) == null ? void 0 : _d.store) == null ? void 0 : _e.getStore) == null ? void 0 : _f.call(_e)) == null ? void 0 : _g.getDataByModel) == null ? void 0 : _h.call(_g, "core", "core");
+  const data = (_i = (_h = (_g = (_f = (_e = (_d = (_c = (_b = (_a = context.appHelper) == null ? void 0 : _a.utils) == null ? void 0 : _b.getApp) == null ? void 0 : _c.call(_b)) == null ? void 0 : _d.data) == null ? void 0 : _e.store) == null ? void 0 : _f.getStore) == null ? void 0 : _g.call(_f)) == null ? void 0 : _h.getDataByModel) == null ? void 0 : _i.call(_h, "core", "core");
   return {
     data: {
-      upload_onetime_limit: data == null ? void 0 : data.media_upload_onetime_limit,
-      upload_maxsize: data == null ? void 0 : data.media_upload_maxsize
+      upload_onetime_limit: (mediaConfig == null ? void 0 : mediaConfig.upload_onetime_limit) || (data == null ? void 0 : data.media_upload_onetime_limit),
+      upload_maxsize: (mediaConfig == null ? void 0 : mediaConfig.upload_maxsize) || (data == null ? void 0 : data.media_upload_maxsize)
     }
   };
 };

package/lib/components/dataSourceComponents/fields/Upload/type.d.ts

@@ -24,4 +24,12 @@ export interface UploadProps {
     enableMultilingual?: boolean;
     onChange?: UploadChangeHandler;
     disabled?: boolean;
+    mediaUploadUrl?: string;
+    getHeaders?: () => Record<string, string>;
+    mediaConfig?: {
+        data: {
+            upload_onetime_limit: number;
+            upload_maxsize: number;
+        };
+    };
 }

package/lib/components/dataSourceComponents/fields/index.d.ts

@@ -16,6 +16,17 @@ declare const formFieldMap: {
             onChange: (value: string) => void;
         } & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
         Phone: import("react").FC<import("./Input.Phone/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
+        Mobile: import("react").FC<import("./Input.Mobile/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
+        Subdomain: import("react").FC<import("antd").InputProps & {
+            onChange: (value: string) => void;
+            onBlur?: ((e: import("react").FocusEvent<HTMLInputElement, Element>) => void) | undefined;
+            rootDomain: "custom" | "saas" | "xzero";
+            customDomain?: string | undefined;
+            value?: string | undefined;
+            tenantId: string;
+            name?: string | undefined;
+            fieldKey?: string | undefined;
+        } & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
     };
     FormItemRadio: import("react").FC<{}> & {
         Group: import("react").FC<import("./Radio/type").RadioGroupProps & import("../dataSourceForm/utils").WithModeProps>;
@@ -35,6 +46,7 @@ declare const formFieldMap: {
     FormItemTimePicker: import("react").FC<import("./TimePicker/type").TimePickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
     'FormItemInput.JSON': import("react").FC<any>;
     'FormItemInput.Phone': import("react").FC<import("./Input.Phone/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
+    'FormItemInput.Mobile': import("react").FC<import("./Input.Mobile/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
     'FormItemInput.Email': import("react").FC<import("antd").InputProps & {
         onChange: (value: string) => void;
     } & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
@@ -46,13 +58,13 @@ declare const formFieldMap: {
     FormItemUpload: import("react").FC<import("./Upload/type").UploadProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
     FormItemTranslation: import("react").FC<import("./Translation/type").TranslationProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
 };
-declare const getFieldComponent: (fieldComponent: string) => import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps> | import("react").FC<any> | (import("react").FC<{}> & {
+declare const getFieldComponent: (fieldComponent: string) => import("react").FC<any> | import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps> | (import("react").FC<{}> & {
     Group: import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps>;
 } & {
     Group: import("react").FC<import("./Checkbox/type").CheckboxGroupProps & import("../dataSourceForm/utils").WithModeProps>;
 }) | import("react").FC<import("./ColorPicker/type").ColorPickerProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<(import("antd").DatePickerProps & import("../dataSourceForm/utils").WithModeProps) & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("antd/es/input").PasswordProps & import("react").RefAttributes<import("antd").InputRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("antd").InputProps & import("react").RefAttributes<import("antd").InputRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("antd").InputProps & {
     onChange: (value: string) => void;
-} & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Input.Phone/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | (import("react").FC<import("./Input/type").InputProps> & {
+} & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Input.Phone/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | import("react").FC<import("./Input.Mobile/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps> | (import("react").FC<import("./Input/type").InputProps> & {
     JSON: import("react").FC<any>;
     Password: import("react").FC<import("antd/es/input").PasswordProps & import("react").RefAttributes<import("antd").InputRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
     TextArea: import("react").FC<import("antd/es/input").TextAreaProps & import("react").RefAttributes<import("antd/es/input/TextArea").TextAreaRef> & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
@@ -61,6 +73,17 @@ declare const getFieldComponent: (fieldComponent: string) => import("react").FC<
         onChange: (value: string) => void;
     } & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
     Phone: import("react").FC<import("./Input.Phone/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
+    Mobile: import("react").FC<import("./Input.Mobile/WithMode").PhoneInputProps & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
+    Subdomain: import("react").FC<import("antd").InputProps & {
+        onChange: (value: string) => void;
+        onBlur?: ((e: import("react").FocusEvent<HTMLInputElement, Element>) => void) | undefined;
+        rootDomain: "custom" | "saas" | "xzero";
+        customDomain?: string | undefined;
+        value?: string | undefined;
+        tenantId: string;
+        name?: string | undefined;
+        fieldKey?: string | undefined;
+    } & import("../dataSourceForm/utils").WithModeProps & import("../dataSourceForm/utils").WithFormItemProps>;
 }) | import("react").FC<import("./Radio/type").RadioGroupProps & import("../dataSourceForm/utils").WithModeProps> | (import("react").FC<{}> & {
     Group: import("react").FC<import("./Radio/type").RadioGroupProps & import("../dataSourceForm/utils").WithModeProps>;
 } & {

package/lib/components/dataSourceComponents/fields/index.js

@@ -56,6 +56,7 @@ var formFieldMap = {
   FormItemTimePicker: import_TimePicker.default,
   "FormItemInput.JSON": import_Input.default.JSON,
   "FormItemInput.Phone": import_Input.default.Phone,
+  "FormItemInput.Mobile": import_Input.default.Mobile,
   "FormItemInput.Email": import_Input.default.Email,
   "FormItemInput.URL": import_Input.default.URL,
   "FormItemInput.Password": import_Input.default.Password,

package/lib/components/dataSourceComponents/fields/type.d.ts

@@ -7,6 +7,7 @@ export declare type FilterFunctionReturnType = {
     $in?: (string | number)[];
     $anyOf?: (string | number)[];
     $isTruly?: boolean;
+    $isFalsy?: boolean;
     $dateAfter?: string;
     $dateBefore?: string;
     $and?: Array<{

package/lib/components/dataSourceComponents/fields/utils.js

@@ -24,6 +24,7 @@ __export(utils_exports, {
 module.exports = __toCommonJS(utils_exports);
 var import_utils = require("@pisell/utils");
 var formFieldFilterFuncMap = {
+  // @ts-ignore
   Checkbox: (value) => {
     const key = value ? "$isTruly" : "$isFalsy";
     return {

package/lib/components/dataSourceComponents/provider/actions/ActionsContext.d.ts

@@ -1,6 +1,11 @@
 /// <reference types="react" />
 export interface ActionsContextType {
-    [key: string]: any;
+    visible?: boolean;
+    setVisible?: (visible: boolean) => void;
+    refreshTableData?: () => void;
+    onClose?: () => void;
+    beforeClose?: () => boolean | Promise<boolean>;
+    setBeforeClose?: (beforeClose: () => boolean | Promise<boolean>) => void;
 }
 declare const ActionsContext: import("react").Context<ActionsContextType>;
 export default ActionsContext;

package/lib/components/dataSourceComponents/provider/actions/ActionsProvider.d.ts

@@ -1,9 +1,12 @@
 import React from 'react';
 import { ActionsContextType } from './ActionsContext';
+interface ActionsProviderProps extends ActionsContextType {
+    children: React.ReactNode;
+}
 /**
  * 自定义请求的provider
  * @param props
  * @constructor
  */
-declare const ActionsProvider: React.FC<ActionsContextType>;
+declare const ActionsProvider: React.FC<ActionsProviderProps>;
 export default ActionsProvider;

package/lib/components/form/index.js

@@ -76,7 +76,7 @@ var Form = class extends import_react.Component {
   }
 };
 Form.Item = (props) => {
-  const { name, rules: propsRules, requiredobj, typeobj, patternobj, lenobj, validator } = props;
+  const { name, rules: propsRules, requiredobj, typeobj, patternobj, subdomainobj, phoneobj, mobileobj, lenobj, validator } = props;
   const rules = (0, import_utils.isArr)(propsRules) ? propsRules : [];
   if (requiredobj && requiredobj.required) {
     rules.push(requiredobj);
@@ -87,6 +87,15 @@ Form.Item = (props) => {
   if (patternobj && patternobj.pattern) {
     rules.push(patternobj);
   }
+  if (subdomainobj && subdomainobj.subdomain) {
+    rules.push(subdomainobj);
+  }
+  if (phoneobj && phoneobj.phone) {
+    rules.push(phoneobj);
+  }
+  if (mobileobj && mobileobj.mobile) {
+    rules.push(mobileobj);
+  }
   if (lenobj && (lenobj.max || lenobj.min)) {
     rules.push(lenobj);
   }

package/lib/components/iconfont/index.js

@@ -35,7 +35,7 @@ module.exports = __toCommonJS(iconfont_exports);
 var import_icons = require("@ant-design/icons");
 var import_react = __toESM(require("react"));
 var MyIcon = (0, import_icons.createFromIconfontCN)({
-  scriptUrl: "https://static.pisellcdn.com/pisell2iconfont1.0.js"
+  scriptUrl: "https://static.pisellcdn.com/pisell2/iconfont_1.0.js"
   // 在 iconfont.cn 上生成
 });
 var IconFont = (props) => {

package/lib/components/pisellDraggable/components/Action/Action.d.ts

@@ -0,0 +1,10 @@
+import React, { CSSProperties } from 'react';
+import './Action.less';
+export interface Props extends React.HTMLAttributes<HTMLButtonElement> {
+    active?: {
+        fill: string;
+        background: string;
+    };
+    cursor?: CSSProperties['cursor'];
+}
+export declare const Action: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;

package/lib/components/pisellDraggable/components/Action/Action.js

@@ -0,0 +1,60 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellDraggable/components/Action/Action.tsx
+var Action_exports = {};
+__export(Action_exports, {
+  Action: () => Action
+});
+module.exports = __toCommonJS(Action_exports);
+var import_classnames = __toESM(require("classnames"));
+var import_react = __toESM(require("react"));
+var import_Action = require("./Action.less");
+var Action = (0, import_react.forwardRef)(
+  ({ active, className, cursor, style, ...props }, ref) => {
+    return /* @__PURE__ */ import_react.default.createElement(
+      "button",
+      {
+        ref,
+        ...props,
+        className: (0, import_classnames.default)("Action", className),
+        tabIndex: 0,
+        style: {
+          ...style,
+          cursor,
+          "--fill": active == null ? void 0 : active.fill,
+          "--background": active == null ? void 0 : active.background
+        }
+      }
+    );
+  }
+);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Action
+});

package/lib/components/pisellDraggable/components/Action/Action.less

@@ -0,0 +1,50 @@
+@focused-outline-color: #4c9ffe;
+
+.Action {
+  display: flex;
+  width: 12px;
+  padding: 15px;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  touch-action: none;
+  cursor: var(--cursor, pointer);
+  border-radius: 5px;
+  border: none;
+  outline: none;
+  appearance: none;
+  background-color: transparent;
+  -webkit-tap-highlight-color: transparent;
+
+  @media (hover: hover) {
+    &:hover {
+      background-color: var(--action-background, rgba(0, 0, 0, 0.05));
+
+      svg {
+        fill: #6f7b88;
+      }
+    }
+  }
+
+  svg {
+    flex: 0 0 auto;
+    margin: auto;
+    height: 100%;
+    overflow: visible;
+    fill: #919eab;
+  }
+
+  &:active {
+    background-color: var(--background, rgba(0, 0, 0, 0.05));
+
+    svg {
+      fill: var(--fill, #788491);
+    }
+  }
+
+  &:focus-visible {
+    outline: none;
+    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0),
+      0 0px 0px 2px @focused-outline-color;
+  }
+}

package/lib/components/pisellDraggable/components/Action/index.d.ts

@@ -0,0 +1,2 @@
+export { Action } from './Action';
+export type { Props as ActionProps } from './Action';

package/lib/components/pisellDraggable/components/Action/index.js

@@ -0,0 +1,29 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellDraggable/components/Action/index.ts
+var Action_exports = {};
+__export(Action_exports, {
+  Action: () => import_Action.Action
+});
+module.exports = __toCommonJS(Action_exports);
+var import_Action = require("./Action");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Action
+});

package/lib/components/pisellDraggable/components/Handle/Handle.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ActionProps } from '../Action';
+export declare const Handle: React.ForwardRefExoticComponent<ActionProps & React.RefAttributes<HTMLButtonElement>>;

package/lib/components/pisellDraggable/components/Handle/Handle.js

@@ -0,0 +1,54 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellDraggable/components/Handle/Handle.tsx
+var Handle_exports = {};
+__export(Handle_exports, {
+  Handle: () => Handle
+});
+module.exports = __toCommonJS(Handle_exports);
+var import_react = __toESM(require("react"));
+var import_Action = require("../Action");
+var Handle = (0, import_react.forwardRef)(
+  (props, ref) => {
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_Action.Action,
+      {
+        ref,
+        cursor: "grab",
+        "data-cypress": "draggable-handle",
+        ...props
+      },
+      /* @__PURE__ */ import_react.default.createElement("svg", { viewBox: "0 0 20 20", width: "12" }, /* @__PURE__ */ import_react.default.createElement("path", { d: "M7 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 2zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 7 14zm6-8a2 2 0 1 0-.001-4.001A2 2 0 0 0 13 6zm0 2a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 8zm0 6a2 2 0 1 0 .001 4.001A2 2 0 0 0 13 14z" }))
+    );
+  }
+);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Handle
+});

package/lib/components/pisellDraggable/components/Handle/index.d.ts

@@ -0,0 +1 @@
+export { Handle } from './Handle';

package/lib/components/pisellDraggable/components/Handle/index.js

@@ -0,0 +1,29 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/pisellDraggable/components/Handle/index.ts
+var Handle_exports = {};
+__export(Handle_exports, {
+  Handle: () => import_Handle.Handle
+});
+module.exports = __toCommonJS(Handle_exports);
+var import_Handle = require("./Handle");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Handle
+});

package/lib/components/pisellDraggable/components/Remove/Remove.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { ActionProps } from '../Action';
+export declare function Remove(props: ActionProps): React.JSX.Element;