amotify 0.1.31 → 0.1.32

package/dist/fn/Input/Select.js

@@ -1 +1,278 @@
-import{b as c,c as d,d as T}from"../../chunk-VY3566IV.js";import{Fragment as Q,jsx as l,jsxs as G}from"react/jsx-runtime";import{useState as C}from"react";import{$$ as S}from"../../@utils/_";import E from"../../atoms/Box";import J from"../../atoms/FAI";import{Wrapper as U,BoxWrapper as W,SubmitForm as q,CommonEffects as K,DefaultStyles as M}from"./core";import $ from"./Parts";import{InputClasses as j,InputSelectClasses as N}from"../../@styles/componentClasses/_";function H(e){let{value:t,params:u}=e,{required:n,options:a}=u,o=[];return n&&(!a.length||a.length&&S.is.nullish(JSON.parse(t)))&&o.push({type:"invalid",label:"\u5FC5\u9808\u9805\u76EE\u3067\u3059"}),{ok:!o.filter(({type:r})=>r=="invalid").length,notice:o}}const _={Core:e=>{var O;let x=e,{tone:t,required:u,form:n,className:a,enableFormSubmit:o,enableUnSelected:r,checkValidationAtFirst:f,onChange:p,onKeyDown:I,onValidate:b,onUpdateValue:m,onUpdateValidValue:y,value:h="",options:B,placeholder:F,leftIndicator:X,rightIndicator:Y,leftIcon:Z,rightIcon:P,componentID:w,status_id:ee}=x,L=T(x,["tone","required","form","className","enableFormSubmit","enableUnSelected","checkValidationAtFirst","onChange","onKeyDown","onValidate","onUpdateValue","onUpdateValidValue","value","options","placeholder","leftIndicator","rightIndicator","leftIcon","rightIcon","componentID","status_id"]),A={componentID:e.componentID||"",dataValue:h,eventType:"init",eventID:S.uuid.gen()},[s,v]=C(A),[g,D]=C({ok:!1,notice:[]});K({type:"select",params:e,val_status:s,set_status:v,ExtraOverrideParams:{dataValue:h,formatValue:h},val_validate:g,set_validate:D,DefaultValidation:H,onUpdateValue:m,onUpdateValidValue:y});let R=l(E,{fontColor:"4.thin",textAlign:"left",children:F||"\u9078\u629E"});if(s.dataValue){let i=B.find(V=>V.value==s.dataValue);i&&(R=(O=i.displayLabel)!=null?O:i.label)}return l(W,{val_status:s,set_status:v,val_validate:g,params:e,children:G(E,{className:[a,N("SelectLegend"),j("InputCover")].join(" "),children:[R,l("select",d(c({"data-form":n,"data-input-type":"select","data-validation":g.ok,"data-component-id":s.componentID,"data-value":s.dataValue,value:s.dataValue,onKeyDown:i=>{I&&I(i),o&&q(i)},onChange:i=>{let{value:V}=i.target;g.ok&&D({ok:!1,notice:[]}),v(d(c({},s),{dataValue:V,eventType:"update",eventID:S.uuid.gen()})),p&&p(i)}},L),{className:N("Select"),children:l(_.Options,c({},e))}))]})})},Options:e=>{let{options:t=[],placeholder:u="\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044",enableUnSelected:n=!0}=e,a=t.map(o=>{let{value:r,label:f}=o,p=String(r);return l("option",{value:p,children:f},p)});return n&&a.unshift(l("option",{value:JSON.stringify(null),children:u},0)),l(Q,{children:a})}},z=e=>{let{value:t=null,placeholder:u,options:n=[]}=e,a=0,o=JSON.stringify(t),r=n.map(p=>{let{value:I,label:b}=p,m=JSON.stringify(I),y=m==o;return a|=Number(y),d(c({},p),{value:m,label:b})});a||(t=null);let f=JSON.stringify(t);return l(_.Core,d(c({},e),{value:f,options:r}))},k=e=>{var u,n;e=c({},e),S.is.nullish(e.rightIcon)&&(e.rightIcon=l($.RightIcon,d(c({flexType:"col"},e.rightIconStyles),{children:l(J.AngleDown,{})}))),e.rightIcon&&(e.paddingRight=(u=e.paddingRight)!=null?u:3),e.leftIcon&&(e.paddingLeft=(n=e.paddingLeft)!=null?n:3);let t=M.Boxish(e);return delete t.rightIconStyles,l(U,{componentID:e.componentID,children:z,params:t})};export{k as Select,k as default};
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "../../chunk-JJ3PEWPN.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import {
+  useState
+} from "react";
+import {
+  $$
+} from "../../@utils/_";
+import Box from "../../atoms/Box";
+import FAI from "../../atoms/FAI";
+import {
+  Wrapper,
+  BoxWrapper,
+  SubmitForm,
+  CommonEffects,
+  DefaultStyles
+} from "./core";
+import Parts from "./Parts";
+import {
+  InputClasses,
+  InputSelectClasses
+} from "../../@styles/componentClasses/_";
+function DefaultValidation(props) {
+  let {
+    value,
+    params
+  } = props;
+  let {
+    required,
+    options
+  } = params;
+  let notice = [];
+  if (required) {
+    if (!options.length || options.length && $$.is.nullish(JSON.parse(value))) {
+      notice.push({ type: "invalid", label: "\u5FC5\u9808\u9805\u76EE\u3067\u3059" });
+    }
+  }
+  return {
+    ok: !notice.filter(({ type }) => type == "invalid").length,
+    notice
+  };
+}
+const Comps = {
+  Core: (params) => {
+    var _b;
+    let _a = params, {
+      tone,
+      required,
+      form,
+      className,
+      enableFormSubmit,
+      enableUnSelected,
+      checkValidationAtFirst,
+      onChange,
+      onKeyDown,
+      onValidate,
+      onUpdateValue,
+      onUpdateValidValue,
+      value = "",
+      options,
+      placeholder,
+      leftIndicator,
+      rightIndicator,
+      leftIcon,
+      rightIcon,
+      componentID,
+      status_id
+    } = _a, others = __objRest(_a, [
+      "tone",
+      "required",
+      "form",
+      "className",
+      "enableFormSubmit",
+      "enableUnSelected",
+      "checkValidationAtFirst",
+      "onChange",
+      "onKeyDown",
+      "onValidate",
+      "onUpdateValue",
+      "onUpdateValidValue",
+      "value",
+      "options",
+      "placeholder",
+      "leftIndicator",
+      "rightIndicator",
+      "leftIcon",
+      "rightIcon",
+      "componentID",
+      "status_id"
+    ]);
+    let Default_Status = {
+      componentID: params.componentID || "",
+      dataValue: value,
+      eventType: "init",
+      eventID: $$.uuid.gen()
+    };
+    let [val_status, set_status] = useState(Default_Status);
+    let [val_validate, set_validate] = useState({
+      ok: false,
+      notice: []
+    });
+    CommonEffects({
+      type: "select",
+      params,
+      val_status,
+      set_status,
+      ExtraOverrideParams: {
+        dataValue: value,
+        formatValue: value
+      },
+      val_validate,
+      set_validate,
+      DefaultValidation,
+      onUpdateValue,
+      onUpdateValidValue
+    });
+    let SelectedElement = /* @__PURE__ */ jsx(Box, { fontColor: "4.thin", textAlign: "left", children: placeholder || "\u9078\u629E" });
+    if (val_status.dataValue) {
+      let Selected = options.find((option) => option.value == val_status.dataValue);
+      if (Selected)
+        SelectedElement = (_b = Selected.displayLabel) != null ? _b : Selected.label;
+    }
+    return /* @__PURE__ */ jsx(
+      BoxWrapper,
+      {
+        val_status,
+        set_status,
+        val_validate,
+        params,
+        children: /* @__PURE__ */ jsxs(
+          Box,
+          {
+            className: [
+              className,
+              InputSelectClasses("SelectLegend"),
+              InputClasses("InputCover")
+            ].join(" "),
+            children: [
+              SelectedElement,
+              /* @__PURE__ */ jsx(
+                "select",
+                __spreadProps(__spreadValues({
+                  "data-form": form,
+                  "data-input-type": "select",
+                  "data-validation": val_validate.ok,
+                  "data-component-id": val_status.componentID,
+                  "data-value": val_status.dataValue,
+                  value: val_status.dataValue,
+                  onKeyDown: (event) => {
+                    if (onKeyDown)
+                      onKeyDown(event);
+                    if (enableFormSubmit)
+                      SubmitForm(event);
+                  },
+                  onChange: (event) => {
+                    let {
+                      value: rawValue
+                    } = event.target;
+                    if (val_validate.ok)
+                      set_validate({ ok: false, notice: [] });
+                    set_status(__spreadProps(__spreadValues({}, val_status), {
+                      dataValue: rawValue,
+                      eventType: "update",
+                      eventID: $$.uuid.gen()
+                    }));
+                    if (onChange)
+                      onChange(event);
+                  }
+                }, others), {
+                  className: InputSelectClasses("Select"),
+                  children: /* @__PURE__ */ jsx(Comps.Options, __spreadValues({}, params))
+                })
+              )
+            ]
+          }
+        )
+      }
+    );
+  },
+  Options: (params) => {
+    let {
+      options = [],
+      placeholder = "\u9078\u629E\u3057\u3066\u304F\u3060\u3055\u3044",
+      enableUnSelected = true
+    } = params;
+    let Options = options.map((option) => {
+      let {
+        value,
+        label
+      } = option;
+      let Value = String(value);
+      return /* @__PURE__ */ jsx(
+        "option",
+        {
+          value: Value,
+          children: label
+        },
+        Value
+      );
+    });
+    if (enableUnSelected) {
+      Options.unshift(/* @__PURE__ */ jsx(
+        "option",
+        {
+          value: JSON.stringify(null),
+          children: placeholder
+        },
+        0
+      ));
+    }
+    return /* @__PURE__ */ jsx(Fragment, { children: Options });
+  }
+};
+const SelectInput = (params) => {
+  let {
+    value = null,
+    placeholder,
+    options = []
+  } = params;
+  let SelectedExist = 0;
+  let SelectedValue = JSON.stringify(value);
+  let DefaultOptions = options.map((option) => {
+    let { value: value2, label } = option;
+    let Value = JSON.stringify(value2);
+    let Selected = Value == SelectedValue;
+    SelectedExist |= Number(Selected);
+    return __spreadProps(__spreadValues({}, option), {
+      value: Value,
+      label
+    });
+  });
+  if (!SelectedExist)
+    value = null;
+  let DefaultValue = JSON.stringify(value);
+  return /* @__PURE__ */ jsx(
+    Comps.Core,
+    __spreadProps(__spreadValues({}, params), {
+      value: DefaultValue,
+      options: DefaultOptions
+    })
+  );
+};
+const Select = (rawParams) => {
+  var _a, _b;
+  rawParams = __spreadValues({}, rawParams);
+  if ($$.is.nullish(rawParams.rightIcon)) {
+    rawParams.rightIcon = /* @__PURE__ */ jsx(
+      Parts.RightIcon,
+      __spreadProps(__spreadValues({
+        flexType: "col"
+      }, rawParams.rightIconStyles), {
+        children: /* @__PURE__ */ jsx(FAI.AngleDown, {})
+      })
+    );
+  }
+  if (rawParams.rightIcon)
+    rawParams.paddingRight = (_a = rawParams.paddingRight) != null ? _a : 3;
+  if (rawParams.leftIcon)
+    rawParams.paddingLeft = (_b = rawParams.paddingLeft) != null ? _b : 3;
+  let params = DefaultStyles.Boxish(rawParams);
+  delete params.rightIconStyles;
+  return /* @__PURE__ */ jsx(
+    Wrapper,
+    {
+      componentID: rawParams.componentID,
+      children: SelectInput,
+      params
+    }
+  );
+};
+export {
+  Select,
+  Select as default
+};