matsuri-ui 9.7.2-alpha.0

package/dist/esm/Tabs/TabPanel.js

@@ -0,0 +1,41 @@
+var _excluded = ["index", "children"];
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+
+import { css } from "@emotion/react";
+import { useTab } from "./useTab";
+import React from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "eivff4",
+  styles: "display:none"
+} : {
+  name: "1in24jo-TabPanel",
+  styles: "display:none;label:TabPanel;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9UYWJzL1RhYlBhbmVsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFlbUIiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL1RhYnMvVGFiUGFuZWwudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCJcbmltcG9ydCB7IHVzZVRhYiB9IGZyb20gXCIuL3VzZVRhYlwiXG5pbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCJcblxuZXhwb3J0IGNvbnN0IFRhYlBhbmVsOiBSZWFjdC5GQzx7IGluZGV4PzogbnVtYmVyIH0gJiBSZWFjdC5IVE1MQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4+ID0gKHtcbiAgICBpbmRleCA9IDAsXG4gICAgY2hpbGRyZW4sXG4gICAgLi4ucHJvcHNcbn0pID0+IHtcbiAgICBjb25zdCB7IGN1cnJlbnRJbmRleCB9ID0gdXNlVGFiKClcbiAgICBjb25zdCBoaWRkZW4gPSBjdXJyZW50SW5kZXggIT09IGluZGV4XG4gICAgcmV0dXJuIChcbiAgICAgICAgPGRpdlxuICAgICAgICAgICAgY3NzPXtcbiAgICAgICAgICAgICAgICBoaWRkZW4gJiZcbiAgICAgICAgICAgICAgICBjc3NgXG4gICAgICAgICAgICAgICAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgICAgICAgICAgICAgYFxuICAgICAgICAgICAgfVxuICAgICAgICAgICAgey4uLnByb3BzfVxuICAgICAgICA+XG4gICAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgIDwvZGl2PlxuICAgIClcbn1cbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+export var TabPanel = _ref2 => {
+  var {
+    index = 0,
+    children
+  } = _ref2,
+      props = _objectWithoutProperties(_ref2, _excluded);
+
+  var {
+    currentIndex
+  } = useTab();
+  var hidden = currentIndex !== index;
+  return ___EmotionJSX("div", _extends({
+    css: hidden && _ref
+  }, props), children);
+};
+//# sourceMappingURL=TabPanel.js.map

package/dist/esm/Tabs/TabPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Tabs/TabPanel.tsx"],"names":["css","useTab","React","TabPanel","index","children","props","currentIndex","hidden"],"mappings":";;;;;;;;;;AAAA,SAASA,GAAT,QAAoB,gBAApB;AACA,SAASC,MAAT,QAAuB,UAAvB;AACA,OAAOC,KAAP,MAAkB,OAAlB;;;;;;;;;;;;;AAEA,OAAO,IAAMC,QAA6E,GAAG,SAIvF;AAAA,MAJwF;AAC1FC,IAAAA,KAAK,GAAG,CADkF;AAE1FC,IAAAA;AAF0F,GAIxF;AAAA,MADCC,KACD;;AACF,MAAM;AAAEC,IAAAA;AAAF,MAAmBN,MAAM,EAA/B;AACA,MAAMO,MAAM,GAAGD,YAAY,KAAKH,KAAhC;AACA,SACI;AACI,IAAA,GAAG,EACCI,MAAM;AAFd,KAOQF,KAPR,GASKD,QATL,CADJ;AAaH,CApBM","sourcesContent":["import { css } from \"@emotion/react\"\nimport { useTab } from \"./useTab\"\nimport React from \"react\"\n\nexport const TabPanel: React.FC<{ index?: number } & React.HTMLAttributes<HTMLDivElement>> = ({\n    index = 0,\n    children,\n    ...props\n}) => {\n    const { currentIndex } = useTab()\n    const hidden = currentIndex !== index\n    return (\n        <div\n            css={\n                hidden &&\n                css`\n                    display: none;\n                `\n            }\n            {...props}\n        >\n            {children}\n        </div>\n    )\n}\n"],"file":"TabPanel.js"}

package/dist/esm/Tabs/TabPanelGroup.js

@@ -0,0 +1,13 @@
+import React from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var TabPanelGroup = _ref => {
+  var {
+    children
+  } = _ref;
+  return ___EmotionJSX(React.Fragment, null, React.Children.map(children, (child, index) => {
+    return /*#__PURE__*/React.cloneElement(child, {
+      index
+    });
+  }));
+};
+//# sourceMappingURL=TabPanelGroup.js.map

package/dist/esm/Tabs/TabPanelGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Tabs/TabPanelGroup.tsx"],"names":["React","TabPanelGroup","children","Children","map","child","index","cloneElement"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,OAAO,IAAMC,aAAuB,GAAG,QAAkB;AAAA,MAAjB;AAAEC,IAAAA;AAAF,GAAiB;AACrD,SACI,oCACKF,KAAK,CAACG,QAAN,CAAeC,GAAf,CAAmBF,QAAnB,EAAqD,CAACG,KAAD,EAAQC,KAAR,KAAkB;AACpE,wBAAON,KAAK,CAACO,YAAN,CAAmBF,KAAnB,EAA0B;AAAEC,MAAAA;AAAF,KAA1B,CAAP;AACH,GAFA,CADL,CADJ;AAOH,CARM","sourcesContent":["import React from \"react\"\n\nexport const TabPanelGroup: React.FC = ({ children }) => {\n    return (\n        <>\n            {React.Children.map(children as React.ReactElement[], (child, index) => {\n                return React.cloneElement(child, { index })\n            })}\n        </>\n    )\n}\n"],"file":"TabPanelGroup.js"}

package/dist/esm/Tabs/TabProvider.js

