@tamagui/demos 3.0.0-beta.745.1 → 3.0.0-beta.752.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/FieldDemo.cjs +1 -1
- package/dist/cjs/FieldDemo.native.cjs +1 -1
- package/dist/cjs/FieldDemo.native.js +1 -1
- package/dist/cjs/FieldDemo.native.js.map +1 -1
- package/dist/esm/FieldDemo.mjs +1 -1
- package/dist/esm/FieldDemo.mjs.map +1 -1
- package/dist/esm/FieldDemo.native.js +1 -1
- package/dist/esm/FieldDemo.native.js.map +1 -1
- package/package.json +33 -33
- package/src/FieldDemo.tsx +2 -1
package/dist/cjs/FieldDemo.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldDemo.native.js","names":[],"sources":["cjs/FieldDemo.native.js"],"sourcesContent":["\"use strict\";\nvar __create = Object.create;\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __getProtoOf = Object.getPrototypeOf;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n for (var name in all)\n __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n if (from && typeof from === \"object\" || typeof from === \"function\") {\n for (let key of __getOwnPropNames(from))\n if (!__hasOwnProp.call(to, key) && key !== except)\n __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n }\n return to;\n};\nvar __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(\n // If the importer is in node compatibility mode or this is not an ESM\n // file that has been converted to a CommonJS file using a Babel-\n // compatible transform (i.e. \"__esModule\" has not been set), then set\n // \"default\" to the CommonJS \"module.exports\" for node compatibility.\n isNodeMode || !mod || !mod.__esModule ? __defProp(target, \"default\", { value: mod, enumerable: true }) : target,\n mod\n));\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar FieldDemo_exports = {};\n__export(FieldDemo_exports, {\n FieldDemo: () => FieldDemo,\n FieldInput: () => FieldInput\n});\nmodule.exports = __toCommonJS(FieldDemo_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar React = __toESM(require(\"react\"), 1);\nvar import_tamagui = require(\"tamagui\");\nvar DemoField = (0, import_tamagui.styled)(import_tamagui.Field, {\n gap: \"2\"\n});\nvar DemoLabel = (0, import_tamagui.styled)(import_tamagui.Field.Label, {\n color: \"color11\",\n fontWeight: \"500\"\n});\nvar DemoDescription = (0, import_tamagui.styled)(import_tamagui.Field.Description, {\n color: \"color9\",\n fontSize: \"2\"\n});\nvar DemoError = (0, import_tamagui.styled)(import_tamagui.Field.Error, {\n color: \"red10\",\n fontSize: \"2\"\n});\nvar DemoInput = (0, import_tamagui.styled)(import_tamagui.Input, {\n context: import_tamagui.FieldStyledContext,\n variants: {\n valid: {\n true: {}\n },\n invalid: {\n true: {\n borderColor: \"red9\"\n }\n },\n touched: {\n true: {}\n },\n dirty: {\n true: {}\n },\n filled: {\n true: {}\n },\n focused: {\n true: {}\n }\n }\n});\nfunction FieldInput(props) {\n var field = import_tamagui.Field.useFieldControl();\n var controlRef = React.useRef(null);\n var _props_value, _ref;\n var valueRef = React.useRef((_ref = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : props.defaultValue) !== null && _ref !== void 0 ? _ref : \"\");\n React.useEffect(function() {\n return field.registerControl({\n id: field.ariaProps.id,\n controlRef,\n inputRef: controlRef,\n getValue: function() {\n return valueRef.current;\n },\n required: props.required,\n disabled: props.disabled\n });\n }, [\n field.ariaProps.id,\n field.registerControl,\n props.disabled,\n props.required\n ]);\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoInput, {\n ...props,\n ...field.ariaProps,\n ...field.dataProps,\n ref: controlRef,\n name: field.name,\n disabled: field.disabled || props.disabled,\n onFocus: function(event) {\n var _props_onFocus;\n field.onFocus();\n (_props_onFocus = props.onFocus) === null || _props_onFocus === void 0 ? void 0 : _props_onFocus.call(props, event);\n },\n onBlur: function(event) {\n var _props_onBlur;\n field.onBlur(valueRef.current);\n (_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, event);\n },\n onChange: function(event) {\n var _props_onChange;\n valueRef.current = event.target.value;\n field.onChange(event.target.value);\n (_props_onChange = props.onChange) === null || _props_onChange === void 0 ? void 0 : _props_onChange.call(props, event);\n }\n });\n}\nfunction FieldDemo() {\n var [status, setStatus] = React.useState(\"Fill out the form\");\n return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Form, {\n width: 360,\n maxW: \"90%\",\n gap: \"4\",\n p: \"5\",\n borderWidth: 1,\n borderColor: \"border-color\",\n rounded: \"7\",\n bg: \"color2\",\n boxShadow: \"0 2px 3px rgba(0, 0, 0, 0.06), 0 14px 30px rgba(0, 0, 0, 0.10), 0 36px 72px rgba(0, 0, 0, 0.12)\",\n onSubmit: function(values) {\n setStatus(`Welcome, ${String(values.name)}`);\n },\n children: [\n /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(DemoField, {\n name: \"name\",\n children: [\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoLabel, {\n children: \"Name\"\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FieldInput, {\n placeholder: \"Ada Lovelace\",\n required: true\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoDescription, {\n children: \"This is shown on your profile.\"\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoError, {})\n ]\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(DemoField, {\n name: \"email\",\n validationMode: \"onBlur\",\n validate: function(value) {\n return String(value).endsWith(\"@example.com\") ? null : \"Use an @example.com address\";\n },\n children: [\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoLabel, {\n children: \"Email\"\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FieldInput, {\n type: \"email\",\n placeholder: \"ada@example.com\",\n required: true\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoError, {})\n ]\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Form.Trigger, {\n asChild: true,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, {\n self: \"flex-end\",\n height: 40,\n px: \"5\",\n rounded: \"5\",\n bg: \"color11 hover:color10\",\n color: \"color1\",\n fontSize: \"2\",\n fontWeight: \"500\",\n children: \"Create account\"\n })\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {\n color: \"color9\",\n size: \"2\",\n children: status\n })\n ]\n });\n}\n//# sourceMappingURL=FieldDemo.js.map\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"FieldDemo.native.js","names":[],"sources":["cjs/FieldDemo.native.js"],"sourcesContent":["\"use strict\";\nvar __create = Object.create;\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __getProtoOf = Object.getPrototypeOf;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n for (var name in all)\n __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n if (from && typeof from === \"object\" || typeof from === \"function\") {\n for (let key of __getOwnPropNames(from))\n if (!__hasOwnProp.call(to, key) && key !== except)\n __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n }\n return to;\n};\nvar __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(\n // If the importer is in node compatibility mode or this is not an ESM\n // file that has been converted to a CommonJS file using a Babel-\n // compatible transform (i.e. \"__esModule\" has not been set), then set\n // \"default\" to the CommonJS \"module.exports\" for node compatibility.\n isNodeMode || !mod || !mod.__esModule ? __defProp(target, \"default\", { value: mod, enumerable: true }) : target,\n mod\n));\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar FieldDemo_exports = {};\n__export(FieldDemo_exports, {\n FieldDemo: () => FieldDemo,\n FieldInput: () => FieldInput\n});\nmodule.exports = __toCommonJS(FieldDemo_exports);\nvar import_jsx_runtime = require(\"react/jsx-runtime\");\nvar React = __toESM(require(\"react\"), 1);\nvar import_tamagui = require(\"tamagui\");\nvar DemoField = (0, import_tamagui.styled)(import_tamagui.Field, {\n gap: \"2\"\n});\nvar DemoLabel = (0, import_tamagui.styled)(import_tamagui.Field.Label, {\n color: \"color11\",\n fontWeight: \"500\"\n});\nvar DemoDescription = (0, import_tamagui.styled)(import_tamagui.Field.Description, {\n color: \"color9\",\n fontSize: \"2\"\n});\nvar DemoError = (0, import_tamagui.styled)(import_tamagui.Field.Error, {\n color: \"red10\",\n fontSize: \"2\"\n});\nvar DemoInput = (0, import_tamagui.styled)(import_tamagui.Input, {\n context: import_tamagui.FieldStyledContext,\n variants: {\n valid: {\n true: {}\n },\n invalid: {\n true: {\n borderColor: \"red9\"\n }\n },\n touched: {\n true: {}\n },\n dirty: {\n true: {}\n },\n filled: {\n true: {}\n },\n focused: {\n true: {}\n }\n }\n});\nfunction FieldInput(props) {\n var field = import_tamagui.Field.useFieldControl();\n var controlRef = React.useRef(null);\n var _props_value, _ref;\n var valueRef = React.useRef((_ref = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : props.defaultValue) !== null && _ref !== void 0 ? _ref : \"\");\n React.useEffect(function() {\n return field.registerControl({\n id: field.ariaProps.id,\n controlRef,\n inputRef: controlRef,\n getValue: function() {\n return valueRef.current;\n },\n required: props.required,\n // control registration needs one boolean; conditional flat values don't apply\n disabled: props.disabled === true\n });\n }, [\n field.ariaProps.id,\n field.registerControl,\n props.disabled,\n props.required\n ]);\n return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoInput, {\n ...props,\n ...field.ariaProps,\n ...field.dataProps,\n ref: controlRef,\n name: field.name,\n disabled: field.disabled || props.disabled,\n onFocus: function(event) {\n var _props_onFocus;\n field.onFocus();\n (_props_onFocus = props.onFocus) === null || _props_onFocus === void 0 ? void 0 : _props_onFocus.call(props, event);\n },\n onBlur: function(event) {\n var _props_onBlur;\n field.onBlur(valueRef.current);\n (_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, event);\n },\n onChange: function(event) {\n var _props_onChange;\n valueRef.current = event.target.value;\n field.onChange(event.target.value);\n (_props_onChange = props.onChange) === null || _props_onChange === void 0 ? void 0 : _props_onChange.call(props, event);\n }\n });\n}\nfunction FieldDemo() {\n var [status, setStatus] = React.useState(\"Fill out the form\");\n return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Form, {\n width: 360,\n maxW: \"90%\",\n gap: \"4\",\n p: \"5\",\n borderWidth: 1,\n borderColor: \"border-color\",\n rounded: \"7\",\n bg: \"color2\",\n boxShadow: \"0 2px 3px rgba(0, 0, 0, 0.06), 0 14px 30px rgba(0, 0, 0, 0.10), 0 36px 72px rgba(0, 0, 0, 0.12)\",\n onSubmit: function(values) {\n setStatus(`Welcome, ${String(values.name)}`);\n },\n children: [\n /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(DemoField, {\n name: \"name\",\n children: [\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoLabel, {\n children: \"Name\"\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FieldInput, {\n placeholder: \"Ada Lovelace\",\n required: true\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoDescription, {\n children: \"This is shown on your profile.\"\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoError, {})\n ]\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(DemoField, {\n name: \"email\",\n validationMode: \"onBlur\",\n validate: function(value) {\n return String(value).endsWith(\"@example.com\") ? null : \"Use an @example.com address\";\n },\n children: [\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoLabel, {\n children: \"Email\"\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FieldInput, {\n type: \"email\",\n placeholder: \"ada@example.com\",\n required: true\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DemoError, {})\n ]\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Form.Trigger, {\n asChild: true,\n children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, {\n self: \"flex-end\",\n height: 40,\n px: \"5\",\n rounded: \"5\",\n bg: \"color11 hover:color10\",\n color: \"color1\",\n fontSize: \"2\",\n fontWeight: \"500\",\n children: \"Create account\"\n })\n }),\n /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {\n color: \"color9\",\n size: \"2\",\n children: status\n })\n ]\n });\n}\n//# sourceMappingURL=FieldDemo.js.map\n"],"mappings":"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"}
|
package/dist/esm/FieldDemo.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldDemo.js","names":[],"sources":["esm/FieldDemo.js"],"sourcesContent":["import * as React from \"react\";\nimport {\n Button,\n Field,\n FieldStyledContext,\n Form,\n Input,\n Paragraph,\n styled\n} from \"tamagui\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nconst DemoField = styled(Field, {\n gap: \"2\"\n});\nconst DemoLabel = styled(Field.Label, {\n color: \"color11\",\n fontWeight: \"500\"\n});\nconst DemoDescription = styled(Field.Description, {\n color: \"color9\",\n fontSize: \"2\"\n});\nconst DemoError = styled(Field.Error, {\n color: \"red10\",\n fontSize: \"2\"\n});\nconst DemoInput = styled(Input, {\n context: FieldStyledContext,\n variants: {\n valid: {\n true: {}\n },\n invalid: {\n true: {\n borderColor: \"red9\"\n }\n },\n touched: {\n true: {}\n },\n dirty: {\n true: {}\n },\n filled: {\n true: {}\n },\n focused: {\n true: {}\n }\n }\n});\nfunction FieldInput(props) {\n const field = Field.useFieldControl();\n const controlRef = React.useRef(null);\n const valueRef = React.useRef(props.value ?? props.defaultValue ?? \"\");\n React.useEffect(() => {\n return field.registerControl({\n id: field.ariaProps.id,\n controlRef,\n inputRef: controlRef,\n getValue: () => valueRef.current,\n required: props.required,\n disabled: props.disabled\n });\n }, [field.ariaProps.id, field.registerControl, props.disabled, props.required]);\n return /* @__PURE__ */ jsx(\n DemoInput,\n {\n ...props,\n ...field.ariaProps,\n ...field.dataProps,\n ref: controlRef,\n name: field.name,\n disabled: field.disabled || props.disabled,\n onFocus: (event) => {\n field.onFocus();\n props.onFocus?.(event);\n },\n onBlur: (event) => {\n field.onBlur(valueRef.current);\n props.onBlur?.(event);\n },\n onChange: (event) => {\n valueRef.current = event.target.value;\n field.onChange(event.target.value);\n props.onChange?.(event);\n }\n }\n );\n}\nfunction FieldDemo() {\n const [status, setStatus] = React.useState(\"Fill out the form\");\n return /* @__PURE__ */ jsxs(\n Form,\n {\n width: 360,\n maxW: \"90%\",\n gap: \"4\",\n p: \"5\",\n borderWidth: 1,\n borderColor: \"border-color\",\n rounded: \"7\",\n bg: \"color2\",\n boxShadow: \"0 2px 3px rgba(0, 0, 0, 0.06), 0 14px 30px rgba(0, 0, 0, 0.10), 0 36px 72px rgba(0, 0, 0, 0.12)\",\n onSubmit: (values) => {\n setStatus(`Welcome, ${String(values.name)}`);\n },\n children: [\n /* @__PURE__ */ jsxs(DemoField, { name: \"name\", children: [\n /* @__PURE__ */ jsx(DemoLabel, { children: \"Name\" }),\n /* @__PURE__ */ jsx(FieldInput, { placeholder: \"Ada Lovelace\", required: true }),\n /* @__PURE__ */ jsx(DemoDescription, { children: \"This is shown on your profile.\" }),\n /* @__PURE__ */ jsx(DemoError, {})\n ] }),\n /* @__PURE__ */ jsxs(\n DemoField,\n {\n name: \"email\",\n validationMode: \"onBlur\",\n validate: (value) => String(value).endsWith(\"@example.com\") ? null : \"Use an @example.com address\",\n children: [\n /* @__PURE__ */ jsx(DemoLabel, { children: \"Email\" }),\n /* @__PURE__ */ jsx(FieldInput, { type: \"email\", placeholder: \"ada@example.com\", required: true }),\n /* @__PURE__ */ jsx(DemoError, {})\n ]\n }\n ),\n /* @__PURE__ */ jsx(Form.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(\n Button,\n {\n self: \"flex-end\",\n height: 40,\n px: \"5\",\n rounded: \"5\",\n bg: \"color11 hover:color10\",\n color: \"color1\",\n fontSize: \"2\",\n fontWeight: \"500\",\n children: \"Create account\"\n }\n ) }),\n /* @__PURE__ */ jsx(Paragraph, { color: \"color9\", size: \"2\", children: status })\n ]\n }\n );\n}\nexport {\n FieldDemo,\n FieldInput\n};\n//# sourceMappingURL=FieldDemo.js.map\n"],"mappings":";;;;;AAWA,MAAM,YAAY,OAAO,OAAO,EAC9B,KAAK,IACP,CAAC;AACD,MAAM,YAAY,OAAO,MAAM,OAAO;CACpC,OAAO;CACP,YAAY;AACd,CAAC;AACD,MAAM,kBAAkB,OAAO,MAAM,aAAa;CAChD,OAAO;CACP,UAAU;AACZ,CAAC;AACD,MAAM,YAAY,OAAO,MAAM,OAAO;CACpC,OAAO;CACP,UAAU;AACZ,CAAC;AACD,MAAM,YAAY,OAAO,OAAO;CAC9B,SAAS;CACT,UAAU;EACR,OAAO,EACL,MAAM,CAAC,EACT;EACA,SAAS,EACP,MAAM,EACJ,aAAa,OACf,EACF;EACA,SAAS,EACP,MAAM,CAAC,EACT;EACA,OAAO,EACL,MAAM,CAAC,EACT;EACA,QAAQ,EACN,MAAM,CAAC,EACT;EACA,SAAS,EACP,MAAM,CAAC,EACT;CACF;AACF,CAAC;AACD,SAAS,WAAW,OAAO;CACzB,MAAM,QAAQ,MAAM,gBAAgB;CACpC,MAAM,aAAa,MAAM,OAAO,IAAI;CACpC,MAAM,WAAW,MAAM,OAAO,MAAM,SAAS,MAAM,gBAAgB,EAAE;CACrE,MAAM,gBAAgB;EACpB,OAAO,MAAM,gBAAgB;GAC3B,IAAI,MAAM,UAAU;GACpB;GACA,UAAU;GACV,gBAAgB,SAAS;GACzB,UAAU,MAAM;
|
|
1
|
+
{"version":3,"file":"FieldDemo.js","names":[],"sources":["esm/FieldDemo.js"],"sourcesContent":["import * as React from \"react\";\nimport {\n Button,\n Field,\n FieldStyledContext,\n Form,\n Input,\n Paragraph,\n styled\n} from \"tamagui\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nconst DemoField = styled(Field, {\n gap: \"2\"\n});\nconst DemoLabel = styled(Field.Label, {\n color: \"color11\",\n fontWeight: \"500\"\n});\nconst DemoDescription = styled(Field.Description, {\n color: \"color9\",\n fontSize: \"2\"\n});\nconst DemoError = styled(Field.Error, {\n color: \"red10\",\n fontSize: \"2\"\n});\nconst DemoInput = styled(Input, {\n context: FieldStyledContext,\n variants: {\n valid: {\n true: {}\n },\n invalid: {\n true: {\n borderColor: \"red9\"\n }\n },\n touched: {\n true: {}\n },\n dirty: {\n true: {}\n },\n filled: {\n true: {}\n },\n focused: {\n true: {}\n }\n }\n});\nfunction FieldInput(props) {\n const field = Field.useFieldControl();\n const controlRef = React.useRef(null);\n const valueRef = React.useRef(props.value ?? props.defaultValue ?? \"\");\n React.useEffect(() => {\n return field.registerControl({\n id: field.ariaProps.id,\n controlRef,\n inputRef: controlRef,\n getValue: () => valueRef.current,\n required: props.required,\n // control registration needs one boolean; conditional flat values don't apply\n disabled: props.disabled === true\n });\n }, [field.ariaProps.id, field.registerControl, props.disabled, props.required]);\n return /* @__PURE__ */ jsx(\n DemoInput,\n {\n ...props,\n ...field.ariaProps,\n ...field.dataProps,\n ref: controlRef,\n name: field.name,\n disabled: field.disabled || props.disabled,\n onFocus: (event) => {\n field.onFocus();\n props.onFocus?.(event);\n },\n onBlur: (event) => {\n field.onBlur(valueRef.current);\n props.onBlur?.(event);\n },\n onChange: (event) => {\n valueRef.current = event.target.value;\n field.onChange(event.target.value);\n props.onChange?.(event);\n }\n }\n );\n}\nfunction FieldDemo() {\n const [status, setStatus] = React.useState(\"Fill out the form\");\n return /* @__PURE__ */ jsxs(\n Form,\n {\n width: 360,\n maxW: \"90%\",\n gap: \"4\",\n p: \"5\",\n borderWidth: 1,\n borderColor: \"border-color\",\n rounded: \"7\",\n bg: \"color2\",\n boxShadow: \"0 2px 3px rgba(0, 0, 0, 0.06), 0 14px 30px rgba(0, 0, 0, 0.10), 0 36px 72px rgba(0, 0, 0, 0.12)\",\n onSubmit: (values) => {\n setStatus(`Welcome, ${String(values.name)}`);\n },\n children: [\n /* @__PURE__ */ jsxs(DemoField, { name: \"name\", children: [\n /* @__PURE__ */ jsx(DemoLabel, { children: \"Name\" }),\n /* @__PURE__ */ jsx(FieldInput, { placeholder: \"Ada Lovelace\", required: true }),\n /* @__PURE__ */ jsx(DemoDescription, { children: \"This is shown on your profile.\" }),\n /* @__PURE__ */ jsx(DemoError, {})\n ] }),\n /* @__PURE__ */ jsxs(\n DemoField,\n {\n name: \"email\",\n validationMode: \"onBlur\",\n validate: (value) => String(value).endsWith(\"@example.com\") ? null : \"Use an @example.com address\",\n children: [\n /* @__PURE__ */ jsx(DemoLabel, { children: \"Email\" }),\n /* @__PURE__ */ jsx(FieldInput, { type: \"email\", placeholder: \"ada@example.com\", required: true }),\n /* @__PURE__ */ jsx(DemoError, {})\n ]\n }\n ),\n /* @__PURE__ */ jsx(Form.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(\n Button,\n {\n self: \"flex-end\",\n height: 40,\n px: \"5\",\n rounded: \"5\",\n bg: \"color11 hover:color10\",\n color: \"color1\",\n fontSize: \"2\",\n fontWeight: \"500\",\n children: \"Create account\"\n }\n ) }),\n /* @__PURE__ */ jsx(Paragraph, { color: \"color9\", size: \"2\", children: status })\n ]\n }\n );\n}\nexport {\n FieldDemo,\n FieldInput\n};\n//# sourceMappingURL=FieldDemo.js.map\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldDemo.native.js","names":[],"sources":["esm/FieldDemo.native.js"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport * as React from \"react\";\nimport { Button, Field, FieldStyledContext, Form, Input, Paragraph, styled } from \"tamagui\";\nvar DemoField = styled(Field, {\n gap: \"2\"\n});\nvar DemoLabel = styled(Field.Label, {\n color: \"color11\",\n fontWeight: \"500\"\n});\nvar DemoDescription = styled(Field.Description, {\n color: \"color9\",\n fontSize: \"2\"\n});\nvar DemoError = styled(Field.Error, {\n color: \"red10\",\n fontSize: \"2\"\n});\nvar DemoInput = styled(Input, {\n context: FieldStyledContext,\n variants: {\n valid: {\n true: {}\n },\n invalid: {\n true: {\n borderColor: \"red9\"\n }\n },\n touched: {\n true: {}\n },\n dirty: {\n true: {}\n },\n filled: {\n true: {}\n },\n focused: {\n true: {}\n }\n }\n});\nfunction FieldInput(props) {\n var field = Field.useFieldControl();\n var controlRef = React.useRef(null);\n var _props_value, _ref;\n var valueRef = React.useRef((_ref = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : props.defaultValue) !== null && _ref !== void 0 ? _ref : \"\");\n React.useEffect(function() {\n return field.registerControl({\n id: field.ariaProps.id,\n controlRef,\n inputRef: controlRef,\n getValue: function() {\n return valueRef.current;\n },\n required: props.required,\n disabled: props.disabled\n });\n }, [\n field.ariaProps.id,\n field.registerControl,\n props.disabled,\n props.required\n ]);\n return /* @__PURE__ */ _jsx(DemoInput, {\n ...props,\n ...field.ariaProps,\n ...field.dataProps,\n ref: controlRef,\n name: field.name,\n disabled: field.disabled || props.disabled,\n onFocus: function(event) {\n var _props_onFocus;\n field.onFocus();\n (_props_onFocus = props.onFocus) === null || _props_onFocus === void 0 ? void 0 : _props_onFocus.call(props, event);\n },\n onBlur: function(event) {\n var _props_onBlur;\n field.onBlur(valueRef.current);\n (_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, event);\n },\n onChange: function(event) {\n var _props_onChange;\n valueRef.current = event.target.value;\n field.onChange(event.target.value);\n (_props_onChange = props.onChange) === null || _props_onChange === void 0 ? void 0 : _props_onChange.call(props, event);\n }\n });\n}\nfunction FieldDemo() {\n var [status, setStatus] = React.useState(\"Fill out the form\");\n return /* @__PURE__ */ _jsxs(Form, {\n width: 360,\n maxW: \"90%\",\n gap: \"4\",\n p: \"5\",\n borderWidth: 1,\n borderColor: \"border-color\",\n rounded: \"7\",\n bg: \"color2\",\n boxShadow: \"0 2px 3px rgba(0, 0, 0, 0.06), 0 14px 30px rgba(0, 0, 0, 0.10), 0 36px 72px rgba(0, 0, 0, 0.12)\",\n onSubmit: function(values) {\n setStatus(`Welcome, ${String(values.name)}`);\n },\n children: [\n /* @__PURE__ */ _jsxs(DemoField, {\n name: \"name\",\n children: [\n /* @__PURE__ */ _jsx(DemoLabel, {\n children: \"Name\"\n }),\n /* @__PURE__ */ _jsx(FieldInput, {\n placeholder: \"Ada Lovelace\",\n required: true\n }),\n /* @__PURE__ */ _jsx(DemoDescription, {\n children: \"This is shown on your profile.\"\n }),\n /* @__PURE__ */ _jsx(DemoError, {})\n ]\n }),\n /* @__PURE__ */ _jsxs(DemoField, {\n name: \"email\",\n validationMode: \"onBlur\",\n validate: function(value) {\n return String(value).endsWith(\"@example.com\") ? null : \"Use an @example.com address\";\n },\n children: [\n /* @__PURE__ */ _jsx(DemoLabel, {\n children: \"Email\"\n }),\n /* @__PURE__ */ _jsx(FieldInput, {\n type: \"email\",\n placeholder: \"ada@example.com\",\n required: true\n }),\n /* @__PURE__ */ _jsx(DemoError, {})\n ]\n }),\n /* @__PURE__ */ _jsx(Form.Trigger, {\n asChild: true,\n children: /* @__PURE__ */ _jsx(Button, {\n self: \"flex-end\",\n height: 40,\n px: \"5\",\n rounded: \"5\",\n bg: \"color11 hover:color10\",\n color: \"color1\",\n fontSize: \"2\",\n fontWeight: \"500\",\n children: \"Create account\"\n })\n }),\n /* @__PURE__ */ _jsx(Paragraph, {\n color: \"color9\",\n size: \"2\",\n children: status\n })\n ]\n });\n}\nexport {\n FieldDemo,\n FieldInput\n};\n//# sourceMappingURL=FieldDemo.js.map\n"],"mappings":";;;;;AAGA,IAAI,YAAY,OAAO,OAAO,EAC5B,KAAK,IACP,CAAC;AACD,IAAI,YAAY,OAAO,MAAM,OAAO;CAClC,OAAO;CACP,YAAY;AACd,CAAC;AACD,IAAI,kBAAkB,OAAO,MAAM,aAAa;CAC9C,OAAO;CACP,UAAU;AACZ,CAAC;AACD,IAAI,YAAY,OAAO,MAAM,OAAO;CAClC,OAAO;CACP,UAAU;AACZ,CAAC;AACD,IAAI,YAAY,OAAO,OAAO;CAC5B,SAAS;CACT,UAAU;EACR,OAAO,EACL,MAAM,CAAC,EACT;EACA,SAAS,EACP,MAAM,EACJ,aAAa,OACf,EACF;EACA,SAAS,EACP,MAAM,CAAC,EACT;EACA,OAAO,EACL,MAAM,CAAC,EACT;EACA,QAAQ,EACN,MAAM,CAAC,EACT;EACA,SAAS,EACP,MAAM,CAAC,EACT;CACF;AACF,CAAC;AACD,SAAS,WAAW,OAAO;CACzB,IAAI,QAAQ,MAAM,gBAAgB;CAClC,IAAI,aAAa,MAAM,OAAO,IAAI;CAClC,IAAI,cAAc;CAClB,IAAI,WAAW,MAAM,QAAQ,QAAQ,eAAe,MAAM,WAAW,QAAQ,iBAAiB,KAAK,IAAI,eAAe,MAAM,kBAAkB,QAAQ,SAAS,KAAK,IAAI,OAAO,EAAE;CACjL,MAAM,UAAU,WAAW;EACzB,OAAO,MAAM,gBAAgB;GAC3B,IAAI,MAAM,UAAU;GACpB;GACA,UAAU;GACV,UAAU,WAAW;IACnB,OAAO,SAAS;GAClB;GACA,UAAU,MAAM;
|
|
1
|
+
{"version":3,"file":"FieldDemo.native.js","names":[],"sources":["esm/FieldDemo.native.js"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport * as React from \"react\";\nimport { Button, Field, FieldStyledContext, Form, Input, Paragraph, styled } from \"tamagui\";\nvar DemoField = styled(Field, {\n gap: \"2\"\n});\nvar DemoLabel = styled(Field.Label, {\n color: \"color11\",\n fontWeight: \"500\"\n});\nvar DemoDescription = styled(Field.Description, {\n color: \"color9\",\n fontSize: \"2\"\n});\nvar DemoError = styled(Field.Error, {\n color: \"red10\",\n fontSize: \"2\"\n});\nvar DemoInput = styled(Input, {\n context: FieldStyledContext,\n variants: {\n valid: {\n true: {}\n },\n invalid: {\n true: {\n borderColor: \"red9\"\n }\n },\n touched: {\n true: {}\n },\n dirty: {\n true: {}\n },\n filled: {\n true: {}\n },\n focused: {\n true: {}\n }\n }\n});\nfunction FieldInput(props) {\n var field = Field.useFieldControl();\n var controlRef = React.useRef(null);\n var _props_value, _ref;\n var valueRef = React.useRef((_ref = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : props.defaultValue) !== null && _ref !== void 0 ? _ref : \"\");\n React.useEffect(function() {\n return field.registerControl({\n id: field.ariaProps.id,\n controlRef,\n inputRef: controlRef,\n getValue: function() {\n return valueRef.current;\n },\n required: props.required,\n // control registration needs one boolean; conditional flat values don't apply\n disabled: props.disabled === true\n });\n }, [\n field.ariaProps.id,\n field.registerControl,\n props.disabled,\n props.required\n ]);\n return /* @__PURE__ */ _jsx(DemoInput, {\n ...props,\n ...field.ariaProps,\n ...field.dataProps,\n ref: controlRef,\n name: field.name,\n disabled: field.disabled || props.disabled,\n onFocus: function(event) {\n var _props_onFocus;\n field.onFocus();\n (_props_onFocus = props.onFocus) === null || _props_onFocus === void 0 ? void 0 : _props_onFocus.call(props, event);\n },\n onBlur: function(event) {\n var _props_onBlur;\n field.onBlur(valueRef.current);\n (_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, event);\n },\n onChange: function(event) {\n var _props_onChange;\n valueRef.current = event.target.value;\n field.onChange(event.target.value);\n (_props_onChange = props.onChange) === null || _props_onChange === void 0 ? void 0 : _props_onChange.call(props, event);\n }\n });\n}\nfunction FieldDemo() {\n var [status, setStatus] = React.useState(\"Fill out the form\");\n return /* @__PURE__ */ _jsxs(Form, {\n width: 360,\n maxW: \"90%\",\n gap: \"4\",\n p: \"5\",\n borderWidth: 1,\n borderColor: \"border-color\",\n rounded: \"7\",\n bg: \"color2\",\n boxShadow: \"0 2px 3px rgba(0, 0, 0, 0.06), 0 14px 30px rgba(0, 0, 0, 0.10), 0 36px 72px rgba(0, 0, 0, 0.12)\",\n onSubmit: function(values) {\n setStatus(`Welcome, ${String(values.name)}`);\n },\n children: [\n /* @__PURE__ */ _jsxs(DemoField, {\n name: \"name\",\n children: [\n /* @__PURE__ */ _jsx(DemoLabel, {\n children: \"Name\"\n }),\n /* @__PURE__ */ _jsx(FieldInput, {\n placeholder: \"Ada Lovelace\",\n required: true\n }),\n /* @__PURE__ */ _jsx(DemoDescription, {\n children: \"This is shown on your profile.\"\n }),\n /* @__PURE__ */ _jsx(DemoError, {})\n ]\n }),\n /* @__PURE__ */ _jsxs(DemoField, {\n name: \"email\",\n validationMode: \"onBlur\",\n validate: function(value) {\n return String(value).endsWith(\"@example.com\") ? null : \"Use an @example.com address\";\n },\n children: [\n /* @__PURE__ */ _jsx(DemoLabel, {\n children: \"Email\"\n }),\n /* @__PURE__ */ _jsx(FieldInput, {\n type: \"email\",\n placeholder: \"ada@example.com\",\n required: true\n }),\n /* @__PURE__ */ _jsx(DemoError, {})\n ]\n }),\n /* @__PURE__ */ _jsx(Form.Trigger, {\n asChild: true,\n children: /* @__PURE__ */ _jsx(Button, {\n self: \"flex-end\",\n height: 40,\n px: \"5\",\n rounded: \"5\",\n bg: \"color11 hover:color10\",\n color: \"color1\",\n fontSize: \"2\",\n fontWeight: \"500\",\n children: \"Create account\"\n })\n }),\n /* @__PURE__ */ _jsx(Paragraph, {\n color: \"color9\",\n size: \"2\",\n children: status\n })\n ]\n });\n}\nexport {\n FieldDemo,\n FieldInput\n};\n//# sourceMappingURL=FieldDemo.js.map\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/demos",
|
|
3
|
-
"version": "3.0.0-beta.
|
|
3
|
+
"version": "3.0.0-beta.752.1",
|
|
4
4
|
"source": "demos/src/index.tsx",
|
|
5
5
|
"files": [
|
|
6
6
|
"src",
|
|
@@ -46,40 +46,40 @@
|
|
|
46
46
|
"clean:build": "tamagui-build clean:build"
|
|
47
47
|
},
|
|
48
48
|
"dependencies": {
|
|
49
|
-
"@tamagui/animate-presence": "3.0.0-beta.
|
|
50
|
-
"@tamagui/avatar": "3.0.0-beta.
|
|
51
|
-
"@tamagui/button": "3.0.0-beta.
|
|
52
|
-
"@tamagui/checkbox": "3.0.0-beta.
|
|
53
|
-
"@tamagui/checkbox-headless": "3.0.0-beta.
|
|
54
|
-
"@tamagui/colors": "3.0.0-beta.
|
|
55
|
-
"@tamagui/context-menu": "3.0.0-beta.
|
|
56
|
-
"@tamagui/core": "3.0.0-beta.
|
|
57
|
-
"@tamagui/image": "3.0.0-beta.
|
|
58
|
-
"@tamagui/input": "3.0.0-beta.
|
|
59
|
-
"@tamagui/linear-gradient": "3.0.0-beta.
|
|
60
|
-
"@tamagui/list-item": "3.0.0-beta.
|
|
61
|
-
"@tamagui/logo": "3.0.0-beta.
|
|
62
|
-
"@tamagui/lucide-icons-2": "3.0.0-beta.
|
|
63
|
-
"@tamagui/menu": "3.0.0-beta.
|
|
64
|
-
"@tamagui/popover": "3.0.0-beta.
|
|
65
|
-
"@tamagui/progress": "3.0.0-beta.
|
|
66
|
-
"@tamagui/radio-group": "3.0.0-beta.
|
|
67
|
-
"@tamagui/radio-headless": "3.0.0-beta.
|
|
68
|
-
"@tamagui/roving-focus": "3.0.0-beta.
|
|
69
|
-
"@tamagui/select": "3.0.0-beta.
|
|
70
|
-
"@tamagui/sheet": "3.0.0-beta.
|
|
71
|
-
"@tamagui/slider": "3.0.0-beta.
|
|
72
|
-
"@tamagui/stacks": "3.0.0-beta.
|
|
73
|
-
"@tamagui/switch": "3.0.0-beta.
|
|
74
|
-
"@tamagui/switch-headless": "3.0.0-beta.
|
|
75
|
-
"@tamagui/tabs": "3.0.0-beta.
|
|
76
|
-
"@tamagui/tamagui-dev-config": "3.0.0-beta.
|
|
77
|
-
"@tamagui/theme": "3.0.0-beta.
|
|
78
|
-
"@tamagui/toast": "3.0.0-beta.
|
|
79
|
-
"tamagui": "3.0.0-beta.
|
|
49
|
+
"@tamagui/animate-presence": "3.0.0-beta.752.1",
|
|
50
|
+
"@tamagui/avatar": "3.0.0-beta.752.1",
|
|
51
|
+
"@tamagui/button": "3.0.0-beta.752.1",
|
|
52
|
+
"@tamagui/checkbox": "3.0.0-beta.752.1",
|
|
53
|
+
"@tamagui/checkbox-headless": "3.0.0-beta.752.1",
|
|
54
|
+
"@tamagui/colors": "3.0.0-beta.752.1",
|
|
55
|
+
"@tamagui/context-menu": "3.0.0-beta.752.1",
|
|
56
|
+
"@tamagui/core": "3.0.0-beta.752.1",
|
|
57
|
+
"@tamagui/image": "3.0.0-beta.752.1",
|
|
58
|
+
"@tamagui/input": "3.0.0-beta.752.1",
|
|
59
|
+
"@tamagui/linear-gradient": "3.0.0-beta.752.1",
|
|
60
|
+
"@tamagui/list-item": "3.0.0-beta.752.1",
|
|
61
|
+
"@tamagui/logo": "3.0.0-beta.752.1",
|
|
62
|
+
"@tamagui/lucide-icons-2": "3.0.0-beta.752.1",
|
|
63
|
+
"@tamagui/menu": "3.0.0-beta.752.1",
|
|
64
|
+
"@tamagui/popover": "3.0.0-beta.752.1",
|
|
65
|
+
"@tamagui/progress": "3.0.0-beta.752.1",
|
|
66
|
+
"@tamagui/radio-group": "3.0.0-beta.752.1",
|
|
67
|
+
"@tamagui/radio-headless": "3.0.0-beta.752.1",
|
|
68
|
+
"@tamagui/roving-focus": "3.0.0-beta.752.1",
|
|
69
|
+
"@tamagui/select": "3.0.0-beta.752.1",
|
|
70
|
+
"@tamagui/sheet": "3.0.0-beta.752.1",
|
|
71
|
+
"@tamagui/slider": "3.0.0-beta.752.1",
|
|
72
|
+
"@tamagui/stacks": "3.0.0-beta.752.1",
|
|
73
|
+
"@tamagui/switch": "3.0.0-beta.752.1",
|
|
74
|
+
"@tamagui/switch-headless": "3.0.0-beta.752.1",
|
|
75
|
+
"@tamagui/tabs": "3.0.0-beta.752.1",
|
|
76
|
+
"@tamagui/tamagui-dev-config": "3.0.0-beta.752.1",
|
|
77
|
+
"@tamagui/theme": "3.0.0-beta.752.1",
|
|
78
|
+
"@tamagui/toast": "3.0.0-beta.752.1",
|
|
79
|
+
"tamagui": "3.0.0-beta.752.1"
|
|
80
80
|
},
|
|
81
81
|
"devDependencies": {
|
|
82
|
-
"@tamagui/build": "3.0.0-beta.
|
|
82
|
+
"@tamagui/build": "3.0.0-beta.752.1",
|
|
83
83
|
"react": "19.2.3",
|
|
84
84
|
"react-native": "0.86.2"
|
|
85
85
|
},
|
package/src/FieldDemo.tsx
CHANGED
|
@@ -68,7 +68,8 @@ export function FieldInput(props: React.ComponentProps<typeof DemoInput>) {
|
|
|
68
68
|
inputRef: controlRef,
|
|
69
69
|
getValue: () => valueRef.current,
|
|
70
70
|
required: props.required,
|
|
71
|
-
|
|
71
|
+
// control registration needs one boolean; conditional flat values don't apply
|
|
72
|
+
disabled: props.disabled === true,
|
|
72
73
|
})
|
|
73
74
|
}, [field.ariaProps.id, field.registerControl, props.disabled, props.required])
|
|
74
75
|
|