@planningcenter/organization-avatars 1.6.2 → 1.6.3

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 CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("react"),B=require("react-dom"),M=require("@planningcenter/url"),C=require("@planningcenter/tapestry"),j=require("@planningcenter/icons/paths/general"),O=require("@planningcenter/icons/paths/services"),P=require("react-dropzone");function z(a){var o,t,r="";if(typeof a=="string"||typeof a=="number")r+=a;else if(typeof a=="object")if(Array.isArray(a)){var c=a.length;for(o=0;o<c;o++)a[o]&&(t=z(a[o]))&&(r&&(r+=" "),r+=t)}else for(t in a)a[t]&&(r&&(r+=" "),r+=t);return r}function T(){for(var a,o,t=0,r="",c=arguments.length;t<c;t++)(a=arguments[t])&&(o=z(a))&&(r&&(r+=" "),r+=o);return r}function $(){const a=document.querySelector('meta[name="csrf-token"]');if(!a||!a.content)throw new Error('CSRF token not found. Ensure your Rails application includes <meta name="csrf-token" content="..."> in the document head.');return a.content}function L(a){const o=a.split("");return[o.shift()?.toUpperCase(),o.join("")].join("")}const I=a=>a==="dark_mode_avatar"?"dark":"light";function S({avatarUrl:a,organization:o,mode:t,pcoEnv:r,readOnly:c,onAvatarUpdate:v}){const[s,p]=l.useState(null),[d,x]=l.useState(!1),[u,f]=l.useState(!1),[_,h]=l.useState(""),i=l.useId(),k=l.useRef(null),b=I(t),F=g=>{const[n]=g;n&&p(Object.assign(n,{preview:URL.createObjectURL(n)}))};l.useEffect(()=>()=>{s?.preview&&(URL.revokeObjectURL(s.preview),h(""))},[s]);const N=async g=>{const n=await fetch(M.pcoApiUrl("accounts",{env:r}),{method:"PATCH",headers:{"Content-Type":"application/json","X-CSRF-Token":$(),Accept:"application/json"},body:JSON.stringify({data:{attributes:g}})}),m=await n.json();if(!n.ok)throw m;return m},R=async g=>{if(g.preventDefault(),!(!s||d||u)){x(!0);try{const n=new FileReader,m=await new Promise((y,w)=>{n.onloadend=()=>y(n.result),n.onerror=w,n.readAsDataURL(s)}),A=await N({[t]:m,[`${t}_cache`]:""});p(null),v(t,A.data.attributes[t].url),k.current?.close()}catch{h("We were unable to save your avatar.")}finally{x(!1)}}},U=async()=>{if(!(d||u)){f(!0);try{await N({[`remove_${t}`]:"1"}),v(t,""),k.current?.close()}catch{h("We were unable to delete your avatar.")}finally{f(!1)}}},q=()=>{p(null),h("")};return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"pco-org-avatar",children:[e.jsx("button",{type:"button",commandfor:i,command:"show-modal",disabled:c,className:`pco-org-avatar__button pco-org-avatar__button--${b}`,children:a?e.jsxs(e.Fragment,{children:[e.jsx("img",{src:a,alt:`Church logo for ${o}`}),e.jsx("div",{className:"tds-btn tds-btn--interaction tds-btn--icononly",children:e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e.jsx("path",{d:j.pencil})})})]}):e.jsxs(e.Fragment,{children:[e.jsx("svg",{width:"48",height:"48",viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e.jsx("path",{d:O.image})}),e.jsx("div",{className:"tds-btn tds-btn--interaction tds-btn--icononly",children:e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e.jsx("path",{d:j.pencil})})})]})}),e.jsxs("div",{className:"pco-org-avatar__label",children:[L(b)," mode"]})]}),B.createPortal(e.jsx("dialog",{id:i,ref:k,className:"pco-org-avatar__dialog",onClose:q,children:e.jsxs("form",{onSubmit:R,children:[e.jsxs("div",{className:"pco-org-avatar__dialog-header",children:[e.jsxs("h1",{className:"pco-org-avatar__dialog-title",children:["Church logo — ",b," mode"]}),e.jsx("button",{type:"button",commandfor:i,command:"close",className:"pco-org-avatar__dialog-close","aria-label":"Close modal",children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e.jsx("path",{d:j.smallX})})})]}),e.jsxs("div",{className:"pco-org-avatar__dialog-body",children:[_&&e.jsxs("div",{role:"alert",className:"pco-org-avatar__dialog-alert",children:[e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",className:"symbol","aria-hidden":"true",children:e.jsx("path",{d:j.exclamationTriangle})}),e.jsx("p",{children:_})]}),e.jsx(P,{accept:{"image/*":[".jpg",".jpeg",".png"]},multiple:!1,onDropAccepted:F,children:({getRootProps:g,getInputProps:n,isFocused:m,isDragAccept:A,isDragReject:y,isDragActive:w})=>{const D=T("pco-org-avatar__dialog-dropzone",`pco-org-avatar__dialog-dropzone--${b}`,{"pco-org-avatar__dialog-dropzone--image":s||a,"pco-org-avatar__dialog-dropzone--focused":m,"pco-org-avatar__dialog-dropzone--accepted":A,"pco-org-avatar__dialog-dropzone--rejected":w&&y});return e.jsxs("div",{...g({className:D}),children:[e.jsx("input",{...n()}),s?e.jsx("img",{src:s.preview,alt:`Church logo for ${o}`}):a?e.jsx("img",{src:a,alt:`Church logo for ${o}`}):e.jsxs(e.Fragment,{children:[e.jsx("svg",{width:"64",height:"64",viewBox:"0 0 16 16","aria-hidden":"true",children:e.jsx("path",{d:j.toCloudArrow})}),w&&y?e.jsxs(e.Fragment,{children:[e.jsx("h2",{children:"Wrong file type"}),e.jsx("p",{children:"Please upload a PNG or JPG file."})]}):e.jsxs(e.Fragment,{children:[e.jsx("h2",{children:"Add church logo"}),e.jsx("p",{children:"Use a high-quality image (up to 20mb) with a transparent background."})]})]})]})}})]}),e.jsxs("div",{className:"pco-org-avatar__dialog-actions",children:[a&&e.jsx(C.Button,{label:"Delete logo",kind:"delete",onClick:U,loading:u,disabled:u||d,className:"pco-org-avatar__dialog-delete"}),e.jsx(C.Button,{type:"button",label:"Cancel",commandfor:i,command:"close",disabled:d||u}),e.jsx(C.Button,{type:"submit",label:"Update logo",kind:"primary",loading:d,disabled:!s||d||u})]})]})}),document.body)]})}function E({avatarUrl:a,darkModeAvatarUrl:o,orgName:t,onAvatarUpdate:r,pcoEnv:c,readOnly:v,showDarkModeAvatar:s=!1}){const[p,d]=l.useState(a),[x,u]=l.useState(o),f=(h,i)=>{h==="avatar"?(d(i),r?.("avatar",i)):h==="dark_mode_avatar"&&(u(i),r?.("dark_mode_avatar",i))},_=x||p;return e.jsxs("div",{className:"pco-org-avatars",children:[e.jsx(S,{avatarUrl:p,organization:t,mode:"avatar",pcoEnv:c,readOnly:v,onAvatarUpdate:f}),s&&e.jsx(S,{avatarUrl:_,organization:t,mode:"dark_mode_avatar",pcoEnv:c,readOnly:v,onAvatarUpdate:f})]})}exports.OrganizationAvatars=E;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),M=require("react-dom"),B=require("@planningcenter/url"),A=require("@planningcenter/tapestry"),x=require("@planningcenter/icons/paths/general"),O=require("@planningcenter/icons/paths/services"),P=require("react-dropzone");function z(a){var o,t,r="";if(typeof a=="string"||typeof a=="number")r+=a;else if(typeof a=="object")if(Array.isArray(a)){var l=a.length;for(o=0;o<l;o++)a[o]&&(t=z(a[o]))&&(r&&(r+=" "),r+=t)}else for(t in a)a[t]&&(r&&(r+=" "),r+=t);return r}function T(){for(var a,o,t=0,r="",l=arguments.length;t<l;t++)(a=arguments[t])&&(o=z(a))&&(r&&(r+=" "),r+=o);return r}function $(){const a=document.querySelector('meta[name="csrf-token"]');if(!a||!a.content)throw new Error('CSRF token not found. Ensure your Rails application includes <meta name="csrf-token" content="..."> in the document head.');return a.content}function L(a){const o=a.split("");return[o.shift()?.toUpperCase(),o.join("")].join("")}const I=a=>a==="dark_mode_avatar"?"dark":"light";function S({avatarUrl:a,organization:o,mode:t,pcoEnv:r,readOnly:l,onAvatarUpdate:j}){const[s,g]=i.useState(null),[c,_]=i.useState(!1),[d,f]=i.useState(!1),[b,u]=i.useState(""),p=i.useId(),v=i.useRef(null),y=I(t),F=h=>{const[n]=h;n&&g(Object.assign(n,{preview:URL.createObjectURL(n)}))};i.useEffect(()=>()=>{s?.preview&&(URL.revokeObjectURL(s.preview),u(""))},[s]);const N=async h=>{const n=await fetch(B.pcoApiUrl("accounts",{env:r}),{method:"PATCH",headers:{"Content-Type":"application/json","X-CSRF-Token":$(),Accept:"application/json"},body:JSON.stringify({data:{attributes:h}})}),m=await n.json();if(!n.ok)throw m;return m},R=async h=>{if(h.preventDefault(),!(!s||c||d)){_(!0);try{const n=new FileReader,m=await new Promise((w,k)=>{n.onloadend=()=>w(n.result),n.onerror=k,n.readAsDataURL(s)}),C=await N({[t]:m,[`${t}_cache`]:""});g(null),j(t,C.data.attributes[t].url),v.current?.close()}catch{u("We were unable to save your avatar.")}finally{_(!1)}}},U=async()=>{if(!(c||d)){f(!0);try{await N({[`remove_${t}`]:"1"}),j(t,""),v.current?.close()}catch{u("We were unable to delete your avatar.")}finally{f(!1)}}},q=()=>{g(null),u("")};return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"pco-org-avatar",children:[e.jsx("button",{type:"button",onClick:()=>v.current?.showModal(),disabled:l,className:`pco-org-avatar__button pco-org-avatar__button--${y}`,children:a?e.jsxs(e.Fragment,{children:[e.jsx("img",{src:a,alt:`Church logo for ${o}`}),e.jsx("div",{className:"tds-btn tds-btn--interaction tds-btn--icononly",children:e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e.jsx("path",{d:x.pencil})})})]}):e.jsxs(e.Fragment,{children:[e.jsx("svg",{width:"48",height:"48",viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e.jsx("path",{d:O.image})}),e.jsx("div",{className:"tds-btn tds-btn--interaction tds-btn--icononly",children:e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e.jsx("path",{d:x.pencil})})})]})}),e.jsxs("div",{className:"pco-org-avatar__label",children:[L(y)," mode"]})]}),M.createPortal(e.jsx("dialog",{id:p,ref:v,className:"pco-org-avatar__dialog",onClose:q,children:e.jsxs("form",{onSubmit:R,children:[e.jsxs("div",{className:"pco-org-avatar__dialog-header",children:[e.jsxs("h1",{className:"pco-org-avatar__dialog-title",children:["Church logo — ",y," mode"]}),e.jsx("button",{type:"button",onClick:()=>v.current?.close(),className:"pco-org-avatar__dialog-close","aria-label":"Close modal",children:e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e.jsx("path",{d:x.smallX})})})]}),e.jsxs("div",{className:"pco-org-avatar__dialog-body",children:[b&&e.jsxs("div",{role:"alert",className:"pco-org-avatar__dialog-alert",children:[e.jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",className:"symbol","aria-hidden":"true",children:e.jsx("path",{d:x.exclamationTriangle})}),e.jsx("p",{children:b})]}),e.jsx(P,{accept:{"image/*":[".jpg",".jpeg",".png"]},multiple:!1,onDropAccepted:F,children:({getRootProps:h,getInputProps:n,isFocused:m,isDragAccept:C,isDragReject:w,isDragActive:k})=>{const D=T("pco-org-avatar__dialog-dropzone",`pco-org-avatar__dialog-dropzone--${y}`,{"pco-org-avatar__dialog-dropzone--image":s||a,"pco-org-avatar__dialog-dropzone--focused":m,"pco-org-avatar__dialog-dropzone--accepted":C,"pco-org-avatar__dialog-dropzone--rejected":k&&w});return e.jsxs("div",{...h({className:D}),children:[e.jsx("input",{...n()}),s?e.jsx("img",{src:s.preview,alt:`Church logo for ${o}`}):a?e.jsx("img",{src:a,alt:`Church logo for ${o}`}):e.jsxs(e.Fragment,{children:[e.jsx("svg",{width:"64",height:"64",viewBox:"0 0 16 16","aria-hidden":"true",children:e.jsx("path",{d:x.toCloudArrow})}),k&&w?e.jsxs(e.Fragment,{children:[e.jsx("h2",{children:"Wrong file type"}),e.jsx("p",{children:"Please upload a PNG or JPG file."})]}):e.jsxs(e.Fragment,{children:[e.jsx("h2",{children:"Add church logo"}),e.jsx("p",{children:"Use a high-quality image (up to 20mb) with a transparent background."})]})]})]})}})]}),e.jsxs("div",{className:"pco-org-avatar__dialog-actions",children:[a&&e.jsx(A.Button,{label:"Delete logo",kind:"delete",onClick:U,loading:d,disabled:d||c,className:"pco-org-avatar__dialog-delete"}),e.jsx(A.Button,{type:"button",label:"Cancel",onClick:()=>v.current?.close(),disabled:c||d}),e.jsx(A.Button,{type:"submit",label:"Update logo",kind:"primary",loading:c,disabled:!s||c||d})]})]})}),document.body)]})}function E({avatarUrl:a,darkModeAvatarUrl:o,orgName:t,onAvatarUpdate:r,pcoEnv:l,readOnly:j,showDarkModeAvatar:s=!1}){const[g,c]=i.useState(a),[_,d]=i.useState(o),f=(u,p)=>{u==="avatar"?(c(p),r?.("avatar",p)):u==="dark_mode_avatar"&&(d(p),r?.("dark_mode_avatar",p))},b=_||g;return e.jsxs("div",{className:"pco-org-avatars",children:[e.jsx(S,{avatarUrl:g,organization:t,mode:"avatar",pcoEnv:l,readOnly:j,onAvatarUpdate:f}),s&&e.jsx(S,{avatarUrl:b,organization:t,mode:"dark_mode_avatar",pcoEnv:l,readOnly:j,onAvatarUpdate:f})]})}exports.OrganizationAvatars=E;
package/dist/index.js CHANGED
@@ -1,22 +1,22 @@
1
1
  import { jsxs as n, Fragment as f, jsx as e } from "react/jsx-runtime";
2
- import { useState as v, useId as O, useRef as P, useEffect as T } from "react";
2
+ import { useState as _, useId as O, useRef as P, useEffect as T } from "react";
3
3
  import { createPortal as L } from "react-dom";
4
4
  import { pcoApiUrl as I } from "@planningcenter/url";
5
5
  import { Button as z } from "@planningcenter/tapestry";
6
6
  import { pencil as x, smallX as E, exclamationTriangle as W, toCloudArrow as q } from "@planningcenter/icons/paths/general";
7
7
  import { image as G } from "@planningcenter/icons/paths/services";
8
8
  import J from "react-dropzone";
9
- function R(a) {
9
+ function M(a) {
10
10
  var o, r, t = "";
11
11
  if (typeof a == "string" || typeof a == "number") t += a;
12
12
  else if (typeof a == "object") if (Array.isArray(a)) {
13
- var d = a.length;
14
- for (o = 0; o < d; o++) a[o] && (r = R(a[o])) && (t && (t += " "), t += r);
13
+ var c = a.length;
14
+ for (o = 0; o < c; o++) a[o] && (r = M(a[o])) && (t && (t += " "), t += r);
15
15
  } else for (r in a) a[r] && (t && (t += " "), t += r);
16
16
  return t;
17
17
  }
18
18
  function X() {
19
- for (var a, o, r = 0, t = "", d = arguments.length; r < d; r++) (a = arguments[r]) && (o = R(a)) && (t && (t += " "), t += o);
19
+ for (var a, o, r = 0, t = "", c = arguments.length; r < c; r++) (a = arguments[r]) && (o = M(a)) && (t && (t += " "), t += o);
20
20
  return t;
21
21
  }
22
22
  function H() {
@@ -37,21 +37,21 @@ function D({
37
37
  organization: o,
38
38
  mode: r,
39
39
  pcoEnv: t,
40
- readOnly: d,
41
- onAvatarUpdate: _
40
+ readOnly: c,
41
+ onAvatarUpdate: b
42
42
  }) {
43
- const [l, u] = v(null), [s, y] = v(!1), [h, b] = v(!1), [A, p] = v(""), c = O(), N = P(null), w = Q(r), M = (g) => {
44
- const [i] = g;
45
- i && u(
43
+ const [l, p] = _(null), [d, w] = _(!1), [s, y] = _(!1), [N, h] = _(""), g = O(), m = P(null), k = Q(r), R = (u) => {
44
+ const [i] = u;
45
+ i && p(
46
46
  Object.assign(i, {
47
47
  preview: URL.createObjectURL(i)
48
48
  })
49
49
  );
50
50
  };
51
51
  T(() => () => {
52
- l?.preview && (URL.revokeObjectURL(l.preview), p(""));
52
+ l?.preview && (URL.revokeObjectURL(l.preview), h(""));
53
53
  }, [l]);
54
- const U = async (g) => {
54
+ const U = async (u) => {
55
55
  const i = await fetch(I("accounts", { env: t }), {
56
56
  method: "PATCH",
57
57
  headers: {
@@ -61,44 +61,44 @@ function D({
61
61
  },
62
62
  body: JSON.stringify({
63
63
  data: {
64
- attributes: g
64
+ attributes: u
65
65
  }
66
66
  })
67
- }), m = await i.json();
68
- if (!i.ok) throw m;
69
- return m;
70
- }, S = async (g) => {
71
- if (g.preventDefault(), !(!l || s || h)) {
72
- y(!0);
67
+ }), v = await i.json();
68
+ if (!i.ok) throw v;
69
+ return v;
70
+ }, S = async (u) => {
71
+ if (u.preventDefault(), !(!l || d || s)) {
72
+ w(!0);
73
73
  try {
74
- const i = new FileReader(), m = await new Promise((k, C) => {
75
- i.onloadend = () => k(i.result), i.onerror = C, i.readAsDataURL(l);
74
+ const i = new FileReader(), v = await new Promise((C, A) => {
75
+ i.onloadend = () => C(i.result), i.onerror = A, i.readAsDataURL(l);
76
76
  }), j = await U({
77
- [r]: m,
77
+ [r]: v,
78
78
  [`${r}_cache`]: ""
79
79
  });
80
- u(null), _(r, j.data.attributes[r].url), N.current?.close();
80
+ p(null), b(r, j.data.attributes[r].url), m.current?.close();
81
81
  } catch {
82
- p("We were unable to save your avatar.");
82
+ h("We were unable to save your avatar.");
83
83
  } finally {
84
- y(!1);
84
+ w(!1);
85
85
  }
86
86
  }
87
87
  }, F = async () => {
88
- if (!(s || h)) {
89
- b(!0);
88
+ if (!(d || s)) {
89
+ y(!0);
90
90
  try {
91
91
  await U({
92
92
  [`remove_${r}`]: "1"
93
- }), _(r, ""), N.current?.close();
93
+ }), b(r, ""), m.current?.close();
94
94
  } catch {
95
- p("We were unable to delete your avatar.");
95
+ h("We were unable to delete your avatar.");
96
96
  } finally {
97
- b(!1);
97
+ y(!1);
98
98
  }
99
99
  }
100
100
  }, B = () => {
101
- u(null), p("");
101
+ p(null), h("");
102
102
  };
103
103
  return /* @__PURE__ */ n(f, { children: [
104
104
  /* @__PURE__ */ n("div", { className: "pco-org-avatar", children: [
@@ -106,10 +106,9 @@ function D({
106
106
  "button",
107
107
  {
108
108
  type: "button",
109
- commandfor: c,
110
- command: "show-modal",
111
- disabled: d,
112
- className: `pco-org-avatar__button pco-org-avatar__button--${w}`,
109
+ onClick: () => m.current?.showModal(),
110
+ disabled: c,
111
+ className: `pco-org-avatar__button pco-org-avatar__button--${k}`,
113
112
  children: a ? /* @__PURE__ */ n(f, { children: [
114
113
  /* @__PURE__ */ e("img", { src: a, alt: `Church logo for ${o}` }),
115
114
  /* @__PURE__ */ e("div", { className: "tds-btn tds-btn--interaction tds-btn--icononly", children: /* @__PURE__ */ e(
@@ -150,7 +149,7 @@ function D({
150
149
  }
151
150
  ),
152
151
  /* @__PURE__ */ n("div", { className: "pco-org-avatar__label", children: [
153
- K(w),
152
+ K(k),
154
153
  " mode"
155
154
  ] })
156
155
  ] }),
@@ -158,23 +157,22 @@ function D({
158
157
  /* @__PURE__ */ e(
159
158
  "dialog",
160
159
  {
161
- id: c,
162
- ref: N,
160
+ id: g,
161
+ ref: m,
163
162
  className: "pco-org-avatar__dialog",
164
163
  onClose: B,
165
164
  children: /* @__PURE__ */ n("form", { onSubmit: S, children: [
166
165
  /* @__PURE__ */ n("div", { className: "pco-org-avatar__dialog-header", children: [
167
166
  /* @__PURE__ */ n("h1", { className: "pco-org-avatar__dialog-title", children: [
168
167
  "Church logo — ",
169
- w,
168
+ k,
170
169
  " mode"
171
170
  ] }),
172
171
  /* @__PURE__ */ e(
173
172
  "button",
174
173
  {
175
174
  type: "button",
176
- commandfor: c,
177
- command: "close",
175
+ onClick: () => m.current?.close(),
178
176
  className: "pco-org-avatar__dialog-close",
179
177
  "aria-label": "Close modal",
180
178
  children: /* @__PURE__ */ e(
@@ -192,7 +190,7 @@ function D({
192
190
  )
193
191
  ] }),
194
192
  /* @__PURE__ */ n("div", { className: "pco-org-avatar__dialog-body", children: [
195
- A && /* @__PURE__ */ n("div", { role: "alert", className: "pco-org-avatar__dialog-alert", children: [
193
+ N && /* @__PURE__ */ n("div", { role: "alert", className: "pco-org-avatar__dialog-alert", children: [
196
194
  /* @__PURE__ */ e(
197
195
  "svg",
198
196
  {
@@ -204,33 +202,33 @@ function D({
204
202
  children: /* @__PURE__ */ e("path", { d: W })
205
203
  }
206
204
  ),
207
- /* @__PURE__ */ e("p", { children: A })
205
+ /* @__PURE__ */ e("p", { children: N })
208
206
  ] }),
209
207
  /* @__PURE__ */ e(
210
208
  J,
211
209
  {
212
210
  accept: { "image/*": [".jpg", ".jpeg", ".png"] },
213
211
  multiple: !1,
214
- onDropAccepted: M,
212
+ onDropAccepted: R,
215
213
  children: ({
216
- getRootProps: g,
214
+ getRootProps: u,
217
215
  getInputProps: i,
218
- isFocused: m,
216
+ isFocused: v,
219
217
  isDragAccept: j,
220
- isDragReject: k,
221
- isDragActive: C
218
+ isDragReject: C,
219
+ isDragActive: A
222
220
  }) => {
223
221
  const $ = X(
224
222
  "pco-org-avatar__dialog-dropzone",
225
- `pco-org-avatar__dialog-dropzone--${w}`,
223
+ `pco-org-avatar__dialog-dropzone--${k}`,
226
224
  {
227
225
  "pco-org-avatar__dialog-dropzone--image": l || a,
228
- "pco-org-avatar__dialog-dropzone--focused": m,
226
+ "pco-org-avatar__dialog-dropzone--focused": v,
229
227
  "pco-org-avatar__dialog-dropzone--accepted": j,
230
- "pco-org-avatar__dialog-dropzone--rejected": C && k
228
+ "pco-org-avatar__dialog-dropzone--rejected": A && C
231
229
  }
232
230
  );
233
- return /* @__PURE__ */ n("div", { ...g({ className: $ }), children: [
231
+ return /* @__PURE__ */ n("div", { ...u({ className: $ }), children: [
234
232
  /* @__PURE__ */ e("input", { ...i() }),
235
233
  l ? /* @__PURE__ */ e(
236
234
  "img",
@@ -255,7 +253,7 @@ function D({
255
253
  children: /* @__PURE__ */ e("path", { d: q })
256
254
  }
257
255
  ),
258
- C && k ? /* @__PURE__ */ n(f, { children: [
256
+ A && C ? /* @__PURE__ */ n(f, { children: [
259
257
  /* @__PURE__ */ e("h2", { children: "Wrong file type" }),
260
258
  /* @__PURE__ */ e("p", { children: "Please upload a PNG or JPG file." })
261
259
  ] }) : /* @__PURE__ */ n(f, { children: [
@@ -275,8 +273,8 @@ function D({
275
273
  label: "Delete logo",
276
274
  kind: "delete",
277
275
  onClick: F,
278
- loading: h,
279
- disabled: h || s,
276
+ loading: s,
277
+ disabled: s || d,
280
278
  className: "pco-org-avatar__dialog-delete"
281
279
  }
282
280
  ),
@@ -285,9 +283,8 @@ function D({
285
283
  {
286
284
  type: "button",
287
285
  label: "Cancel",
288
- commandfor: c,
289
- command: "close",
290
- disabled: s || h
286
+ onClick: () => m.current?.close(),
287
+ disabled: d || s
291
288
  }
292
289
  ),
293
290
  /* @__PURE__ */ e(
@@ -296,8 +293,8 @@ function D({
296
293
  type: "submit",
297
294
  label: "Update logo",
298
295
  kind: "primary",
299
- loading: s,
300
- disabled: !l || s || h
296
+ loading: d,
297
+ disabled: !l || d || s
301
298
  }
302
299
  )
303
300
  ] })
@@ -313,36 +310,36 @@ function ne({
313
310
  darkModeAvatarUrl: o,
314
311
  orgName: r,
315
312
  onAvatarUpdate: t,
316
- pcoEnv: d,
317
- readOnly: _,
313
+ pcoEnv: c,
314
+ readOnly: b,
318
315
  showDarkModeAvatar: l = !1
319
316
  }) {
320
- const [u, s] = v(a), [y, h] = v(
317
+ const [p, d] = _(a), [w, s] = _(
321
318
  o
322
- ), b = (p, c) => {
323
- p === "avatar" ? (s(c), t?.("avatar", c)) : p === "dark_mode_avatar" && (h(c), t?.("dark_mode_avatar", c));
319
+ ), y = (h, g) => {
320
+ h === "avatar" ? (d(g), t?.("avatar", g)) : h === "dark_mode_avatar" && (s(g), t?.("dark_mode_avatar", g));
324
321
  };
325
322
  return /* @__PURE__ */ n("div", { className: "pco-org-avatars", children: [
326
323
  /* @__PURE__ */ e(
327
324
  D,
328
325
  {
329
- avatarUrl: u,
326
+ avatarUrl: p,
330
327
  organization: r,
331
328
  mode: "avatar",
332
- pcoEnv: d,
333
- readOnly: _,
334
- onAvatarUpdate: b
329
+ pcoEnv: c,
330
+ readOnly: b,
331
+ onAvatarUpdate: y
335
332
  }
336
333
  ),
337
334
  l && /* @__PURE__ */ e(
338
335
  D,
339
336
  {
340
- avatarUrl: y || u,
337
+ avatarUrl: w || p,
341
338
  organization: r,
342
339
  mode: "dark_mode_avatar",
343
- pcoEnv: d,
344
- readOnly: _,
345
- onAvatarUpdate: b
340
+ pcoEnv: c,
341
+ readOnly: b,
342
+ onAvatarUpdate: y
346
343
  }
347
344
  )
348
345
  ] });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@planningcenter/organization-avatars",
3
- "version": "1.6.2",
3
+ "version": "1.6.3",
4
4
  "description": "Organization avatar upload components for Planning Center apps",
5
5
  "type": "module",
6
6
  "packageManager": "yarn@1.22.22",