@@ -0,0 +1,32 @@
+import React, { createContext, useEffect, useState } from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var TabContext = /*#__PURE__*/createContext({});
+export var TabProvider = _ref => {
+  var {
+    defaultIndex = 0,
+    children,
+    onChange
+  } = _ref;
+  var cache = React.useRef(defaultIndex);
+  var [index, setIndex] = useState(defaultIndex);
+  var [tab, setTab] = useState();
+  useEffect(() => {
+    if (cache.current === index) {
+      cache.current = null;
+      return;
+    }
+
+    if (onChange) {
+      onChange(index);
+    }
+  }, [index, onChange]);
+  return ___EmotionJSX(TabContext.Provider, {
+    value: {
+      currentIndex: index,
+      setCurrentIndex: setIndex,
+      currentTab: tab,
+      setCurrentTab: setTab
+    }
+  }, ___EmotionJSX(React.Fragment, null, children));
+};
+//# sourceMappingURL=TabProvider.js.map

package/dist/esm/Tabs/TabProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Tabs/TabProvider.tsx"],"names":["React","createContext","useEffect","useState","TabContext","TabProvider","defaultIndex","children","onChange","cache","useRef","index","setIndex","tab","setTab","current","currentIndex","setCurrentIndex","currentTab","setCurrentTab"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,aAAhB,EAA+BC,SAA/B,EAA0CC,QAA1C,QAA0D,OAA1D;;AASA,OAAO,IAAMC,UAAU,gBAAGH,aAAa,CAAC,EAAD,CAAhC;AAEP,OAAO,IAAMI,WAGX,GAAG,QAA8C;AAAA,MAA7C;AAAEC,IAAAA,YAAY,GAAG,CAAjB;AAAoBC,IAAAA,QAApB;AAA8BC,IAAAA;AAA9B,GAA6C;AAC/C,MAAMC,KAAK,GAAGT,KAAK,CAACU,MAAN,CAA4BJ,YAA5B,CAAd;AACA,MAAM,CAACK,KAAD,EAAQC,QAAR,IAAoBT,QAAQ,CAACG,YAAD,CAAlC;AACA,MAAM,CAACO,GAAD,EAAMC,MAAN,IAAgBX,QAAQ,EAA9B;AACAD,EAAAA,SAAS,CAAC,MAAM;AACZ,QAAIO,KAAK,CAACM,OAAN,KAAkBJ,KAAtB,EAA6B;AACzBF,MAAAA,KAAK,CAACM,OAAN,GAAgB,IAAhB;AACA;AACH;;AACD,QAAIP,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAACG,KAAD,CAAR;AACH;AACJ,GARQ,EAQN,CAACA,KAAD,EAAQH,QAAR,CARM,CAAT;AASA,SACI,cAAC,UAAD,CAAY,QAAZ;AACI,IAAA,KAAK,EAAE;AACHQ,MAAAA,YAAY,EAAEL,KADX;AAEHM,MAAAA,eAAe,EAAEL,QAFd;AAGHM,MAAAA,UAAU,EAAEL,GAHT;AAIHM,MAAAA,aAAa,EAAEL;AAJZ;AADX,KAQI,oCAAGP,QAAH,CARJ,CADJ;AAYH,CA5BM","sourcesContent":["import React, { createContext, useEffect, useState } from \"react\"\n\nexport interface TabContextProps {\n    currentIndex: number\n    setCurrentIndex: (index: number) => void\n    currentTab?: HTMLButtonElement\n    setCurrentTab: (tab: HTMLButtonElement) => void\n}\n\nexport const TabContext = createContext({} as TabContextProps)\n\nexport const TabProvider: React.FC<{\n    defaultIndex?: number\n    onChange?: (v: any) => void\n}> = ({ defaultIndex = 0, children, onChange }) => {\n    const cache = React.useRef<number | null>(defaultIndex)\n    const [index, setIndex] = useState(defaultIndex)\n    const [tab, setTab] = useState<HTMLButtonElement>()\n    useEffect(() => {\n        if (cache.current === index) {\n            cache.current = null\n            return\n        }\n        if (onChange) {\n            onChange(index)\n        }\n    }, [index, onChange])\n    return (\n        <TabContext.Provider\n            value={{\n                currentIndex: index,\n                setCurrentIndex: setIndex,\n                currentTab: tab,\n                setCurrentTab: setTab\n            }}\n        >\n            <>{children}</>\n        </TabContext.Provider>\n    )\n}\n"],"file":"TabProvider.js"}

package/dist/esm/Tabs/index.js

@@ -0,0 +1,7 @@
+export * from "./Tab";
+export * from "./TabGroup";
+export * from "./TabPanel";
+export * from "./TabPanelGroup";
+export * from "./useTab";
+export * from "./TabProvider";
+//# sourceMappingURL=index.js.map

package/dist/esm/Tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Tabs/index.tsx"],"names":[],"mappings":"AAAA,cAAc,OAAd;AACA,cAAc,YAAd;AACA,cAAc,YAAd;AACA,cAAc,iBAAd;AACA,cAAc,UAAd;AACA,cAAc,eAAd","sourcesContent":["export * from \"./Tab\"\nexport * from \"./TabGroup\"\nexport * from \"./TabPanel\"\nexport * from \"./TabPanelGroup\"\nexport * from \"./useTab\"\nexport * from \"./TabProvider\"\n"],"file":"index.js"}

package/dist/esm/Tabs/useTab.js

@@ -0,0 +1,7 @@
+import { TabContext } from "./TabProvider";
+import { useContext } from "react";
+export var useTab = () => {
+  var context = useContext(TabContext);
+  return context;
+};
+//# sourceMappingURL=useTab.js.map

package/dist/esm/Tabs/useTab.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Tabs/useTab.tsx"],"names":["TabContext","useContext","useTab","context"],"mappings":"AAAA,SAASA,UAAT,QAA2B,eAA3B;AACA,SAASC,UAAT,QAA2B,OAA3B;AACA,OAAO,IAAMC,MAAM,GAAG,MAAM;AACxB,MAAMC,OAAO,GAAGF,UAAU,CAACD,UAAD,CAA1B;AACA,SAAOG,OAAP;AACH,CAHM","sourcesContent":["import { TabContext } from \"./TabProvider\"\nimport { useContext } from \"react\"\nexport const useTab = () => {\n    const context = useContext(TabContext)\n    return context\n}\n"],"file":"useTab.js"}

package/dist/esm/TextField/index.js

