@tinacms/react-forms - npm Package Compare versions

Comparing version 0.1.6 to 0.1.7-alpha.0

build/index.js

@@ -1,1 +0,1 @@
-!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("styled-components"),require("@tinacms/icons"),require("react-dismissible"),require("react-dom"),require("@tinacms/form-builder"),require("@tinacms/styles"),require("react-beautiful-dnd"),require("@tinacms/react-modals"),require("@tinacms/react-core")):"function"==typeof define&&define.amd?define(["exports","react","styled-components","@tinacms/icons","react-dismissible","react-dom","@tinacms/form-builder","@tinacms/styles","react-beautiful-dnd","@tinacms/react-modals","@tinacms/react-core"],e):e((n=n||self)["@tinacms/react-forms"]={},n.React,n.styled,n.icons,n.reactDismissible,n.reactDom,n.formBuilder,n.styles,n.reactBeautifulDnd,n.reactModals,n.reactCore)}(this,function(n,c,i,e,a,o,d,u,p,r,t){"use strict";var l="default"in i?i.default:i,s=function(){return(s=Object.assign||function(n){for(var e,t=1,i=arguments.length;t<i;t++)for(var r in e=arguments[t])Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}).apply(this,arguments)};function m(o,a,l,s){return new(l=l||Promise)(function(n,e){function t(n){try{r(s.next(n))}catch(n){e(n)}}function i(n){try{r(s.throw(n))}catch(n){e(n)}}function r(e){e.done?n(e.value):new l(function(n){n(e.value)}).then(t,i)}r((s=s.apply(o,a||[])).next())})}function f(t,i){var r,o,a,n,l={label:0,sent:function(){if(1&a[0])throw a[1];return a[1]},trys:[],ops:[]};return n={next:e(0),throw:e(1),return:e(2)},"function"==typeof Symbol&&(n[Symbol.iterator]=function(){return this}),n;function e(e){return function(n){return function(e){if(r)throw new TypeError("Generator is already executing.");for(;l;)try{if(r=1,o&&(a=2&e[0]?o.return:e[0]?o.throw||((a=o.return)&&a.call(o),0):o.next)&&!(a=a.call(o,e[1])).done)return a;switch(o=0,a&&(e=[2&e[0],a.value]),e[0]){case 0:case 1:a=e;break;case 4:return l.label++,{value:e[1],done:!1};case 5:l.label++,o=e[1],e=[0];continue;case 7:e=l.ops.pop(),l.trys.pop();continue;default:if(!(a=0<(a=l.trys).length&&a[a.length-1])&&(6===e[0]||2===e[0])){l=0;continue}if(3===e[0]&&(!a||e[1]>a[0]&&e[1]<a[3])){l.label=e[1];break}if(6===e[0]&&l.label<a[1]){l.label=a[1],a=e;break}if(a&&l.label<a[2]){l.label=a[2],l.ops.push(e);break}a[2]&&l.ops.pop(),l.trys.pop();continue}e=i.call(t,l)}catch(n){e=[6,n],o=0}finally{r=a=0}if(5&e[0])throw e[1];return{value:e[0]?e[1]:void 0,done:!0}}([e,n])}}}function g(n,e){return Object.defineProperty?Object.defineProperty(n,"raw",{value:e}):n.raw=e,n}function h(n){var e=n.actions,t=n.form,i=c.useState(!1),r=i[0],o=i[1];return c.createElement(c.Fragment,null,c.createElement(w,{onClick:function(){return o(function(n){return!n})}}),c.createElement(k,{open:r},c.createElement(a.Dismissible,{click:!0,escape:!0,disabled:!r,onDismiss:function(){o(function(n){return!n})}},e.map(function(n,e){return c.createElement(n,{form:t,key:e})}))))}var b,v,y,x,w=l(function(n){return c.createElement("button",s({},n),c.createElement(e.EllipsisVerticalIcon,null))}).withConfig({displayName:"MoreActionsButton",componentId:"sc-1atgntc"})(b=b||g(["\n  height: 64px;\n  width: 40px;\n  align-self: stretch;\n  background-color: transparent;\n  background-position: center;\n  background-size: auto 18px;\n  background-repeat: no-repeat;\n  border: 0;\n  margin: 0 -16px 0 8px;\n  outline: none;\n  cursor: pointer;\n  transition: opacity 85ms ease-out;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  &:hover {\n    background-color: var(--tina-color-grey-1);\n    fill: var(--tina-color-grey-8);\n  }\n"],["\n  height: 64px;\n  width: 40px;\n  align-self: stretch;\n  background-color: transparent;\n  background-position: center;\n  background-size: auto 18px;\n  background-repeat: no-repeat;\n  border: 0;\n  margin: 0 -16px 0 8px;\n  outline: none;\n  cursor: pointer;\n  transition: opacity 85ms ease-out;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  &:hover {\n    background-color: var(--tina-color-grey-1);\n    fill: var(--tina-color-grey-8);\n  }\n"])),k=l.div.withConfig({displayName:"ActionsOverlay",componentId:"sc-15j8abz"})(y=y||g(["\n  min-width: 192px;\n  border-radius: var(--tina-radius-big);\n  border: 1px solid #efefef;\n  display: block;\n  position: absolute;\n  bottom: var(--tina-padding-big);\n  right: var(--tina-padding-big);\n  transform: translate3d(0, 0, 0) scale3d(0.5, 0.5, 1);\n  opacity: 0;\n  pointer-events: none;\n  transition: all 85ms ease-out;\n  transform-origin: 100% 100%;\n  box-shadow: var(--tina-shadow-big);\n  background-color: white;\n  overflow: hidden;\n  z-index: var(--tina-z-index-1);\n  ",";\n"],["\n  min-width: 192px;\n  border-radius: var(--tina-radius-big);\n  border: 1px solid #efefef;\n  display: block;\n  position: absolute;\n  bottom: var(--tina-padding-big);\n  right: var(--tina-padding-big);\n  transform: translate3d(0, 0, 0) scale3d(0.5, 0.5, 1);\n  opacity: 0;\n  pointer-events: none;\n  transition: all 85ms ease-out;\n  transform-origin: 100% 100%;\n  box-shadow: var(--tina-shadow-big);\n  background-color: white;\n  overflow: hidden;\n  z-index: var(--tina-z-index-1);\n  ",";\n"]),function(n){return n.open&&i.css(v=v||g(["\n      opacity: 1;\n      pointer-events: all;\n      transform: translate3d(0, -28px, 0) scale3d(1, 1, 1);\n    "],["\n      opacity: 1;\n      pointer-events: all;\n      transform: translate3d(0, -28px, 0) scale3d(1, 1, 1);\n    "]))}),E=l.button.withConfig({displayName:"ActionButton",componentId:"sc-aiskpq"})(x=x||g(["\n  position: relative;\n  text-align: center;\n  font-size: var(--tina-font-size-0);\n  padding: 0 12px;\n  height: 40px;\n  font-weight: 500;\n  width: 100%;\n  background: none;\n  cursor: pointer;\n  outline: none;\n  border: 0;\n  transition: all 85ms ease-out;\n  &:hover {\n    color: var(--tina-color-primary);\n    background-color: var(--tina-color-grey-1);\n  }\n  &:not(:last-child) {\n    border-bottom: 1px solid #efefef;\n  }\n"],["\n  position: relative;\n  text-align: center;\n  font-size: var(--tina-font-size-0);\n  padding: 0 12px;\n  height: 40px;\n  font-weight: 500;\n  width: 100%;\n  background: none;\n  cursor: pointer;\n  outline: none;\n  border: 0;\n  transition: all 85ms ease-out;\n  &:hover {\n    color: var(--tina-color-primary);\n    background-color: var(--tina-color-grey-1);\n  }\n  &:not(:last-child) {\n    border-bottom: 1px solid #efefef;\n  }\n"])),z=c.createContext(function(){return null});function C(n){var e=n.dotSize,t=void 0===e?8:e,i=n.color,r=void 0===i?"white":i;return c.createElement("div",null,c.createElement(q,{dotSize:t,color:r}),c.createElement(q,{dotSize:t,color:r}),c.createElement(q,{dotSize:t,color:r}))}function B(n){var e=n.pristine,t=n.reset,i=n.children,r=c.useState(!1),o=r[0],a=r[1];return c.createElement(c.Fragment,null,c.createElement(M,{onClick:function(){a(function(n){return!n})},disabled:e},i),o&&c.createElement(D,{reset:t,close:function(){return a(!1)}}))}var j,S,F,O,P,I=l(function(n){var e=n.children,t=function(n,e){var t={};for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&e.indexOf(i)<0&&(t[i]=n[i]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(i=Object.getOwnPropertySymbols(n);r<i.length;r++)e.indexOf(i[r])<0&&Object.prototype.propertyIsEnumerable.call(n,i[r])&&(t[i[r]]=n[i[r]])}return t}(n,["children"]),i=c.useRef(null),r=c.useCallback(function(n){return i.current?o.createPortal(n.children,i.current):null},[i.current]);return c.createElement(z.Provider,{value:r},c.createElement("div",s({ref:i},t),e))}).withConfig({displayName:"FormPortalProvider",componentId:"sc-1bn9axm"})(j=j||g(["\n  height: 100%;\n  scrollbar-width: none;\n"],["\n  height: 100%;\n  scrollbar-width: none;\n"])),N=i.keyframes(S=S||g(["\n  0% { transform: scale(0.1); }\n  50% { transform: scale(1); }\n  90% { transform: scale(0.1); }\n  100% { transform: scale(0.1); }\n"],["\n  0% { transform: scale(0.1); }\n  50% { transform: scale(1); }\n  90% { transform: scale(0.1); }\n  100% { transform: scale(0.1); }\n"])),q=l.span.withConfig({displayName:"SingleDot",componentId:"sc-67w58h"})(O=O||g(["\n  animation: "," 2s linear infinite;\n  display: inline-block;\n  margin-right: 4px;\n  :nth-child(2) {\n    animation-delay: 0.3s;\n  }\n  :nth-child(3) {\n    animation-delay: 0.5s;\n  }\n  ","\n"],["\n  animation: "," 2s linear infinite;\n  display: inline-block;\n  margin-right: 4px;\n  :nth-child(2) {\n    animation-delay: 0.3s;\n  }\n  :nth-child(3) {\n    animation-delay: 0.5s;\n  }\n  ","\n"]),N,function(n){var e=n.color,t=n.dotSize;return i.css(F=F||g(["\n      background: ",";\n      width: ","px;\n      height: ","px;\n      border-radius: ","px;\n    "],["\n      background: ",";\n      width: ","px;\n      height: ","px;\n      border-radius: ","px;\n    "]),e,t,t,t)}),D=function(n){var e=n.close,t=n.reset;return c.createElement(r.Modal,null,c.createElement(r.ModalPopup,null,c.createElement(r.ModalHeader,{close:e},"Reset"),c.createElement(r.ModalBody,{padded:!0},c.createElement("p",null,"Are you sure you want to reset all changes?")),c.createElement(r.ModalActions,null,c.createElement(u.Button,{onClick:e},"Cancel"),c.createElement(u.Button,{margin:!0,primary:!0,onClick:function(){return m(void 0,void 0,void 0,function(){return f(this,function(n){switch(n.label){case 0:return[4,t()];case 1:return n.sent(),e(),[2]}})})}},"Reset"))))},M=l(u.Button).withConfig({displayName:"ResetButton",componentId:"sc-1epa276"})(P=P||g(["\n  flex: 0 0 96px;\n"],["\n  flex: 0 0 96px;\n"]));function A(){return c.createElement(Q,null,c.createElement(J,null,"🤔"),c.createElement("h3",null,"Hey, you don't have any fields added to this form."),c.createElement("p",null,c.createElement(U,{href:"https://tinacms.org/docs/fields",target:"_blank"},c.createElement(J,null,"📖")," Field Setup Guide")))}var R,_,G,H,L,V,W,T,J=l.span.withConfig({displayName:"Emoji",componentId:"sc-1ywomn6"})(R=R||g(["\n  font-size: 40px;\n  line-height: 1;\n  display: inline-block;\n"],["\n  font-size: 40px;\n  line-height: 1;\n  display: inline-block;\n"])),K=i.keyframes(_=_||g(["\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n"],["\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n"])),Q=l.div.withConfig({displayName:"EmptyState",componentId:"sc-1oxdh5z"})(G=G||g(["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  padding: var(--tina-padding-big) var(--tina-padding-big) 64px\n    var(--tina-padding-big);\n  width: 100%;\n  height: 100%;\n  overflow-y: auto;\n  animation-name: ",";\n  animation-delay: 300ms;\n  animation-timing-function: ease-out;\n  animation-iteration-count: 1;\n  animation-fill-mode: both;\n  animation-duration: 150ms;\n  > *:first-child {\n    margin: 0 0 var(--tina-padding-big) 0;\n  }\n  > "," {\n    display: block;\n  }\n  h3 {\n    font-size: var(--tina-font-size-5);\n    font-weight: normal;\n    color: inherit;\n    display: block;\n    margin: 0 0 var(--tina-padding-big) 0;\n    "," {\n      font-size: 1em;\n    }\n  }\n  p {\n    display: block;\n    margin: 0 0 var(--tina-padding-big) 0;\n  }\n"],["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  padding: var(--tina-padding-big) var(--tina-padding-big) 64px\n    var(--tina-padding-big);\n  width: 100%;\n  height: 100%;\n  overflow-y: auto;\n  animation-name: ",";\n  animation-delay: 300ms;\n  animation-timing-function: ease-out;\n  animation-iteration-count: 1;\n  animation-fill-mode: both;\n  animation-duration: 150ms;\n  > *:first-child {\n    margin: 0 0 var(--tina-padding-big) 0;\n  }\n  > "," {\n    display: block;\n  }\n  h3 {\n    font-size: var(--tina-font-size-5);\n    font-weight: normal;\n    color: inherit;\n    display: block;\n    margin: 0 0 var(--tina-padding-big) 0;\n    "," {\n      font-size: 1em;\n    }\n  }\n  p {\n    display: block;\n    margin: 0 0 var(--tina-padding-big) 0;\n  }\n"]),K,J,J),U=l.a.withConfig({displayName:"LinkButton",componentId:"sc-i30s9h"})(H=H||g(["\n  text-align: center;\n  border: 0;\n  border-radius: var(--tina-radius-big);\n  border: 1px solid var(--tina-color-grey-2);\n  box-shadow: var(--tina-shadow-small);\n  font-weight: 500;\n  cursor: pointer;\n  font-size: var(--tina-font-size-0);\n  transition: all var(--tina-timing-short) ease-out;\n  background-color: white;\n  color: var(--tina-color-grey-8);\n  padding: var(--tina-padding-small) var(--tina-padding-big)\n    var(--tina-padding-small) 56px;\n  position: relative;\n  text-decoration: none;\n  display: inline-block;\n  "," {\n    font-size: 24px;\n    position: absolute;\n    left: var(--tina-padding-big);\n    top: 50%;\n    transform-origin: 50% 50%;\n    transform: translate3d(0, -50%, 0);\n    transition: all var(--tina-timing-short) ease-out;\n  }\n  &:hover {\n    color: var(--tina-color-primary);\n    "," {\n      transform: translate3d(0, -50%, 0);\n    }\n  }\n"],["\n  text-align: center;\n  border: 0;\n  border-radius: var(--tina-radius-big);\n  border: 1px solid var(--tina-color-grey-2);\n  box-shadow: var(--tina-shadow-small);\n  font-weight: 500;\n  cursor: pointer;\n  font-size: var(--tina-font-size-0);\n  transition: all var(--tina-timing-short) ease-out;\n  background-color: white;\n  color: var(--tina-color-grey-8);\n  padding: var(--tina-padding-small) var(--tina-padding-big)\n    var(--tina-padding-small) 56px;\n  position: relative;\n  text-decoration: none;\n  display: inline-block;\n  "," {\n    font-size: 24px;\n    position: absolute;\n    left: var(--tina-padding-big);\n    top: 50%;\n    transform-origin: 50% 50%;\n    transform: translate3d(0, -50%, 0);\n    transition: all var(--tina-timing-short) ease-out;\n  }\n  &:hover {\n    color: var(--tina-color-primary);\n    "," {\n      transform: translate3d(0, -50%, 0);\n    }\n  }\n"]),J,J),X=l.div.withConfig({displayName:"Wrapper",componentId:"sc-5xrk5z"})(L=L||g(["\n  display: block;\n  margin: 0 auto;\n  width: 100%;\n"],["\n  display: block;\n  margin: 0 auto;\n  width: 100%;\n"])),Y=l.div.withConfig({displayName:"FormBody",componentId:"sc-155ntqm"})(V=V||g(["\n  position: relative;\n  flex: 1 1 auto;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  overflow: auto;\n  border-top: 1px solid var(--tina-color-grey-2);\n  background-color: #f6f6f9;\n\n  "," {\n    height: 100%;\n  }\n"],["\n  position: relative;\n  flex: 1 1 auto;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  overflow: auto;\n  border-top: 1px solid var(--tina-color-grey-2);\n  background-color: #f6f6f9;\n\n  "," {\n    height: 100%;\n  }\n"]),X),Z=l.div.withConfig({displayName:"FormFooter",componentId:"sc-a22wd5"})(W=W||g(["\n  position: relative;\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  height: 64px;\n  background-color: white;\n  border-top: 1px solid var(--tina-color-grey-2);\n\n  "," {\n    flex: 1 0 auto;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 0 16px;\n  }\n"],["\n  position: relative;\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  height: 64px;\n  background-color: white;\n  border-top: 1px solid var(--tina-color-grey-2);\n\n  "," {\n    flex: 1 0 auto;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 0 16px;\n  }\n"]),X),$=l(u.Button).withConfig({displayName:"SaveButton",componentId:"sc-uak9wm"})(T=T||g(["\n  flex: 1.5 0 auto;\n  padding: 12px 24px;\n"],["\n  flex: 1.5 0 auto;\n  padding: 12px 24px;\n"]));n.ActionButton=E,n.FormActionMenu=h,n.FormBody=Y,n.FormPortalProvider=I,n.FormView=function(n){var o=this,a=n.activeForm,l=t.useCMS().sidebar.buttons,s=c.useCallback(function(n){if(n.destination&&a){var e=n.type;a.mutators.move(e,n.source.index,n.destination.index)}},[a]);return c.createElement(d.FormBuilder,{form:a},function(n){var e=n.handleSubmit,t=n.pristine,i=n.form,r=n.submitting;return c.createElement(p.DragDropContext,{onDragEnd:s},c.createElement(Y,null,c.createElement(I,null,c.createElement(X,null,a&&(a.fields.length?c.createElement(d.FieldsBuilder,{form:a,fields:a.fields}):c.createElement(A,null))))),c.createElement(Z,null,c.createElement(X,null,a.reset&&c.createElement(B,{pristine:t,reset:function(){return m(o,void 0,void 0,function(){return f(this,function(n){switch(n.label){case 0:return i.reset(),[4,a.reset()];case 1:return n.sent(),[2]}})})}},l.reset),c.createElement(u.Button,{onClick:function(){return e()},disabled:t,busy:r,primary:!0,grow:!0,margin:!0},r&&c.createElement(C,null),!r&&l.save),0<a.actions.length&&c.createElement(h,{actions:a.actions,form:a}))))})},n.LoadingDots=C,n.ResetForm=B,n.SaveButton=$,n.Wrapper=X,n.useFormPortal=function(){return c.useContext(z)},Object.defineProperty(n,"__esModule",{value:!0})});
+!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("styled-components"),require("@tinacms/icons"),require("react-dismissible"),require("react-dom"),require("@tinacms/form-builder"),require("@tinacms/styles"),require("react-beautiful-dnd"),require("@tinacms/react-modals"),require("@tinacms/react-core")):"function"==typeof define&&define.amd?define(["exports","react","styled-components","@tinacms/icons","react-dismissible","react-dom","@tinacms/form-builder","@tinacms/styles","react-beautiful-dnd","@tinacms/react-modals","@tinacms/react-core"],e):e((n=n||self)["@tinacms/react-forms"]={},n.React,n.styled,n.icons,n.reactDismissible,n.reactDom,n.formBuilder,n.styles,n.reactBeautifulDnd,n.reactModals,n.reactCore)}(this,function(n,c,i,e,o,a,d,u,p,r,t){"use strict";var l="default"in i?i.default:i,s=function(){return(s=Object.assign||function(n){for(var e,t=1,i=arguments.length;t<i;t++)for(var r in e=arguments[t])Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}).apply(this,arguments)};function m(a,o,l,s){return new(l=l||Promise)(function(n,e){function t(n){try{r(s.next(n))}catch(n){e(n)}}function i(n){try{r(s.throw(n))}catch(n){e(n)}}function r(e){e.done?n(e.value):new l(function(n){n(e.value)}).then(t,i)}r((s=s.apply(a,o||[])).next())})}function f(t,i){var r,a,o,n,l={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return n={next:e(0),throw:e(1),return:e(2)},"function"==typeof Symbol&&(n[Symbol.iterator]=function(){return this}),n;function e(e){return function(n){return function(e){if(r)throw new TypeError("Generator is already executing.");for(;l;)try{if(r=1,a&&(o=2&e[0]?a.return:e[0]?a.throw||((o=a.return)&&o.call(a),0):a.next)&&!(o=o.call(a,e[1])).done)return o;switch(a=0,o&&(e=[2&e[0],o.value]),e[0]){case 0:case 1:o=e;break;case 4:return l.label++,{value:e[1],done:!1};case 5:l.label++,a=e[1],e=[0];continue;case 7:e=l.ops.pop(),l.trys.pop();continue;default:if(!(o=0<(o=l.trys).length&&o[o.length-1])&&(6===e[0]||2===e[0])){l=0;continue}if(3===e[0]&&(!o||e[1]>o[0]&&e[1]<o[3])){l.label=e[1];break}if(6===e[0]&&l.label<o[1]){l.label=o[1],o=e;break}if(o&&l.label<o[2]){l.label=o[2],l.ops.push(e);break}o[2]&&l.ops.pop(),l.trys.pop();continue}e=i.call(t,l)}catch(n){e=[6,n],a=0}finally{r=o=0}if(5&e[0])throw e[1];return{value:e[0]?e[1]:void 0,done:!0}}([e,n])}}}function g(n,e){return Object.defineProperty?Object.defineProperty(n,"raw",{value:e}):n.raw=e,n}function h(n){var e=n.actions,t=n.form,i=c.useState(!1),r=i[0],a=i[1];return c.createElement(c.Fragment,null,c.createElement(w,{onClick:function(){return a(function(n){return!n})}}),c.createElement(k,{open:r},c.createElement(o.Dismissible,{click:!0,escape:!0,disabled:!r,onDismiss:function(){a(function(n){return!n})}},e.map(function(n,e){return c.createElement(n,{form:t,key:e})}))))}var b,v,y,x,w=l(function(n){return c.createElement("button",s({},n),c.createElement(e.EllipsisVerticalIcon,null))}).withConfig({displayName:"MoreActionsButton",componentId:"sc-1atgntc"})(b=b||g(["\n  height: 64px;\n  width: 40px;\n  align-self: stretch;\n  background-color: transparent;\n  background-position: center;\n  background-size: auto 18px;\n  background-repeat: no-repeat;\n  border: 0;\n  margin: 0 -16px 0 8px;\n  outline: none;\n  cursor: pointer;\n  transition: opacity 85ms ease-out;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  &:hover {\n    background-color: var(--tina-color-grey-1);\n    fill: var(--tina-color-grey-8);\n  }\n"],["\n  height: 64px;\n  width: 40px;\n  align-self: stretch;\n  background-color: transparent;\n  background-position: center;\n  background-size: auto 18px;\n  background-repeat: no-repeat;\n  border: 0;\n  margin: 0 -16px 0 8px;\n  outline: none;\n  cursor: pointer;\n  transition: opacity 85ms ease-out;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  &:hover {\n    background-color: var(--tina-color-grey-1);\n    fill: var(--tina-color-grey-8);\n  }\n"])),k=l.div.withConfig({displayName:"ActionsOverlay",componentId:"sc-15j8abz"})(y=y||g(["\n  min-width: 192px;\n  border-radius: var(--tina-radius-big);\n  border: 1px solid #efefef;\n  display: block;\n  position: absolute;\n  bottom: var(--tina-padding-big);\n  right: var(--tina-padding-big);\n  transform: translate3d(0, 0, 0) scale3d(0.5, 0.5, 1);\n  opacity: 0;\n  pointer-events: none;\n  transition: all 85ms ease-out;\n  transform-origin: 100% 100%;\n  box-shadow: var(--tina-shadow-big);\n  background-color: white;\n  overflow: hidden;\n  z-index: var(--tina-z-index-1);\n  ",";\n"],["\n  min-width: 192px;\n  border-radius: var(--tina-radius-big);\n  border: 1px solid #efefef;\n  display: block;\n  position: absolute;\n  bottom: var(--tina-padding-big);\n  right: var(--tina-padding-big);\n  transform: translate3d(0, 0, 0) scale3d(0.5, 0.5, 1);\n  opacity: 0;\n  pointer-events: none;\n  transition: all 85ms ease-out;\n  transform-origin: 100% 100%;\n  box-shadow: var(--tina-shadow-big);\n  background-color: white;\n  overflow: hidden;\n  z-index: var(--tina-z-index-1);\n  ",";\n"]),function(n){return n.open&&i.css(v=v||g(["\n      opacity: 1;\n      pointer-events: all;\n      transform: translate3d(0, -28px, 0) scale3d(1, 1, 1);\n    "],["\n      opacity: 1;\n      pointer-events: all;\n      transform: translate3d(0, -28px, 0) scale3d(1, 1, 1);\n    "]))}),E=l.button.withConfig({displayName:"ActionButton",componentId:"sc-aiskpq"})(x=x||g(["\n  position: relative;\n  text-align: center;\n  font-size: var(--tina-font-size-0);\n  padding: 0 12px;\n  height: 40px;\n  font-weight: var(--tina-font-weight-regular);\n  width: 100%;\n  background: none;\n  cursor: pointer;\n  outline: none;\n  border: 0;\n  transition: all 85ms ease-out;\n  &:hover {\n    color: var(--tina-color-primary);\n    background-color: var(--tina-color-grey-1);\n  }\n  &:not(:last-child) {\n    border-bottom: 1px solid #efefef;\n  }\n"],["\n  position: relative;\n  text-align: center;\n  font-size: var(--tina-font-size-0);\n  padding: 0 12px;\n  height: 40px;\n  font-weight: var(--tina-font-weight-regular);\n  width: 100%;\n  background: none;\n  cursor: pointer;\n  outline: none;\n  border: 0;\n  transition: all 85ms ease-out;\n  &:hover {\n    color: var(--tina-color-primary);\n    background-color: var(--tina-color-grey-1);\n  }\n  &:not(:last-child) {\n    border-bottom: 1px solid #efefef;\n  }\n"])),z=c.createContext(function(){return null});function C(n){var e=n.dotSize,t=void 0===e?8:e,i=n.color,r=void 0===i?"white":i;return c.createElement("div",null,c.createElement(q,{dotSize:t,color:r}),c.createElement(q,{dotSize:t,color:r}),c.createElement(q,{dotSize:t,color:r}))}function B(n){var e=n.pristine,t=n.reset,i=n.children,r=c.useState(!1),a=r[0],o=r[1];return c.createElement(c.Fragment,null,c.createElement(M,{onClick:function(){o(function(n){return!n})},disabled:e},i),a&&c.createElement(D,{reset:t,close:function(){return o(!1)}}))}var j,S,F,O,P,I=l(function(n){var e=n.children,t=function(n,e){var t={};for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&e.indexOf(i)<0&&(t[i]=n[i]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(i=Object.getOwnPropertySymbols(n);r<i.length;r++)e.indexOf(i[r])<0&&Object.prototype.propertyIsEnumerable.call(n,i[r])&&(t[i[r]]=n[i[r]])}return t}(n,["children"]),i=c.useRef(null),r=c.useCallback(function(n){return i.current?a.createPortal(n.children,i.current):null},[i.current]);return c.createElement(z.Provider,{value:r},c.createElement("div",s({ref:i},t),e))}).withConfig({displayName:"FormPortalProvider",componentId:"sc-1bn9axm"})(j=j||g(["\n  height: 100%;\n  scrollbar-width: none;\n"],["\n  height: 100%;\n  scrollbar-width: none;\n"])),N=i.keyframes(S=S||g(["\n  0% { transform: scale(0.1); }\n  50% { transform: scale(1); }\n  90% { transform: scale(0.1); }\n  100% { transform: scale(0.1); }\n"],["\n  0% { transform: scale(0.1); }\n  50% { transform: scale(1); }\n  90% { transform: scale(0.1); }\n  100% { transform: scale(0.1); }\n"])),q=l.span.withConfig({displayName:"SingleDot",componentId:"sc-67w58h"})(O=O||g(["\n  animation: "," 2s linear infinite;\n  display: inline-block;\n  margin-right: 4px;\n  :nth-child(2) {\n    animation-delay: 0.3s;\n  }\n  :nth-child(3) {\n    animation-delay: 0.5s;\n  }\n  ","\n"],["\n  animation: "," 2s linear infinite;\n  display: inline-block;\n  margin-right: 4px;\n  :nth-child(2) {\n    animation-delay: 0.3s;\n  }\n  :nth-child(3) {\n    animation-delay: 0.5s;\n  }\n  ","\n"]),N,function(n){var e=n.color,t=n.dotSize;return i.css(F=F||g(["\n      background: ",";\n      width: ","px;\n      height: ","px;\n      border-radius: ","px;\n    "],["\n      background: ",";\n      width: ","px;\n      height: ","px;\n      border-radius: ","px;\n    "]),e,t,t,t)}),D=function(n){var e=n.close,t=n.reset;return c.createElement(r.Modal,null,c.createElement(r.ModalPopup,null,c.createElement(r.ModalHeader,{close:e},"Reset"),c.createElement(r.ModalBody,{padded:!0},c.createElement("p",null,"Are you sure you want to reset all changes?")),c.createElement(r.ModalActions,null,c.createElement(u.Button,{onClick:e},"Cancel"),c.createElement(u.Button,{margin:!0,primary:!0,onClick:function(){return m(void 0,void 0,void 0,function(){return f(this,function(n){switch(n.label){case 0:return[4,t()];case 1:return n.sent(),e(),[2]}})})}},"Reset"))))},M=l(u.Button).withConfig({displayName:"ResetButton",componentId:"sc-1epa276"})(P=P||g(["\n  flex: 0 0 96px;\n"],["\n  flex: 0 0 96px;\n"]));function A(){return c.createElement(Q,null,c.createElement(J,null,"🤔"),c.createElement("h3",null,"Hey, you don't have any fields added to this form."),c.createElement("p",null,c.createElement(U,{href:"https://tinacms.org/docs/fields",target:"_blank"},c.createElement(J,null,"📖")," Field Setup Guide")))}var R,_,G,H,L,V,W,T,J=l.span.withConfig({displayName:"Emoji",componentId:"sc-1ywomn6"})(R=R||g(["\n  font-size: 40px;\n  line-height: 1;\n  display: inline-block;\n"],["\n  font-size: 40px;\n  line-height: 1;\n  display: inline-block;\n"])),K=i.keyframes(_=_||g(["\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n"],["\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n"])),Q=l.div.withConfig({displayName:"EmptyState",componentId:"sc-1oxdh5z"})(G=G||g(["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  padding: var(--tina-padding-big) var(--tina-padding-big) 64px\n    var(--tina-padding-big);\n  width: 100%;\n  height: 100%;\n  overflow-y: auto;\n  animation-name: ",";\n  animation-delay: 300ms;\n  animation-timing-function: ease-out;\n  animation-iteration-count: 1;\n  animation-fill-mode: both;\n  animation-duration: 150ms;\n  > *:first-child {\n    margin: 0 0 var(--tina-padding-big) 0;\n  }\n  > "," {\n    display: block;\n  }\n  h3 {\n    font-size: var(--tina-font-size-5);\n    font-weight: normal;\n    color: inherit;\n    display: block;\n    margin: 0 0 var(--tina-padding-big) 0;\n    "," {\n      font-size: 1em;\n    }\n  }\n  p {\n    display: block;\n    margin: 0 0 var(--tina-padding-big) 0;\n  }\n"],["\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-align: center;\n  padding: var(--tina-padding-big) var(--tina-padding-big) 64px\n    var(--tina-padding-big);\n  width: 100%;\n  height: 100%;\n  overflow-y: auto;\n  animation-name: ",";\n  animation-delay: 300ms;\n  animation-timing-function: ease-out;\n  animation-iteration-count: 1;\n  animation-fill-mode: both;\n  animation-duration: 150ms;\n  > *:first-child {\n    margin: 0 0 var(--tina-padding-big) 0;\n  }\n  > "," {\n    display: block;\n  }\n  h3 {\n    font-size: var(--tina-font-size-5);\n    font-weight: normal;\n    color: inherit;\n    display: block;\n    margin: 0 0 var(--tina-padding-big) 0;\n    "," {\n      font-size: 1em;\n    }\n  }\n  p {\n    display: block;\n    margin: 0 0 var(--tina-padding-big) 0;\n  }\n"]),K,J,J),U=l.a.withConfig({displayName:"LinkButton",componentId:"sc-i30s9h"})(H=H||g(["\n  text-align: center;\n  border: 0;\n  border-radius: var(--tina-radius-big);\n  border: 1px solid var(--tina-color-grey-2);\n  box-shadow: var(--tina-shadow-small);\n  font-weight: var(--tina-font-weight-regular);\n  cursor: pointer;\n  font-size: var(--tina-font-size-0);\n  transition: all var(--tina-timing-short) ease-out;\n  background-color: white;\n  color: var(--tina-color-grey-8);\n  padding: var(--tina-padding-small) var(--tina-padding-big)\n    var(--tina-padding-small) 56px;\n  position: relative;\n  text-decoration: none;\n  display: inline-block;\n  "," {\n    font-size: 24px;\n    position: absolute;\n    left: var(--tina-padding-big);\n    top: 50%;\n    transform-origin: 50% 50%;\n    transform: translate3d(0, -50%, 0);\n    transition: all var(--tina-timing-short) ease-out;\n  }\n  &:hover {\n    color: var(--tina-color-primary);\n    "," {\n      transform: translate3d(0, -50%, 0);\n    }\n  }\n"],["\n  text-align: center;\n  border: 0;\n  border-radius: var(--tina-radius-big);\n  border: 1px solid var(--tina-color-grey-2);\n  box-shadow: var(--tina-shadow-small);\n  font-weight: var(--tina-font-weight-regular);\n  cursor: pointer;\n  font-size: var(--tina-font-size-0);\n  transition: all var(--tina-timing-short) ease-out;\n  background-color: white;\n  color: var(--tina-color-grey-8);\n  padding: var(--tina-padding-small) var(--tina-padding-big)\n    var(--tina-padding-small) 56px;\n  position: relative;\n  text-decoration: none;\n  display: inline-block;\n  "," {\n    font-size: 24px;\n    position: absolute;\n    left: var(--tina-padding-big);\n    top: 50%;\n    transform-origin: 50% 50%;\n    transform: translate3d(0, -50%, 0);\n    transition: all var(--tina-timing-short) ease-out;\n  }\n  &:hover {\n    color: var(--tina-color-primary);\n    "," {\n      transform: translate3d(0, -50%, 0);\n    }\n  }\n"]),J,J),X=l.div.withConfig({displayName:"Wrapper",componentId:"sc-5xrk5z"})(L=L||g(["\n  display: block;\n  margin: 0 auto;\n  width: 100%;\n"],["\n  display: block;\n  margin: 0 auto;\n  width: 100%;\n"])),Y=l.div.withConfig({displayName:"FormBody",componentId:"sc-155ntqm"})(V=V||g(["\n  position: relative;\n  flex: 1 1 auto;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  overflow: auto;\n  border-top: 1px solid var(--tina-color-grey-2);\n  background-color: #f6f6f9;\n\n  "," {\n    height: 100%;\n  }\n"],["\n  position: relative;\n  flex: 1 1 auto;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  overflow: auto;\n  border-top: 1px solid var(--tina-color-grey-2);\n  background-color: #f6f6f9;\n\n  "," {\n    height: 100%;\n  }\n"]),X),Z=l.div.withConfig({displayName:"FormFooter",componentId:"sc-a22wd5"})(W=W||g(["\n  position: relative;\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  height: 64px;\n  background-color: white;\n  border-top: 1px solid var(--tina-color-grey-2);\n\n  "," {\n    flex: 1 0 auto;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 0 16px;\n  }\n"],["\n  position: relative;\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  height: 64px;\n  background-color: white;\n  border-top: 1px solid var(--tina-color-grey-2);\n\n  "," {\n    flex: 1 0 auto;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 0 16px;\n  }\n"]),X),$=l(u.Button).withConfig({displayName:"SaveButton",componentId:"sc-uak9wm"})(T=T||g(["\n  flex: 1.5 0 auto;\n  padding: 12px 24px;\n"],["\n  flex: 1.5 0 auto;\n  padding: 12px 24px;\n"]));n.ActionButton=E,n.FormActionMenu=h,n.FormBody=Y,n.FormPortalProvider=I,n.FormView=function(n){var a=this,o=n.activeForm,l=t.useCMS().sidebar.buttons,s=c.useCallback(function(n){if(n.destination&&o){var e=n.type;o.mutators.move(e,n.source.index,n.destination.index)}},[o]);return c.createElement(d.FormBuilder,{form:o},function(n){var e=n.handleSubmit,t=n.pristine,i=n.form,r=n.submitting;return c.createElement(p.DragDropContext,{onDragEnd:s},c.createElement(Y,null,c.createElement(I,null,c.createElement(X,null,o&&(o.fields.length?c.createElement(d.FieldsBuilder,{form:o,fields:o.fields}):c.createElement(A,null))))),c.createElement(Z,null,c.createElement(X,null,o.reset&&c.createElement(B,{pristine:t,reset:function(){return m(a,void 0,void 0,function(){return f(this,function(n){switch(n.label){case 0:return i.reset(),[4,o.reset()];case 1:return n.sent(),[2]}})})}},l.reset),c.createElement(u.Button,{onClick:function(){return e()},disabled:t,busy:r,primary:!0,grow:!0,margin:!0},r&&c.createElement(C,null),!r&&l.save),0<o.actions.length&&c.createElement(h,{actions:o.actions,form:o}))))})},n.LoadingDots=C,n.ResetForm=B,n.SaveButton=$,n.Wrapper=X,n.useFormPortal=function(){return c.useContext(z)},Object.defineProperty(n,"__esModule",{value:!0})});

CHANGELOG.md

@@ -6,2 +6,10 @@ # Change Log
 
+## [0.1.7-alpha.0](https://github.com/tinacms/tinacms/compare/@tinacms/react-forms@0.1.6...@tinacms/react-forms@0.1.7-alpha.0) (2020-05-28)
+
+**Note:** Version bump only for package @tinacms/react-forms
+
+
+
+
+
 ## [0.1.6](https://github.com/tinacms/tinacms/compare/@tinacms/react-forms@0.1.5...@tinacms/react-forms@0.1.6) (2020-05-25)
@@ -8,0 +16,0 @@

package.json

 {
   "name": "@tinacms/react-forms",
-  "version": "0.1.6",
+  "version": "0.1.7-alpha.0",
   "license": "Apache-2.0",
@@ -23,3 +23,3 @@ "main": "build/index.js",
   "dependencies": {
-    "@tinacms/form-builder": "^0.3.3",
+    "@tinacms/form-builder": "^0.3.4-alpha.0",
     "react-beautiful-dnd": "^11.0.5",
@@ -29,8 +29,8 @@ "react-dismissible": "^1.1.5"
   "devDependencies": {
-    "@tinacms/forms": "^0.4.2",
+    "@tinacms/forms": "^0.4.3-alpha.0",
     "@tinacms/icons": "^0.12.0",
-    "@tinacms/react-core": "^0.2.12",
-    "@tinacms/react-modals": "^0.1.6",
+    "@tinacms/react-core": "^0.2.13-alpha.0",
+    "@tinacms/react-modals": "^0.1.7-alpha.0",
     "@tinacms/scripts": "^0.1.13",
-    "@tinacms/styles": "^0.4.2",
+    "@tinacms/styles": "^0.5.0-alpha.0",
     "@types/react-beautiful-dnd": "^11.0.3"
@@ -48,3 +48,3 @@ },
   },
-  "gitHead": "e4789eefc0dc6aeef08d397884f68766644df0ae"
+  "gitHead": "7ff6d0f8cdcb7bdf7bfcd47d89db4bb0223ee897"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

36731

increased by1.01%

Lines of code

177

increased by0.57%

Dependency changes

• Updated@tinacms/form-builder@^0.3.4-alpha.0