@planningcenter/organization-avatars 1.10.1 → 1.10.2
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/index.cjs +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require(
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require("react"),l=require("react-dom"),u=require("@planningcenter/url"),d=require("@planningcenter/tapestry"),f=require("@planningcenter/sweetest-alert"),p=require("@planningcenter/icons/paths/general"),m=require("@planningcenter/icons/paths/services"),h=require("react-dropzone");h=s(h,1);let g=require("react/jsx-runtime");function _(e){var t,n,r=``;if(typeof e==`string`||typeof e==`number`)r+=e;else if(typeof e==`object`)if(Array.isArray(e)){var i=e.length;for(t=0;t<i;t++)e[t]&&(n=_(e[t]))&&(r&&(r+=` `),r+=n)}else for(n in e)e[n]&&(r&&(r+=` `),r+=n);return r}function v(){for(var e,t,n=0,r=``,i=arguments.length;n<i;n++)(e=arguments[n])&&(t=_(e))&&(r&&(r+=` `),r+=t);return r}function y(){let e=document.querySelector(`meta[name="csrf-token"]`);if(!e||!e.content)throw Error(`CSRF token not found. Ensure your Rails application includes <meta name="csrf-token" content="..."> in the document head.`);return e.content}function b(e){let t=e.split(``);return[t.shift()?.toUpperCase(),t.join(``)].join(``)}var x=e=>e===`dark_mode_avatar`?`dark`:`light`,S=({open:e})=>(0,g.jsxs)(`h2`,{className:`pco-org-avatar__instructions`,children:[`Drag & drop your logo file to upload, or`,` `,(0,g.jsx)(d.Button,{label:`browse`,kind:`inline-text`,onClick:t=>{t.stopPropagation(),e()}})]});function C({avatarUrl:e,organization:t,mode:n,pcoEnv:r,readOnly:i,onAvatarUpdate:a,fallbackAvatarUrl:o}){let[s,_]=(0,c.useState)(null),[C,w]=(0,c.useState)(!1),[T,E]=(0,c.useState)(!1),[D,O]=(0,c.useState)(``),k=(0,c.useId)(),A=(0,c.useRef)(null),j=x(n),M=e||o,N=e=>{let[t]=e;t&&_(Object.assign(t,{preview:URL.createObjectURL(t)}))};(0,c.useEffect)(()=>()=>{s?.preview&&(URL.revokeObjectURL(s.preview),O(``))},[s]);let P=async e=>{let t=await fetch((0,u.pcoApiUrl)(`accounts`,{env:r}),{method:`PATCH`,headers:{"Content-Type":`application/json`,"X-CSRF-Token":y(),Accept:`application/json`},body:JSON.stringify({data:{attributes:e}})}),n=await t.json();if(!t.ok)throw n;return n},F=async e=>{if(e.preventDefault(),!(!s||C||T)){w(!0);try{let e=new FileReader,t=await new Promise((t,n)=>{e.onloadend=()=>t(e.result),e.onerror=n,e.readAsDataURL(s)}),r=await P({[n]:t,[`${n}_cache`]:``});_(null),a(n,r.data.attributes[n].url),A.current?.close()}catch{O(`We were unable to save your avatar.`)}finally{w(!1)}}},I=async()=>{C||T||(E(!0),(0,f.SweetestAlert)({type:`danger`,title:`Remove this logo?`,content:j===`light`?`Removing this logo means no logo will appear in light mode. This cannot be undone.`:o?`Removing this logo means your light mode logo will appear in dark mode. This cannot be undone.`:`Removing this logo means no logo will appear in dark mode. This cannot be undone.`,confirmButton:`Remove logo`,onConfirm:async()=>{try{await P({[`remove_${n}`]:`1`}),a(n,``),A.current?.close()}catch{O(`We were unable to delete your avatar.`)}finally{E(!1)}},onCancel:()=>{E(!1)}}))};return(0,g.jsxs)(g.Fragment,{children:[(0,g.jsxs)(`div`,{className:`pco-org-avatar`,children:[(0,g.jsx)(`button`,{type:`button`,onClick:()=>A.current?.showModal(),disabled:i,className:`pco-org-avatar__button pco-org-avatar__button--${j}`,children:M?(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(`img`,{src:M,alt:`Church logo for ${t}`}),(0,g.jsx)(`div`,{className:`tds-btn tds-btn--interaction tds-btn--icononly`,children:(0,g.jsx)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 16 16`,fill:`currentColor`,"aria-hidden":`true`,children:(0,g.jsx)(`path`,{d:p.pencil})})})]}):(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(`svg`,{width:`48`,height:`48`,viewBox:`0 0 16 16`,fill:`currentColor`,"aria-hidden":`true`,children:(0,g.jsx)(`path`,{d:m.image})}),(0,g.jsx)(`div`,{className:`tds-btn tds-btn--interaction tds-btn--icononly`,children:(0,g.jsx)(`svg`,{width:`14`,height:`14`,viewBox:`0 0 16 16`,fill:`currentColor`,"aria-hidden":`true`,children:(0,g.jsx)(`path`,{d:p.pencil})})})]})}),(0,g.jsxs)(`div`,{className:`pco-org-avatar__label`,children:[b(j),` mode`]})]}),(0,l.createPortal)((0,g.jsx)(`dialog`,{id:k,ref:A,className:`pco-org-avatar__dialog`,onClose:()=>{_(null),O(``)},children:(0,g.jsxs)(`form`,{onSubmit:F,children:[(0,g.jsxs)(`div`,{className:`pco-org-avatar__dialog-header`,children:[(0,g.jsxs)(`h1`,{className:`pco-org-avatar__dialog-title`,children:[`Church logo — `,j,` mode`]}),(0,g.jsx)(`button`,{type:`button`,onClick:()=>A.current?.close(),className:`pco-org-avatar__dialog-close`,"aria-label":`Close modal`,children:(0,g.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`currentColor`,"aria-hidden":`true`,children:(0,g.jsx)(`path`,{d:p.smallX})})})]}),(0,g.jsxs)(`div`,{className:`pco-org-avatar__dialog-body`,children:[D&&(0,g.jsxs)(`div`,{role:`alert`,className:`pco-org-avatar-alert pco-org-avatar__dialog-alert`,children:[(0,g.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,className:`symbol`,"aria-hidden":`true`,children:(0,g.jsx)(`path`,{d:p.exclamationTriangle})}),(0,g.jsx)(`p`,{children:D})]}),(0,g.jsx)(h.default,{accept:{"image/*":[`.jpg`,`.jpeg`,`.png`]},multiple:!1,onDropAccepted:N,children:({getRootProps:e,getInputProps:n,isFocused:r,isDragAccept:i,isDragReject:a,isDragActive:o,open:c})=>(0,g.jsxs)(g.Fragment,{children:[(0,g.jsxs)(`div`,{...e({className:v(`pco-org-avatar__dialog-dropzone`,`pco-org-avatar__dialog-dropzone--${j}`,{"pco-org-avatar__dialog-dropzone--image":s||M,"pco-org-avatar__dialog-dropzone--focused":r,"pco-org-avatar__dialog-dropzone--accepted":i,"pco-org-avatar__dialog-dropzone--rejected":o&&a})}),children:[(0,g.jsx)(`input`,{...n()}),s?(0,g.jsx)(`img`,{src:s.preview,alt:`Church logo for ${t}`}):M?(0,g.jsx)(`img`,{src:M,alt:`Church logo for ${t}`}):(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(`svg`,{width:`64`,height:`64`,viewBox:`0 0 16 16`,"aria-hidden":`true`,children:(0,g.jsx)(`path`,{d:p.toCloudArrow})}),o&&a?(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(`h2`,{children:`Wrong file type`}),(0,g.jsx)(`p`,{children:`Please upload a PNG or JPG file.`})]}):(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(S,{open:c}),(0,g.jsx)(`p`,{className:`pco-org-avatar__instructions-sub`,children:`Use a high-quality image (up to 20mb) with a transparent background.`})]})]})]}),(s||M)&&(0,g.jsx)(S,{open:c})]})})]}),(0,g.jsxs)(`div`,{className:`pco-org-avatar__dialog-actions`,children:[e&&j===`light`&&(0,g.jsx)(d.Button,{label:`Remove logo`,kind:`secondary-delete`,onClick:I,loading:T,disabled:T||C,className:`pco-org-avatar__dialog-delete`}),e&&j===`dark`&&(0,g.jsx)(d.Button,{label:`Use light mode logo`,kind:`secondary`,onClick:I,loading:T,disabled:T||C,className:`pco-org-avatar__dialog-delete`}),(0,g.jsx)(d.Button,{type:`button`,label:`Cancel`,onClick:()=>A.current?.close(),disabled:C||T}),(0,g.jsx)(d.Button,{type:`submit`,label:`Update logo`,kind:`primary`,loading:C,disabled:!s||C||T})]})]})}),document.body)]})}function w({avatarUrl:e,darkModeAvatarUrl:t,orgName:n,onAvatarUpdate:r,pcoEnv:i,readOnly:a,showDarkModeAvatar:o=!1}){let[s,l]=(0,c.useState)(e),[u,d]=(0,c.useState)(t),f=(e,t)=>{e===`avatar`?(l(t),r?.(`avatar`,t)):e===`dark_mode_avatar`&&(d(t),r?.(`dark_mode_avatar`,t))};return(0,g.jsxs)(g.Fragment,{children:[(0,g.jsxs)(`div`,{className:`pco-org-avatars`,children:[(0,g.jsx)(C,{avatarUrl:s,organization:n,mode:`avatar`,pcoEnv:i,readOnly:a,onAvatarUpdate:f}),o&&(0,g.jsx)(C,{avatarUrl:u,organization:n,mode:`dark_mode_avatar`,pcoEnv:i,readOnly:a,onAvatarUpdate:f,fallbackAvatarUrl:s})]}),o&&s&&!u&&(0,g.jsxs)(`div`,{className:`pco-org-avatar-alert`,children:[(0,g.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,className:`symbol`,"aria-hidden":`true`,children:(0,g.jsx)(`path`,{d:p.infoCircle})}),(0,g.jsx)(`p`,{children:`The same logo is being used for both light and dark modes.`})]})]})}exports.OrganizationAvatars=w;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@planningcenter/organization-avatars",
|
|
3
|
-
"version": "1.10.
|
|
3
|
+
"version": "1.10.2",
|
|
4
4
|
"description": "Organization avatar upload components for Planning Center apps",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"packageManager": "yarn@4.16.0+sha512.5374c94eb4ef6aa8188fb112f20c1aa6569f248d676c5e576e1fd2a1a4d8d87a96df65d9dfe1c2a0252cbe38bda46cf18d955005b81b43cc7607a5c9d56fd2b6",
|