@@ -0,0 +1,76 @@
+var _excluded = ["label", "style", "className", "onChange", "disabled", "validationMessages", "customValidations", "type", "bottomGutter", "helperText", "invalid"];
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import { FormControl } from "../FormControl";
+import { FormHelperText } from "../FormHelperText";
+import { InputBase } from "../InputBase";
+import { InputLabel } from "../InputLabel";
+import { useDitectInputTouched } from "./useDitectInputTouched";
+import { useValidation } from "./useValidation";
+import React, { useCallback, useRef, useState } from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var TextField = /*#__PURE__*/React.forwardRef((_ref, rootRef) => {
+  var {
+    label,
+    style,
+    className,
+    onChange,
+    disabled,
+    validationMessages,
+    customValidations,
+    type = "text",
+    bottomGutter,
+    helperText,
+    invalid
+  } = _ref,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var ref = useRef(null);
+  var [value, setValue] = useState(props.value || props.defaultValue);
+  var validation = useValidation({
+    ref,
+    validationMessages,
+    customValidations,
+    value
+  });
+  var handleChange = useCallback(event => {
+    var {
+      value
+    } = event.currentTarget;
+    setValue(value);
+
+    if (onChange) {
+      onChange(value, event);
+    }
+  }, [onChange]);
+  var [touched, inputProps] = useDitectInputTouched();
+  return ___EmotionJSX(FormControl, {
+    style: style,
+    className: className,
+    ref: rootRef
+  }, ___EmotionJSX(InputLabel, {
+    "aria-disabled": disabled,
+    required: props.required
+  }, label), ___EmotionJSX(InputBase, _extends({
+    disabled: disabled,
+    type: type
+  }, props, {
+    onChange: handleChange,
+    "data-invalid": !validation.valid,
+    ref: ref
+  }, inputProps)), touched && validation.message ? ___EmotionJSX(FormHelperText, {
+    bottomGutter: bottomGutter,
+    invalid: !validation.valid
+  }, validation.message) : ___EmotionJSX(FormHelperText, {
+    bottomGutter: bottomGutter,
+    invalid: invalid
+  }, typeof helperText === "function" ? helperText({
+    value
+  }) : helperText));
+});
+//# sourceMappingURL=index.js.map

package/dist/esm/TextField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/TextField/index.tsx"],"names":["FormControl","FormHelperText","InputBase","InputLabel","useDitectInputTouched","useValidation","React","useCallback","useRef","useState","TextField","forwardRef","rootRef","label","style","className","onChange","disabled","validationMessages","customValidations","type","bottomGutter","helperText","invalid","props","ref","value","setValue","defaultValue","validation","handleChange","event","currentTarget","touched","inputProps","required","valid","message"],"mappings":";;;;;;;;AAAA,SAASA,WAAT,QAA4B,gBAA5B;AACA,SAASC,cAAT,QAAuD,mBAAvD;AACA,SAASC,SAAT,QAA0C,cAA1C;AACA,SAASC,UAAT,QAA2B,eAA3B;AACA,SAASC,qBAAT,QAAsC,yBAAtC;AACA,SAASC,aAAT,QAA8B,iBAA9B;AACA,OAAOC,KAAP,IAAgBC,WAAhB,EAA6BC,MAA7B,EAAqCC,QAArC,QAAqD,OAArD;;AAyCA,OAAO,IAAMC,SAAS,gBAAGJ,KAAK,CAACK,UAAN,CACrB,OAeIC,OAfJ,KAgBK;AAAA,MAfD;AACIC,IAAAA,KADJ;AAEIC,IAAAA,KAFJ;AAGIC,IAAAA,SAHJ;AAIIC,IAAAA,QAJJ;AAKIC,IAAAA,QALJ;AAMIC,IAAAA,kBANJ;AAOIC,IAAAA,iBAPJ;AAQIC,IAAAA,IAAI,GAAG,MARX;AASIC,IAAAA,YATJ;AAUIC,IAAAA,UAVJ;AAWIC,IAAAA;AAXJ,GAeC;AAAA,MAHMC,KAGN;;AACD,MAAMC,GAAG,GAAGjB,MAAM,CAAmB,IAAnB,CAAlB;AACA,MAAM,CAACkB,KAAD,EAAQC,QAAR,IAAoBlB,QAAQ,CAACe,KAAK,CAACE,KAAN,IAAeF,KAAK,CAACI,YAAtB,CAAlC;AACA,MAAMC,UAAU,GAAGxB,aAAa,CAAC;AAC7BoB,IAAAA,GAD6B;AAE7BP,IAAAA,kBAF6B;AAG7BC,IAAAA,iBAH6B;AAI7BO,IAAAA;AAJ6B,GAAD,CAAhC;AAMA,MAAMI,YAAY,GAAGvB,WAAW,CAC3BwB,KAAD,IAAgD;AAC5C,QAAM;AAAEL,MAAAA;AAAF,QAAYK,KAAK,CAACC,aAAxB;AACAL,IAAAA,QAAQ,CAACD,KAAD,CAAR;;AACA,QAAIV,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAACU,KAAD,EAAQK,KAAR,CAAR;AACH;AACJ,GAP2B,EAQ5B,CAACf,QAAD,CAR4B,CAAhC;AAUA,MAAM,CAACiB,OAAD,EAAUC,UAAV,IAAwB9B,qBAAqB,EAAnD;AACA,SACI,cAAC,WAAD;AAAa,IAAA,KAAK,EAAEU,KAApB;AAA2B,IAAA,SAAS,EAAEC,SAAtC;AAAiD,IAAA,GAAG,EAAEH;AAAtD,KACI,cAAC,UAAD;AAAY,qBAAeK,QAA3B;AAAqC,IAAA,QAAQ,EAAEO,KAAK,CAACW;AAArD,KACKtB,KADL,CADJ,EAII,cAAC,SAAD;AACI,IAAA,QAAQ,EAAEI,QADd;AAEI,IAAA,IAAI,EAAEG;AAFV,KAGQI,KAHR;AAII,IAAA,QAAQ,EAAEM,YAJd;AAKI,oBAAc,CAACD,UAAU,CAACO,KAL9B;AAMI,IAAA,GAAG,EAAEX;AANT,KAOQS,UAPR,EAJJ,EAaKD,OAAO,IAAIJ,UAAU,CAACQ,OAAtB,GACG,cAAC,cAAD;AAAgB,IAAA,YAAY,EAAEhB,YAA9B;AAA4C,IAAA,OAAO,EAAE,CAACQ,UAAU,CAACO;AAAjE,KACKP,UAAU,CAACQ,OADhB,CADH,GAKG,cAAC,cAAD;AAAgB,IAAA,YAAY,EAAEhB,YAA9B;AAA4C,IAAA,OAAO,EAAEE;AAArD,KACK,OAAOD,UAAP,KAAsB,UAAtB,GAAmCA,UAAU,CAAC;AAAEI,IAAAA;AAAF,GAAD,CAA7C,GAA2DJ,UADhE,CAlBR,CADJ;AAyBH,CA9DoB,CAAlB","sourcesContent":["import { FormControl } from \"../FormControl\"\nimport { FormHelperText, InputBottomGutterProps } from \"../FormHelperText\"\nimport { InputBase, InputBaseProps } from \"../InputBase\"\nimport { InputLabel } from \"../InputLabel\"\nimport { useDitectInputTouched } from \"./useDitectInputTouched\"\nimport { useValidation } from \"./useValidation\"\nimport React, { useCallback, useRef, useState } from \"react\"\n\nexport interface FieldProps<T> {\n    value?: T\n    defaultValue?: T\n    /**\n     * ラベルの文字列を指定します。ラベルは左上に表示されます。\n     */\n    label?: string\n    /**\n     * input要素本来のバリデーションに任意のバリデーションを追加することができます。\n     */\n    customValidations?: Array<(value?: T) => string | undefined | false>\n    /**\n     * input要素本来のバリーデーションメッセージを変更することができます。\n     */\n    validationMessages?: {\n        [key in keyof ValidityState]?: string\n    }\n    /**\n     * inputの値が更新された場合に発火します。\n     *\n     * onChangeが呼ばれるタイミングと内部実装の値が変更されるタイミングは異なります。\n     * そのため、onChange発火直後にformなどのrefから値を取得しようとするとズレが発生する場合があります。\n     */\n    onChange?: (value: T, event?: React.SyntheticEvent<HTMLElement>) => void\n    /**\n     * 任意のヘルパーテキストを挿入できます。ただしinput要素本来のバリデーションの方が優先されます。\n     */\n    helperText?: React.ReactNode | ((props: { value?: T }) => React.ReactNode)\n    /**\n     * 任意のヘルパーテキストをinvalidなものとして扱いたい場合に使用できます。\n     */\n    invalid?: boolean\n}\n\nexport interface TextFieldProps\n    extends FieldProps<string>,\n        Omit<InputBaseProps, \"value\" | \"onChange\" | \"defaultValue\">,\n        InputBottomGutterProps {}\n\nexport const TextField = React.forwardRef<HTMLDivElement, TextFieldProps>(\n    (\n        {\n            label,\n            style,\n            className,\n            onChange,\n            disabled,\n            validationMessages,\n            customValidations,\n            type = \"text\",\n            bottomGutter,\n            helperText,\n            invalid,\n            ...props\n        },\n        rootRef\n    ) => {\n        const ref = useRef<HTMLInputElement>(null)\n        const [value, setValue] = useState(props.value || props.defaultValue)\n        const validation = useValidation({\n            ref,\n            validationMessages,\n            customValidations,\n            value\n        })\n        const handleChange = useCallback(\n            (event: React.ChangeEvent<HTMLInputElement>) => {\n                const { value } = event.currentTarget\n                setValue(value)\n                if (onChange) {\n                    onChange(value, event)\n                }\n            },\n            [onChange]\n        )\n        const [touched, inputProps] = useDitectInputTouched()\n        return (\n            <FormControl style={style} className={className} ref={rootRef}>\n                <InputLabel aria-disabled={disabled} required={props.required}>\n                    {label}\n                </InputLabel>\n                <InputBase\n                    disabled={disabled}\n                    type={type}\n                    {...props}\n                    onChange={handleChange}\n                    data-invalid={!validation.valid}\n                    ref={ref}\n                    {...inputProps}\n                />\n                {touched && validation.message ? (\n                    <FormHelperText bottomGutter={bottomGutter} invalid={!validation.valid}>\n                        {validation.message}\n                    </FormHelperText>\n                ) : (\n                    <FormHelperText bottomGutter={bottomGutter} invalid={invalid}>\n                        {typeof helperText === \"function\" ? helperText({ value }) : helperText}\n                    </FormHelperText>\n                )}\n            </FormControl>\n        )\n    }\n)\n"],"file":"index.js"}

package/dist/esm/TextField/useDitectInputTouched.js

@@ -0,0 +1,10 @@
+import { useMemo, useState } from "react";
+export var useDitectInputTouched = () => {
+  var [touched, setTouched] = useState(false);
+  var handleFocus = useMemo(() => touched ? undefined : () => setTouched(true), [touched]);
+  return [touched, {
+    "data-touched": touched,
+    onFocus: handleFocus
+  }];
+};
+//# sourceMappingURL=useDitectInputTouched.js.map

package/dist/esm/TextField/useDitectInputTouched.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/TextField/useDitectInputTouched.tsx"],"names":["useMemo","useState","useDitectInputTouched","touched","setTouched","handleFocus","undefined","onFocus"],"mappings":"AAAA,SAASA,OAAT,EAAkBC,QAAlB,QAAkC,OAAlC;AACA,OAAO,IAAMC,qBAAqB,GAAG,MAAM;AACvC,MAAM,CAACC,OAAD,EAAUC,UAAV,IAAwBH,QAAQ,CAAC,KAAD,CAAtC;AACA,MAAMI,WAAW,GAAGL,OAAO,CAAC,MAAOG,OAAO,GAAGG,SAAH,GAAe,MAAMF,UAAU,CAAC,IAAD,CAA9C,EAAuD,CAACD,OAAD,CAAvD,CAA3B;AACA,SAAO,CACHA,OADG,EAEH;AACI,oBAAgBA,OADpB;AAEII,IAAAA,OAAO,EAAEF;AAFb,GAFG,CAAP;AAOH,CAVM","sourcesContent":["import { useMemo, useState } from \"react\"\nexport const useDitectInputTouched = () => {\n    const [touched, setTouched] = useState(false)\n    const handleFocus = useMemo(() => (touched ? undefined : () => setTouched(true)), [touched])\n    return [\n        touched,\n        {\n            \"data-touched\": touched,\n            onFocus: handleFocus\n        }\n    ] as const\n}\n"],"file":"useDitectInputTouched.js"}

package/dist/esm/TextField/useValidation.js

@@ -0,0 +1,80 @@
+import { useCallback, useEffect, useState } from "react";
+
+var selectValidityType = validity => {
+  var type = "valid";
+
+  for (var key in validity) {
+    if (validity[key] === true) {
+      type = key;
+      break;
+    }
+  }
+
+  return type;
+};
+
+export function useValidation(_ref) {
+  var {
+    ref,
+    validationMessages,
+    customValidations,
+    value
+  } = _ref;
+  var [validation, setValidation] = useState({
+    valid: true,
+    message: "",
+    type: "valid"
+  });
+  /**
+   * カスタムバリデーション
+   * Input要素の値が変更される度に評価し、invalidであればsetCustomValidityを発火する
+   */
+
+  useEffect(() => {
+    if (customValidations && ref && ref.current) {
+      var selectedCustomValidation = customValidations.find(customValidation => {
+        return !!customValidation(value);
+      });
+
+      if (selectedCustomValidation) {
+        var message = selectedCustomValidation(value);
+
+        if (message) {
+          ref.current.setCustomValidity(message);
+        }
+      } else {
+        // 無効なものがなければリセット
+        ref.current.setCustomValidity("");
+      }
+    }
+  }, [customValidations, ref, value]);
+  var selectValidationMessage = useCallback((type, validationMessage) => {
+    if (validationMessages && validationMessages[type]) {
+      return validationMessages[type];
+    } else {
+      return validationMessage;
+    }
+  }, [validationMessages]);
+  /**
+   * バリデーション
+   * Input要素の値が変更される度、カスタムバリデーションの次に評価する
+   */
+
+  useEffect(() => {
+    if (ref && ref.current) {
+      var {
+        validity,
+        validationMessage
+      } = ref.current;
+      var type = selectValidityType(validity);
+      var message = selectValidationMessage(type, validationMessage);
+      setValidation({
+        valid: validity.valid,
+        message,
+        type
+      });
+    }
+  }, [ref, validationMessages, selectValidationMessage, value]);
+  return validation;
+}
+//# sourceMappingURL=useValidation.js.map

package/dist/esm/TextField/useValidation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/TextField/useValidation.tsx"],"names":["useCallback","useEffect","useState","selectValidityType","validity","type","key","useValidation","ref","validationMessages","customValidations","value","validation","setValidation","valid","message","current","selectedCustomValidation","find","customValidation","setCustomValidity","selectValidationMessage","validationMessage"],"mappings":"AAAA,SAASA,WAAT,EAAsBC,SAAtB,EAAiCC,QAAjC,QAAiD,OAAjD;;AAOA,IAAMC,kBAAkB,GAAIC,QAAD,IAA6B;AACpD,MAAIC,IAAI,GAAG,OAAX;;AACA,OAAK,IAAIC,GAAT,IAAgBF,QAAhB,EAA0B;AACtB,QAAIA,QAAQ,CAACE,GAAD,CAAR,KAAkB,IAAtB,EAA4B;AACxBD,MAAAA,IAAI,GAAGC,GAAP;AACA;AACH;AACJ;;AACD,SAAOD,IAAP;AACH,CATD;;AAgBA,OAAO,SAASE,aAAT,OAUJ;AAAA,MAV8B;AAC7BC,IAAAA,GAD6B;AAE7BC,IAAAA,kBAF6B;AAG7BC,IAAAA,iBAH6B;AAI7BC,IAAAA;AAJ6B,GAU9B;AACC,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8BX,QAAQ,CAAa;AACrDY,IAAAA,KAAK,EAAE,IAD8C;AAErDC,IAAAA,OAAO,EAAE,EAF4C;AAGrDV,IAAAA,IAAI,EAAE;AAH+C,GAAb,CAA5C;AAKA;AACJ;AACA;AACA;;AACIJ,EAAAA,SAAS,CAAC,MAAM;AACZ,QAAIS,iBAAiB,IAAIF,GAArB,IAA4BA,GAAG,CAACQ,OAApC,EAA6C;AACzC,UAAMC,wBAAwB,GAAGP,iBAAiB,CAACQ,IAAlB,CAAwBC,gBAAD,IAAsB;AAC1E,eAAO,CAAC,CAACA,gBAAgB,CAACR,KAAD,CAAzB;AACH,OAFgC,CAAjC;;AAGA,UAAIM,wBAAJ,EAA8B;AAC1B,YAAMF,OAAO,GAAGE,wBAAwB,CAACN,KAAD,CAAxC;;AACA,YAAII,OAAJ,EAAa;AACTP,UAAAA,GAAG,CAACQ,OAAJ,CAAYI,iBAAZ,CAA8BL,OAA9B;AACH;AACJ,OALD,MAKO;AACH;AACAP,QAAAA,GAAG,CAACQ,OAAJ,CAAYI,iBAAZ,CAA8B,EAA9B;AACH;AACJ;AACJ,GAfQ,EAeN,CAACV,iBAAD,EAAoBF,GAApB,EAAyBG,KAAzB,CAfM,CAAT;AAiBA,MAAMU,uBAAuB,GAAGrB,WAAW,CACvC,CAACK,IAAD,EAAOiB,iBAAP,KAA6B;AACzB,QAAIb,kBAAkB,IAAIA,kBAAkB,CAACJ,IAAD,CAA5C,EAAoD;AAChD,aAAOI,kBAAkB,CAACJ,IAAD,CAAzB;AACH,KAFD,MAEO;AACH,aAAOiB,iBAAP;AACH;AACJ,GAPsC,EAQvC,CAACb,kBAAD,CARuC,CAA3C;AAUA;AACJ;AACA;AACA;;AACIR,EAAAA,SAAS,CAAC,MAAM;AACZ,QAAIO,GAAG,IAAIA,GAAG,CAACQ,OAAf,EAAwB;AACpB,UAAM;AAAEZ,QAAAA,QAAF;AAAYkB,QAAAA;AAAZ,UAAkCd,GAAG,CAACQ,OAA5C;AACA,UAAMX,IAAI,GAAGF,kBAAkB,CAACC,QAAD,CAA/B;AACA,UAAMW,OAAO,GAAGM,uBAAuB,CAAChB,IAAD,EAAOiB,iBAAP,CAAvC;AACAT,MAAAA,aAAa,CAAC;AACVC,QAAAA,KAAK,EAAEV,QAAQ,CAACU,KADN;AAEVC,QAAAA,OAFU;AAGVV,QAAAA;AAHU,OAAD,CAAb;AAKH;AACJ,GAXQ,EAWN,CAACG,GAAD,EAAMC,kBAAN,EAA0BY,uBAA1B,EAAmDV,KAAnD,CAXM,CAAT;AAaA,SAAOC,UAAP;AACH","sourcesContent":["import { useCallback, useEffect, useState } from \"react\"\nexport interface Validation {\n    valid: boolean\n    type: keyof ValidityState\n    message: string\n}\n\nconst selectValidityType = (validity: ValidityState) => {\n    let type = \"valid\"\n    for (let key in validity) {\n        if (validity[key] === true) {\n            type = key\n            break\n        }\n    }\n    return type as keyof ValidityState\n}\n\nexport interface UseValidation<T> {\n    value?: T\n    fuck: Array<(value: T) => string | false | undefined>\n}\n\nexport function useValidation<T>({\n    ref,\n    validationMessages,\n    customValidations,\n    value\n}: {\n    ref: React.RefObject<HTMLInputElement | HTMLTextAreaElement>\n    validationMessages?: { [key in keyof ValidityState]?: string }\n    value: T\n    customValidations?: Array<(value: T) => string | false | undefined>\n}) {\n    const [validation, setValidation] = useState<Validation>({\n        valid: true,\n        message: \"\",\n        type: \"valid\"\n    })\n    /**\n     * カスタムバリデーション\n     * Input要素の値が変更される度に評価し、invalidであればsetCustomValidityを発火する\n     */\n    useEffect(() => {\n        if (customValidations && ref && ref.current) {\n            const selectedCustomValidation = customValidations.find((customValidation) => {\n                return !!customValidation(value)\n            })\n            if (selectedCustomValidation) {\n                const message = selectedCustomValidation(value)\n                if (message) {\n                    ref.current.setCustomValidity(message)\n                }\n            } else {\n                // 無効なものがなければリセット\n                ref.current.setCustomValidity(\"\")\n            }\n        }\n    }, [customValidations, ref, value])\n\n    const selectValidationMessage = useCallback(\n        (type, validationMessage) => {\n            if (validationMessages && validationMessages[type]) {\n                return validationMessages[type]\n            } else {\n                return validationMessage\n            }\n        },\n        [validationMessages]\n    )\n    /**\n     * バリデーション\n     * Input要素の値が変更される度、カスタムバリデーションの次に評価する\n     */\n    useEffect(() => {\n        if (ref && ref.current) {\n            const { validity, validationMessage } = ref.current\n            const type = selectValidityType(validity)\n            const message = selectValidationMessage(type, validationMessage)\n            setValidation({\n                valid: validity.valid,\n                message,\n                type\n            })\n        }\n    }, [ref, validationMessages, selectValidationMessage, value])\n\n    return validation\n}\n"],"file":"useValidation.js"}

package/dist/esm/TextareaBase/index.js

@@ -0,0 +1,15 @@
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import { css } from "@emotion/react";
+import { readonlyFieldBackgroundColor, readonlyFieldBorderColor } from "../InputBase/InputBase";
+import { useTheme } from "../theme";
+import React from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var TextareaBase = /*#__PURE__*/React.forwardRef((props, ref) => {
+  var theme = useTheme();
+  return ___EmotionJSX("textarea", _extends({
+    css: /*#__PURE__*/css( /*#__PURE__*/css(theme.typography.body, process.env.NODE_ENV === "production" ? "" : ";label:TextareaBase;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9UZXh0YXJlYUJhc2UvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVlrQiIsImZpbGUiOiIuLi8uLi8uLi9zcmMvVGV4dGFyZWFCYXNlL2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiXG5pbXBvcnQgeyByZWFkb25seUZpZWxkQmFja2dyb3VuZENvbG9yLCByZWFkb25seUZpZWxkQm9yZGVyQ29sb3IgfSBmcm9tIFwiLi4vSW5wdXRCYXNlL0lucHV0QmFzZVwiXG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCIuLi90aGVtZVwiXG5pbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCJcblxuZXhwb3J0IGludGVyZmFjZSBUZXh0YXJlYUJhc2VQcm9wcyBleHRlbmRzIFJlYWN0LlRleHRhcmVhSFRNTEF0dHJpYnV0ZXM8SFRNTFRleHRBcmVhRWxlbWVudD4ge31cblxuZXhwb3J0IGNvbnN0IFRleHRhcmVhQmFzZSA9IFJlYWN0LmZvcndhcmRSZWY8SFRNTFRleHRBcmVhRWxlbWVudCwgVGV4dGFyZWFCYXNlUHJvcHM+KChwcm9wcywgcmVmKSA9PiB7XG4gICAgY29uc3QgdGhlbWUgPSB1c2VUaGVtZSgpXG4gICAgcmV0dXJuIChcbiAgICAgICAgPHRleHRhcmVhXG4gICAgICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICAgICAgICAke2Nzcyh0aGVtZS50eXBvZ3JhcGh5LmJvZHkpfVxuICAgICAgICAgICAgICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgICAgICAgICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgICAgICAgICAgICAgZmxleDogMTtcbiAgICAgICAgICAgICAgICB3aWR0aDogMTAwJTtcbiAgICAgICAgICAgICAgICBtaW4taGVpZ2h0OiAke3RoZW1lLnNwYWNpbmcgKiA2fXB4O1xuICAgICAgICAgICAgICAgIHBhZGRpbmc6IDlweCAxMnB4O1xuICAgICAgICAgICAgICAgIGNvbG9yOiAke3RoZW1lLnBhbGV0dGUudGV4dC5wcmltYXJ5fTtcbiAgICAgICAgICAgICAgICByZXNpemU6IG5vbmU7XG4gICAgICAgICAgICAgICAgYm9yZGVyOiAxcHggc29saWQgJHt0aGVtZS5wYWxldHRlLnRleHQuc2Vjb25kYXJ5fTtcbiAgICAgICAgICAgICAgICBib3JkZXItcmFkaXVzOiA0cHg7XG4gICAgICAgICAgICAgICAgb3V0bGluZTogMHB4O1xuICAgICAgICAgICAgICAgIHRyYW5zaXRpb246IGFsbCAwLjNzO1xuICAgICAgICAgICAgICAgICY6Zm9jdXMge1xuICAgICAgICAgICAgICAgICAgICBib3JkZXItY29sb3I6ICR7dGhlbWUucGFsZXR0ZS5pbnRlbnRpb25zLnByaW1hcnkubWFpbn07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgICZbZGF0YS10b3VjaGVkPVwidHJ1ZVwiXTppbnZhbGlkIHtcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyLWNvbG9yOiAke3RoZW1lLnBhbGV0dGUuaW50ZW50aW9ucy5lcnJvci5tYWlufTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgJjo6cGxhY2Vob2xkZXIge1xuICAgICAgICAgICAgICAgICAgICBjb2xvcjogJHt0aGVtZS5wYWxldHRlLnRleHQuc2Vjb25kYXJ5fTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgJjpkaXNhYmxlZCB7XG4gICAgICAgICAgICAgICAgICAgIGNvbG9yOiAke3RoZW1lLnBhbGV0dGUudGV4dC5kaXNhYmxlZH07XG4gICAgICAgICAgICAgICAgICAgIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gICAgICAgICAgICAgICAgICAgIGJhY2tncm91bmQtY29sb3I6ICR7dGhlbWUucGFsZXR0ZS5hY3Rpb24uZGlzYWJsZWRCYWNrZ3JvdW5kfTtcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyLWNvbG9yOiAke3RoZW1lLnBhbGV0dGUuYWN0aW9uLmRpc2FibGVkfTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgJltyZWFkb25seV0ge1xuICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke3JlYWRvbmx5RmllbGRCYWNrZ3JvdW5kQ29sb3J9O1xuICAgICAgICAgICAgICAgICAgICBib3JkZXItY29sb3I6ICR7cmVhZG9ubHlGaWVsZEJvcmRlckNvbG9yfTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICBgfVxuICAgICAgICAgICAgcmVmPXtyZWZ9XG4gICAgICAgICAgICB7Li4ucHJvcHN9XG4gICAgICAgIC8+XG4gICAgKVxufSlcbiJdfQ== */"), " box-sizing:border-box;display:block;flex:1;width:100%;min-height:", theme.spacing * 6, "px;padding:9px 12px;color:", theme.palette.text.primary, ";resize:none;border:1px solid ", theme.palette.text.secondary, ";border-radius:4px;outline:0px;transition:all 0.3s;&:focus{border-color:", theme.palette.intentions.primary.main, ";}&[data-touched=\"true\"]:invalid{border-color:", theme.palette.intentions.error.main, ";}&::placeholder{color:", theme.palette.text.secondary, ";}&:disabled{color:", theme.palette.text.disabled, ";cursor:not-allowed;background-color:", theme.palette.action.disabledBackground, ";border-color:", theme.palette.action.disabled, ";}&[readonly]{background-color:", readonlyFieldBackgroundColor, ";border-color:", readonlyFieldBorderColor, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:TextareaBase;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9UZXh0YXJlYUJhc2UvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVdvQiIsImZpbGUiOiIuLi8uLi8uLi9zcmMvVGV4dGFyZWFCYXNlL2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiXG5pbXBvcnQgeyByZWFkb25seUZpZWxkQmFja2dyb3VuZENvbG9yLCByZWFkb25seUZpZWxkQm9yZGVyQ29sb3IgfSBmcm9tIFwiLi4vSW5wdXRCYXNlL0lucHV0QmFzZVwiXG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCIuLi90aGVtZVwiXG5pbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCJcblxuZXhwb3J0IGludGVyZmFjZSBUZXh0YXJlYUJhc2VQcm9wcyBleHRlbmRzIFJlYWN0LlRleHRhcmVhSFRNTEF0dHJpYnV0ZXM8SFRNTFRleHRBcmVhRWxlbWVudD4ge31cblxuZXhwb3J0IGNvbnN0IFRleHRhcmVhQmFzZSA9IFJlYWN0LmZvcndhcmRSZWY8SFRNTFRleHRBcmVhRWxlbWVudCwgVGV4dGFyZWFCYXNlUHJvcHM+KChwcm9wcywgcmVmKSA9PiB7XG4gICAgY29uc3QgdGhlbWUgPSB1c2VUaGVtZSgpXG4gICAgcmV0dXJuIChcbiAgICAgICAgPHRleHRhcmVhXG4gICAgICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICAgICAgICAke2Nzcyh0aGVtZS50eXBvZ3JhcGh5LmJvZHkpfVxuICAgICAgICAgICAgICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgICAgICAgICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgICAgICAgICAgICAgZmxleDogMTtcbiAgICAgICAgICAgICAgICB3aWR0aDogMTAwJTtcbiAgICAgICAgICAgICAgICBtaW4taGVpZ2h0OiAke3RoZW1lLnNwYWNpbmcgKiA2fXB4O1xuICAgICAgICAgICAgICAgIHBhZGRpbmc6IDlweCAxMnB4O1xuICAgICAgICAgICAgICAgIGNvbG9yOiAke3RoZW1lLnBhbGV0dGUudGV4dC5wcmltYXJ5fTtcbiAgICAgICAgICAgICAgICByZXNpemU6IG5vbmU7XG4gICAgICAgICAgICAgICAgYm9yZGVyOiAxcHggc29saWQgJHt0aGVtZS5wYWxldHRlLnRleHQuc2Vjb25kYXJ5fTtcbiAgICAgICAgICAgICAgICBib3JkZXItcmFkaXVzOiA0cHg7XG4gICAgICAgICAgICAgICAgb3V0bGluZTogMHB4O1xuICAgICAgICAgICAgICAgIHRyYW5zaXRpb246IGFsbCAwLjNzO1xuICAgICAgICAgICAgICAgICY6Zm9jdXMge1xuICAgICAgICAgICAgICAgICAgICBib3JkZXItY29sb3I6ICR7dGhlbWUucGFsZXR0ZS5pbnRlbnRpb25zLnByaW1hcnkubWFpbn07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgICZbZGF0YS10b3VjaGVkPVwidHJ1ZVwiXTppbnZhbGlkIHtcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyLWNvbG9yOiAke3RoZW1lLnBhbGV0dGUuaW50ZW50aW9ucy5lcnJvci5tYWlufTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgJjo6cGxhY2Vob2xkZXIge1xuICAgICAgICAgICAgICAgICAgICBjb2xvcjogJHt0aGVtZS5wYWxldHRlLnRleHQuc2Vjb25kYXJ5fTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgJjpkaXNhYmxlZCB7XG4gICAgICAgICAgICAgICAgICAgIGNvbG9yOiAke3RoZW1lLnBhbGV0dGUudGV4dC5kaXNhYmxlZH07XG4gICAgICAgICAgICAgICAgICAgIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gICAgICAgICAgICAgICAgICAgIGJhY2tncm91bmQtY29sb3I6ICR7dGhlbWUucGFsZXR0ZS5hY3Rpb24uZGlzYWJsZWRCYWNrZ3JvdW5kfTtcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyLWNvbG9yOiAke3RoZW1lLnBhbGV0dGUuYWN0aW9uLmRpc2FibGVkfTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgJltyZWFkb25seV0ge1xuICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke3JlYWRvbmx5RmllbGRCYWNrZ3JvdW5kQ29sb3J9O1xuICAgICAgICAgICAgICAgICAgICBib3JkZXItY29sb3I6ICR7cmVhZG9ubHlGaWVsZEJvcmRlckNvbG9yfTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICBgfVxuICAgICAgICAgICAgcmVmPXtyZWZ9XG4gICAgICAgICAgICB7Li4ucHJvcHN9XG4gICAgICAgIC8+XG4gICAgKVxufSlcbiJdfQ== */"),
+    ref: ref
+  }, props));
+});
+//# sourceMappingURL=index.js.map

package/dist/esm/TextareaBase/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/TextareaBase/index.tsx"],"names":["css","readonlyFieldBackgroundColor","readonlyFieldBorderColor","useTheme","React","TextareaBase","forwardRef","props","ref","theme","typography","body","spacing","palette","text","primary","secondary","intentions","main","error","disabled","action","disabledBackground"],"mappings":";;AAAA,SAASA,GAAT,QAAoB,gBAApB;AACA,SAASC,4BAAT,EAAuCC,wBAAvC,QAAuE,wBAAvE;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,OAAOC,KAAP,MAAkB,OAAlB;;AAIA,OAAO,IAAMC,YAAY,gBAAGD,KAAK,CAACE,UAAN,CAAyD,CAACC,KAAD,EAAQC,GAAR,KAAgB;AACjG,MAAMC,KAAK,GAAGN,QAAQ,EAAtB;AACA,SACI;AACI,IAAA,GAAG,eAAEH,GAAF,eACGA,GAAG,CAACS,KAAK,CAACC,UAAN,CAAiBC,IAAlB,s+FADN,wEAMeF,KAAK,CAACG,OAAN,GAAgB,CAN/B,gCAQUH,KAAK,CAACI,OAAN,CAAcC,IAAd,CAAmBC,OAR7B,oCAUqBN,KAAK,CAACI,OAAN,CAAcC,IAAd,CAAmBE,SAVxC,8EAeqBP,KAAK,CAACI,OAAN,CAAcI,UAAd,CAAyBF,OAAzB,CAAiCG,IAftD,sDAkBqBT,KAAK,CAACI,OAAN,CAAcI,UAAd,CAAyBE,KAAzB,CAA+BD,IAlBpD,6BAqBcT,KAAK,CAACI,OAAN,CAAcC,IAAd,CAAmBE,SArBjC,yBAwBcP,KAAK,CAACI,OAAN,CAAcC,IAAd,CAAmBM,QAxBjC,2CA0ByBX,KAAK,CAACI,OAAN,CAAcQ,MAAd,CAAqBC,kBA1B9C,oBA2BqBb,KAAK,CAACI,OAAN,CAAcQ,MAAd,CAAqBD,QA3B1C,qCA8ByBnB,4BA9BzB,oBA+BqBC,wBA/BrB,++FADP;AAmCI,IAAA,GAAG,EAAEM;AAnCT,KAoCQD,KApCR,EADJ;AAwCH,CA1C2B,CAArB","sourcesContent":["import { css } from \"@emotion/react\"\nimport { readonlyFieldBackgroundColor, readonlyFieldBorderColor } from \"../InputBase/InputBase\"\nimport { useTheme } from \"../theme\"\nimport React from \"react\"\n\nexport interface TextareaBaseProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}\n\nexport const TextareaBase = React.forwardRef<HTMLTextAreaElement, TextareaBaseProps>((props, ref) => {\n    const theme = useTheme()\n    return (\n        <textarea\n            css={css`\n                ${css(theme.typography.body)}\n                box-sizing: border-box;\n                display: block;\n                flex: 1;\n                width: 100%;\n                min-height: ${theme.spacing * 6}px;\n                padding: 9px 12px;\n                color: ${theme.palette.text.primary};\n                resize: none;\n                border: 1px solid ${theme.palette.text.secondary};\n                border-radius: 4px;\n                outline: 0px;\n                transition: all 0.3s;\n                &:focus {\n                    border-color: ${theme.palette.intentions.primary.main};\n                }\n                &[data-touched=\"true\"]:invalid {\n                    border-color: ${theme.palette.intentions.error.main};\n                }\n                &::placeholder {\n                    color: ${theme.palette.text.secondary};\n                }\n                &:disabled {\n                    color: ${theme.palette.text.disabled};\n                    cursor: not-allowed;\n                    background-color: ${theme.palette.action.disabledBackground};\n                    border-color: ${theme.palette.action.disabled};\n                }\n                &[readonly] {\n                    background-color: ${readonlyFieldBackgroundColor};\n                    border-color: ${readonlyFieldBorderColor};\n                }\n            `}\n            ref={ref}\n            {...props}\n        />\n    )\n})\n"],"file":"index.js"}