@webority/mobile-ui 0.104.1 → 0.106.0

package/dist/canvas-kit/manifest.json

@@ -2,7 +2,7 @@
   "kind": "WeborityPhone",
   "library": {
     "name": "@webority/mobile-ui",
-    "version": "0.104.1"
+    "version": "0.106.0"
   },
   "rendererProtocolVersion": 12,
   "platform": "Phone",
@@ -1130,7 +1130,7 @@
           "name": "authenticated",
           "type": "boolean",
           "required": false,
-          "description": "Attaches the stored sign-in token to the request when no client is given.",
+          "description": "Attaches the stored sign-in token when no client is given, only for a relative address or one on the app's configured API address.",
           "default": true
         },
         {
@@ -16479,12 +16479,13 @@
           "name": "variant",
           "type": "enum",
           "enum": [
+            "flat",
             "outline",
             "soft",
             "solid"
           ],
           "required": false,
-          "description": "Soft is a light tint with a tone border, outline drops the fill, solid fills with the tone.",
+          "description": "Soft is a light tint with a tone border, flat is the soft tint with no border, outline drops the fill, solid fills with the tone.",
           "default": "soft"
         }
       ],
@@ -19543,6 +19544,8 @@
       "on-primary",
       "on-scrim",
       "on-success",
+      "on-surface-dark",
+      "on-surface-dark-muted",
       "on-warning",
       "primary",
       "primary-hover",
@@ -19558,6 +19561,8 @@
       "success-soft",
       "success-text",
       "surface",
+      "surface-dark",
+      "surface-dark-border",
       "surface-disabled",
       "surface-hover",
       "surface-inverse",
@@ -19678,6 +19683,8 @@
       "on-primary": "Text and icon colour on a solid primary fill.",
       "on-scrim": "Ink on a scrim, such as the text of an overlay.",
       "on-success": "Ink on a solid success fill.",
+      "on-surface-dark": "Text and icons on a surface-dark band.",
+      "on-surface-dark-muted": "Secondary text on a surface-dark band.",
       "on-warning": "Ink on a solid warning fill.",
       "primary": "Primary fill for buttons, selected states and borders.",
       "primary-hover": "Primary fill while a control is hovered or pressed.",
@@ -19693,6 +19700,8 @@
       "success-soft": "Soft success background of alerts and badges.",
       "success-text": "Success colour as text on a page or a soft success tint.",
       "surface": "Card and panel surface.",
+      "surface-dark": "Band that stays dark in light and dark mode, such as a site footer or a dark hero.",
+      "surface-dark-border": "Hairline border or divider on a surface-dark band.",
       "surface-disabled": "Fill of a disabled surface.",
       "surface-hover": "Wash over a surface under a pointer.",
       "surface-inverse": "Inverse band on a page, such as a dark footer or an inverse toast.",
@@ -19920,6 +19929,14 @@
         "light": "#ffffff",
         "dark": "#0f0f1a"
       },
+      "on-surface-dark": {
+        "light": "#ffffff",
+        "dark": "#ffffff"
+      },
+      "on-surface-dark-muted": {
+        "light": "#babdc7",
+        "dark": "#babdc7"
+      },
       "on-warning": {
         "light": "#0f0f1a",
         "dark": "#0f0f1a"
@@ -19980,6 +19997,14 @@
         "light": "#ffffff",
         "dark": "#1c1c26"
       },
+      "surface-dark": {
+        "light": "#071437",
+        "dark": "#071437"
+      },
+      "surface-dark-border": {
+        "light": "#2a3553",
+        "dark": "#2a3553"
+      },
       "surface-disabled": {
         "light": "#f1f1f5",
         "dark": "#1c1c26"

package/dist/canvas-kit/release.json

@@ -1,21 +1,21 @@
 {
   "name": "webority-phone",
-  "version": "0.104.1",
+  "version": "0.106.0",
   "platform": "Phone",
   "kitModuleVersion": 2,
   "rendererProtocolVersion": 12,
   "library": {
     "name": "@webority/mobile-ui",
-    "version": "0.104.1"
+    "version": "0.106.0"
   },
   "files": {
     "manifest.json": {
-      "sha256": "a2121a32b2db7235d543d02862e637597b6a329185057fd5da515d1f225f326c",
-      "bytes": 618503
+      "sha256": "27609df6039d0b01d7d1808306bbcc43aeaf24ea647dfdff91a91566bb809b95",
+      "bytes": 619423
     },
     "kit.js": {
-      "sha256": "a1069a8c219a5af38dc0217c410612b7d72289b2335f53aa0bd4cb5b6932f56b",
-      "bytes": 5926288
+      "sha256": "ba97e5c4516af670cc558ee3ab14669476df66938bc4230a8c4ca440d97b88c3",
+      "bytes": 5928074
     },
     "kit.css": {
       "sha256": "e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855",

package/lib/commonjs/components/AuthedImage/AuthedImage.meta.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.meta=void 0;var _meta=require("../../canvasKit/meta.js");const meta=exports.meta=(0,_meta.definePhoneMeta)()({name:"AuthedImage",marker:null,platforms:["phone"],acceptsChildren:!1,props:{uri:{type:"url",required:!0,description:"The address of the image."},resizeMode:{type:"enum",values:["cover","contain","stretch","repeat","center"],description:"How the image fits its box, in React Native's names; contentFit wins when both are set."},contentFit:{type:"enum",values:["cover","contain","fill","none","scale-down"],description:"How the image fits its box, in expo-image's names."},fadeDuration:{type:"number",description:"The cross-fade in milliseconds when the image appears."},headers:{type:"object",description:"Extra request headers sent with the fetch."},authenticated:{type:"boolean",default:!0,description:"Attaches the stored sign-in token to the request when no client is given."},ttlMs:{type:"number",default:6048e5,description:"How long a cached image counts as fresh, in milliseconds."},placeholder:{type:"node",description:"Shown while the image loads."},fallback:{type:"node",description:"Shown when no usable image exists."},cacheKey:{type:"string",description:"Overrides the cache key derived from the address."},blurRadius:{type:"number",description:"Blurs the image by this radius in points."},tintColor:{type:"string",description:"Paints the image in one colour, for a mask-like icon."}},omit:[],examples:[{id:"AuthedImage.cover",title:"Cover fit",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"cover"}},{id:"AuthedImage.contain",title:"Contain fit",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"contain"}},{id:"AuthedImage.blurred",title:"Blurred",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"cover",blurRadius:12}},{id:"AuthedImage.missing",title:"Image not found",props:{uri:"https://picsum.photos/id/999999/400/300",authenticated:!1,contentFit:"cover"}}],usage:{when:["Show an image that sits behind a sign-in, which the plain Image cannot fetch.","Cache the image on the device so it opens at once the next time."],whenNot:[{text:"The image is public and needs no token.",instead:"Use Image with a plain address."},{text:"The image is a person's picture.",instead:"Use Avatar."}],do:[{note:"Give the image a fixed height or aspect ratio so the layout does not jump.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/webority/400/300"}}]},{note:"Pass a fallback for the case where the image cannot load.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/webority/400/300",fallback:{component:"AppIcon",props:{name:"user"}}}}]}],dont:[{note:"Do not set one cache key for different pictures.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/id/10/400/300",cacheKey:"shared-key"}},{component:"AuthedImage",props:{uri:"https://picsum.photos/id/11/400/300",cacheKey:"shared-key"}}]},{note:"Do not send the token to a public address; turn authenticated off.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/public/400/300",authenticated:!0}}]}],a11y:["Pass an accessibility label that describes the picture when it carries meaning.","A decorative image needs no label."]}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.meta=void 0;var _meta=require("../../canvasKit/meta.js");const meta=exports.meta=(0,_meta.definePhoneMeta)()({name:"AuthedImage",marker:null,platforms:["phone"],acceptsChildren:!1,props:{uri:{type:"url",required:!0,description:"The address of the image."},resizeMode:{type:"enum",values:["cover","contain","stretch","repeat","center"],description:"How the image fits its box, in React Native's names; contentFit wins when both are set."},contentFit:{type:"enum",values:["cover","contain","fill","none","scale-down"],description:"How the image fits its box, in expo-image's names."},fadeDuration:{type:"number",description:"The cross-fade in milliseconds when the image appears."},headers:{type:"object",description:"Extra request headers sent with the fetch."},authenticated:{type:"boolean",default:!0,description:"Attaches the stored sign-in token when no client is given, only for a relative address or one on the app's configured API address."},ttlMs:{type:"number",default:6048e5,description:"How long a cached image counts as fresh, in milliseconds."},placeholder:{type:"node",description:"Shown while the image loads."},fallback:{type:"node",description:"Shown when no usable image exists."},cacheKey:{type:"string",description:"Overrides the cache key derived from the address."},blurRadius:{type:"number",description:"Blurs the image by this radius in points."},tintColor:{type:"string",description:"Paints the image in one colour, for a mask-like icon."}},omit:[],examples:[{id:"AuthedImage.cover",title:"Cover fit",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"cover"}},{id:"AuthedImage.contain",title:"Contain fit",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"contain"}},{id:"AuthedImage.blurred",title:"Blurred",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"cover",blurRadius:12}},{id:"AuthedImage.missing",title:"Image not found",props:{uri:"https://picsum.photos/id/999999/400/300",authenticated:!1,contentFit:"cover"}}],usage:{when:["Show an image that sits behind a sign-in, which the plain Image cannot fetch.","Cache the image on the device so it opens at once the next time."],whenNot:[{text:"The image is public and needs no token.",instead:"Use Image with a plain address."},{text:"The image is a person's picture.",instead:"Use Avatar."}],do:[{note:"Give the image a fixed height or aspect ratio so the layout does not jump.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/webority/400/300"}}]},{note:"Pass a fallback for the case where the image cannot load.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/webority/400/300",fallback:{component:"AppIcon",props:{name:"user"}}}}]}],dont:[{note:"Do not set one cache key for different pictures.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/id/10/400/300",cacheKey:"shared-key"}},{component:"AuthedImage",props:{uri:"https://picsum.photos/id/11/400/300",cacheKey:"shared-key"}}]},{note:"Do not send the token to a public address; turn authenticated off.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/public/400/300",authenticated:!0}}]}],a11y:["Pass an accessibility label that describes the picture when it carries meaning.","A decorative image needs no label."]}});

package/lib/commonjs/components/AuthedImage/authedImageCache.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.touchEntry=exports.setAuthedImageCacheLimit=exports.removeEntry=exports.releaseFetch=exports.readEntry=exports.isPermanentRefusal=exports.isFresh=exports.getAuthedImageCacheLimit=exports.flushAuthedImageIndex=exports.deriveCacheKey=exports.clearAuthedImageCache=exports.authedImageCacheStats=exports.acquireFetch=exports.DEFAULT_TTL_MS=exports.AuthedImageHttpError=void 0;var _mobileCore=require("@webority/mobile-core"),_expoFileSystem=require("expo-file-system"),_reactNative=require("react-native"),_hashString=require("../../utils/hashString.js");const INDEX_KEY="@webority/authed-image/v2/index",LEGACY_PREFIX="@webority/authed-image/v1/",FOLDER="authed-images",DEFAULT_BYTE_CEILING=52428800,TOUCH_PERSIST_MS=36e5,PERSIST_DELAY_MS=1e3,DEFAULT_TTL_MS=exports.DEFAULT_TTL_MS=6048e5;let byteCeiling=52428800;const setAuthedImageCacheLimit=e=>{if(!Number.isFinite(e)||e<=0)throw new Error(`[@webority/mobile-ui] setAuthedImageCacheLimit() needs a positive number of bytes, received ${String(e)}. Pass e.g. 50 * 1024 * 1024 for 50 MB.`);byteCeiling=e};exports.setAuthedImageCacheLimit=setAuthedImageCacheLimit;const getAuthedImageCacheLimit=()=>byteCeiling;exports.getAuthedImageCacheLimit=getAuthedImageCacheLimit;const deriveCacheKey=(e,t)=>(0,_hashString.hashString)(t??e);exports.deriveCacheKey=deriveCacheKey;const imageFile=e=>new _expoFileSystem.File(_expoFileSystem.Paths.cache,FOLDER,e),toMeta=({fetchedAt:e,bytes:t,contentType:s,lastAccessedAt:r})=>({fetchedAt:e,bytes:t,contentType:s,lastAccessedAt:r});let index=null,indexBytes=0,indexLoad=null,persistTimer=null,persistTarget=null,appStateSub=null;const persistIndex=async e=>{if(!(0,_mobileCore.isStorageAvailable)())return;const t={};for(const[s,r]of e)t[s]={...r,persistedAccessAt:r.lastAccessedAt};if(await _mobileCore.Storage.setItem(INDEX_KEY,JSON.stringify(t)))for(const t of e.values())t.persistedAccessAt=t.lastAccessedAt},schedulePersist=e=>{persistTarget=e,null===appStateSub&&(appStateSub=_reactNative.AppState.addEventListener("change",e=>{"active"!==e&&flushAuthedImageIndex()})),null===persistTimer&&(persistTimer=setTimeout(()=>{flushAuthedImageIndex()},1e3))},flushAuthedImageIndex=async()=>{null!==persistTimer&&(clearTimeout(persistTimer),persistTimer=null);const e=persistTarget;persistTarget=null,null!==e&&await persistIndex(e)};exports.flushAuthedImageIndex=flushAuthedImageIndex;const removeLegacyEntries=async()=>{const e=(await _mobileCore.Storage.getAllKeys()).filter(e=>e.startsWith(LEGACY_PREFIX));e.length>0&&await _mobileCore.Storage.multiRemove(e)},removeOrphanFiles=e=>{try{const t=new _expoFileSystem.Directory(_expoFileSystem.Paths.cache,FOLDER);if(!t.exists)return;const s=new Set([...e.values()].map(e=>imageFile(e.fileName).uri));for(const e of t.list())s.has(e.uri)||e.delete()}catch(e){_mobileCore.Logger.warn("[AuthedImage] could not tidy the image cache folder",e)}},readStoredIndex=async()=>{const e=new Map;if(!(0,_mobileCore.isStorageAvailable)())return e;const t=await _mobileCore.Storage.getItem(INDEX_KEY);if(!t)return await removeLegacyEntries(),e;try{for(const[s,r]of Object.entries(JSON.parse(t)))e.set(s,r)}catch{}return e},loadIndex=()=>index?Promise.resolve(index):(indexLoad||(indexLoad=readStoredIndex().then(e=>(removeOrphanFiles(e),index=e,indexBytes=[...e.values()].reduce((e,t)=>e+t.bytes,0),e)).finally(()=>{indexLoad=null})),indexLoad),deleteFile=e=>{try{const t=imageFile(e);t.exists&&t.delete()}catch(e){_mobileCore.Logger.warn("[AuthedImage] could not delete a cached image file",e)}},readEntry=async e=>{const t=await loadIndex(),s=t.get(e);if(!s)return null;const r=imageFile(s.fileName);return r.exists?{fileUri:r.uri,meta:toMeta(s)}:(t.delete(e),indexBytes-=s.bytes,schedulePersist(t),null)};exports.readEntry=readEntry;const removeEntry=async e=>{const t=await loadIndex(),s=t.get(e);s&&(t.delete(e),indexBytes-=s.bytes,deleteFile(s.fileName),schedulePersist(t))};exports.removeEntry=removeEntry;class AuthedImageHttpError extends Error{constructor(e,t){super(e),this.name="AuthedImageHttpError",this.status=t}}exports.AuthedImageHttpError=AuthedImageHttpError;const isPermanentRefusal=e=>e instanceof AuthedImageHttpError&&e.status>=400&&e.status<500&&408!==e.status&&429!==e.status;exports.isPermanentRefusal=isPermanentRefusal;const isFresh=(e,t,s=Date.now())=>s-e.fetchedAt<t;exports.isFresh=isFresh;const touchEntry=async e=>{const t=await loadIndex(),s=t.get(e);s&&(s.lastAccessedAt=Date.now(),s.lastAccessedAt-s.persistedAccessAt>=36e5&&schedulePersist(t))};exports.touchEntry=touchEntry;const evictIfNeeded=e=>{let t=indexBytes;if(t<=byteCeiling)return 0;const s=[...e].sort(([,e],[,t])=>e.lastAccessedAt-t.lastAccessedAt);let r=0;for(const[i,a]of s){if(t<=byteCeiling)break;e.delete(i),indexBytes-=a.bytes,deleteFile(a.fileName),t-=a.bytes,r+=1}return r},clearAuthedImageCache=async()=>{null!==persistTimer&&(clearTimeout(persistTimer),persistTimer=null),persistTarget=null;(await loadIndex()).clear(),indexBytes=0;const e=new _expoFileSystem.Directory(_expoFileSystem.Paths.cache,FOLDER);e.exists&&e.delete(),(0,_mobileCore.isStorageAvailable)()&&await _mobileCore.Storage.removeItem(INDEX_KEY)};exports.clearAuthedImageCache=clearAuthedImageCache;const authedImageCacheStats=async()=>{const e=await loadIndex();let t=0;for(const s of e.values())t+=s.bytes;return{entries:e.size,bytes:t}};exports.authedImageCacheStats=authedImageCacheStats;const responseHeader=(e,t)=>{if(!e||"object"!=typeof e)return;const s=e.get,r="function"==typeof s?s.call(e,t):e[t];return"string"==typeof r?r:void 0},fetchAndStore=async(e,t,s)=>{const r={Accept:"image/*",...t.headers};if(!t.client&&t.authenticated){const e=await(0,_mobileCore.getToken)(_mobileCore.ACCESS_TOKEN_KEY);e?.token&&(r.Authorization=`Bearer ${e.token}`)}const i=t.client??_mobileCore.publicClient;let a;try{a=await i.get(t.uri,{headers:r,responseType:"arraybuffer",signal:s})}catch(e){const s=e?.response?.status;if("number"!=typeof s)throw e;throw new AuthedImageHttpError(`[@webority/mobile-ui] AuthedImage could not load "${t.uri}": the server answered ${s}. Check the URL and whether the request needs to be signed in (pass the signed-in client as \`client\`, or authenticated={false} for public media).`,s)}const o=new Uint8Array(a.data??new ArrayBuffer(0)),n=responseHeader(a.headers,"content-type"),c=(n?n.split(";")[0].trim():"")||"image/jpeg",l=await loadIndex(),d=Date.now(),h=`${e}-${d.toString(36)}`,u=imageFile(h);try{u.create({intermediates:!0,overwrite:!0}),u.write(o)}catch(e){throw new Error(`[@webority/mobile-ui] AuthedImage fetched "${t.uri}" but could not write it to the app's cache folder: ${e instanceof Error?e.message:String(e)}. The device may be out of storage.`)}const m={fetchedAt:d,bytes:o.byteLength,contentType:c,lastAccessedAt:d,fileName:h,persistedAccessAt:d},g=l.get(e);g&&(indexBytes-=g.bytes),l.set(e,m),indexBytes+=m.bytes,g&&g.fileName!==h&&deleteFile(g.fileName);const p=evictIfNeeded(l);return schedulePersist(l),p>0&&_mobileCore.Logger.info(`[AuthedImage] evicted ${p} cached image(s) over the byte ceiling`),{fileUri:u.uri,meta:toMeta(m)}},inFlight=new Map,acquireFetch=(e,t)=>{const s=inFlight.get(e);if(s)return s.waiters+=1,s;const r=new AbortController,i={controller:r,waiters:1,promise:Promise.resolve()};return i.promise=fetchAndStore(e,t,r.signal).finally(()=>{inFlight.get(e)===i&&inFlight.delete(e)}),inFlight.set(e,i),i};exports.acquireFetch=acquireFetch;const releaseFetch=(e,t)=>{t.waiters-=1,t.waiters>0||(inFlight.get(e)===t&&inFlight.delete(e),t.controller.abort())};exports.releaseFetch=releaseFetch;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.touchEntry=exports.setAuthedImageCacheLimit=exports.removeEntry=exports.releaseFetch=exports.readEntry=exports.isPermanentRefusal=exports.isFresh=exports.getAuthedImageCacheLimit=exports.flushAuthedImageIndex=exports.deriveCacheKey=exports.clearAuthedImageCache=exports.authedImageCacheStats=exports.acquireFetch=exports.DEFAULT_TTL_MS=exports.AuthedImageHttpError=void 0;var _mobileCore=require("@webority/mobile-core"),_expoFileSystem=require("expo-file-system"),_reactNative=require("react-native"),_hashString=require("../../utils/hashString.js");const INDEX_KEY="@webority/authed-image/v2/index",LEGACY_PREFIX="@webority/authed-image/v1/",FOLDER="authed-images",DEFAULT_BYTE_CEILING=52428800,TOUCH_PERSIST_MS=36e5,PERSIST_DELAY_MS=1e3,DEFAULT_TTL_MS=exports.DEFAULT_TTL_MS=6048e5;let byteCeiling=52428800;const setAuthedImageCacheLimit=e=>{if(!Number.isFinite(e)||e<=0)throw new Error(`[@webority/mobile-ui] setAuthedImageCacheLimit() needs a positive number of bytes, received ${String(e)}. Pass e.g. 50 * 1024 * 1024 for 50 MB.`);byteCeiling=e};exports.setAuthedImageCacheLimit=setAuthedImageCacheLimit;const getAuthedImageCacheLimit=()=>byteCeiling;exports.getAuthedImageCacheLimit=getAuthedImageCacheLimit;const deriveCacheKey=(e,t)=>(0,_hashString.hashString)(t??e);exports.deriveCacheKey=deriveCacheKey;const imageFile=e=>new _expoFileSystem.File(_expoFileSystem.Paths.cache,FOLDER,e),toMeta=({fetchedAt:e,bytes:t,contentType:r,lastAccessedAt:s})=>({fetchedAt:e,bytes:t,contentType:r,lastAccessedAt:s});let index=null,indexBytes=0,indexLoad=null,persistTimer=null,persistTarget=null,appStateSub=null;const persistIndex=async e=>{if(!(0,_mobileCore.isStorageAvailable)())return;const t={};for(const[r,s]of e)t[r]={...s,persistedAccessAt:s.lastAccessedAt};if(await _mobileCore.Storage.setItem(INDEX_KEY,JSON.stringify(t)))for(const t of e.values())t.persistedAccessAt=t.lastAccessedAt},schedulePersist=e=>{persistTarget=e,null===appStateSub&&(appStateSub=_reactNative.AppState.addEventListener("change",e=>{"active"!==e&&flushAuthedImageIndex()})),null===persistTimer&&(persistTimer=setTimeout(()=>{flushAuthedImageIndex()},1e3))},flushAuthedImageIndex=async()=>{null!==persistTimer&&(clearTimeout(persistTimer),persistTimer=null);const e=persistTarget;persistTarget=null,null!==e&&await persistIndex(e)};exports.flushAuthedImageIndex=flushAuthedImageIndex;const removeLegacyEntries=async()=>{const e=(await _mobileCore.Storage.getAllKeys()).filter(e=>e.startsWith(LEGACY_PREFIX));e.length>0&&await _mobileCore.Storage.multiRemove(e)},removeOrphanFiles=e=>{try{const t=new _expoFileSystem.Directory(_expoFileSystem.Paths.cache,FOLDER);if(!t.exists)return;const r=new Set([...e.values()].map(e=>imageFile(e.fileName).uri));for(const e of t.list())r.has(e.uri)||e.delete()}catch(e){_mobileCore.Logger.warn("[AuthedImage] could not tidy the image cache folder",e)}},readStoredIndex=async()=>{const e=new Map;if(!(0,_mobileCore.isStorageAvailable)())return e;const t=await _mobileCore.Storage.getItem(INDEX_KEY);if(!t)return await removeLegacyEntries(),e;try{for(const[r,s]of Object.entries(JSON.parse(t)))e.set(r,s)}catch{}return e},loadIndex=()=>index?Promise.resolve(index):(indexLoad||(indexLoad=readStoredIndex().then(e=>(removeOrphanFiles(e),index=e,indexBytes=[...e.values()].reduce((e,t)=>e+t.bytes,0),e)).finally(()=>{indexLoad=null})),indexLoad),deleteFile=e=>{try{const t=imageFile(e);t.exists&&t.delete()}catch(e){_mobileCore.Logger.warn("[AuthedImage] could not delete a cached image file",e)}},readEntry=async e=>{const t=await loadIndex(),r=t.get(e);if(!r)return null;const s=imageFile(r.fileName);return s.exists?{fileUri:s.uri,meta:toMeta(r)}:(t.delete(e),indexBytes-=r.bytes,schedulePersist(t),null)};exports.readEntry=readEntry;const removeEntry=async e=>{const t=await loadIndex(),r=t.get(e);r&&(t.delete(e),indexBytes-=r.bytes,deleteFile(r.fileName),schedulePersist(t))};exports.removeEntry=removeEntry;class AuthedImageHttpError extends Error{constructor(e,t){super(e),this.name="AuthedImageHttpError",this.status=t}}exports.AuthedImageHttpError=AuthedImageHttpError;const isPermanentRefusal=e=>e instanceof AuthedImageHttpError&&e.status>=400&&e.status<500&&408!==e.status&&429!==e.status;exports.isPermanentRefusal=isPermanentRefusal;const isFresh=(e,t,r=Date.now())=>r-e.fetchedAt<t;exports.isFresh=isFresh;const touchEntry=async e=>{const t=await loadIndex(),r=t.get(e);r&&(r.lastAccessedAt=Date.now(),r.lastAccessedAt-r.persistedAccessAt>=36e5&&schedulePersist(t))};exports.touchEntry=touchEntry;const evictIfNeeded=e=>{let t=indexBytes;if(t<=byteCeiling)return 0;const r=[...e].sort(([,e],[,t])=>e.lastAccessedAt-t.lastAccessedAt);let s=0;for(const[i,a]of r){if(t<=byteCeiling)break;e.delete(i),indexBytes-=a.bytes,deleteFile(a.fileName),t-=a.bytes,s+=1}return s},clearAuthedImageCache=async()=>{null!==persistTimer&&(clearTimeout(persistTimer),persistTimer=null),persistTarget=null;(await loadIndex()).clear(),indexBytes=0;const e=new _expoFileSystem.Directory(_expoFileSystem.Paths.cache,FOLDER);e.exists&&e.delete(),(0,_mobileCore.isStorageAvailable)()&&await _mobileCore.Storage.removeItem(INDEX_KEY)};exports.clearAuthedImageCache=clearAuthedImageCache;const authedImageCacheStats=async()=>{const e=await loadIndex();let t=0;for(const r of e.values())t+=r.bytes;return{entries:e.size,bytes:t}};exports.authedImageCacheStats=authedImageCacheStats;const responseHeader=(e,t)=>{if(!e||"object"!=typeof e)return;const r=e.get,s="function"==typeof r?r.call(e,t):e[t];return"string"==typeof s?s:void 0},originOf=e=>{const t=/^([a-z][a-z0-9+.-]*:\/\/[^/?#]+)/i.exec(e);return t?t[1].toLowerCase():null},isOwnApiAddress=e=>{const t=originOf(e);if(null===t)return!0;const r=(0,_mobileCore.getConfigValue)("baseUrl");return"string"==typeof r&&originOf(r)===t},fetchAndStore=async(e,t,r)=>{const s={Accept:"image/*",...t.headers};if(!t.client&&t.authenticated&&isOwnApiAddress(t.uri)){const e=await(0,_mobileCore.getToken)(_mobileCore.ACCESS_TOKEN_KEY);e?.token&&(s.Authorization=`Bearer ${e.token}`)}const i=t.client??_mobileCore.publicClient;let a;try{a=await i.get(t.uri,{headers:s,responseType:"arraybuffer",signal:r})}catch(e){const r=e?.response?.status;if("number"!=typeof r)throw e;throw new AuthedImageHttpError(`[@webority/mobile-ui] AuthedImage could not load "${t.uri}": the server answered ${r}. Check the URL and whether the request needs to be signed in (pass the signed-in client as \`client\`, or authenticated={false} for public media).`,r)}const o=new Uint8Array(a.data??new ArrayBuffer(0)),n=responseHeader(a.headers,"content-type"),c=(n?n.split(";")[0].trim():"")||"image/jpeg",l=await loadIndex(),d=Date.now(),u=`${e}-${d.toString(36)}`,h=imageFile(u);try{h.create({intermediates:!0,overwrite:!0}),h.write(o)}catch(e){throw new Error(`[@webority/mobile-ui] AuthedImage fetched "${t.uri}" but could not write it to the app's cache folder: ${e instanceof Error?e.message:String(e)}. The device may be out of storage.`)}const m={fetchedAt:d,bytes:o.byteLength,contentType:c,lastAccessedAt:d,fileName:u,persistedAccessAt:d},g=l.get(e);g&&(indexBytes-=g.bytes),l.set(e,m),indexBytes+=m.bytes,g&&g.fileName!==u&&deleteFile(g.fileName);const p=evictIfNeeded(l);return schedulePersist(l),p>0&&_mobileCore.Logger.info(`[AuthedImage] evicted ${p} cached image(s) over the byte ceiling`),{fileUri:h.uri,meta:toMeta(m)}},inFlight=new Map,acquireFetch=(e,t)=>{const r=inFlight.get(e);if(r)return r.waiters+=1,r;const s=new AbortController,i={controller:s,waiters:1,promise:Promise.resolve()};return i.promise=fetchAndStore(e,t,s.signal).finally(()=>{inFlight.get(e)===i&&inFlight.delete(e)}),inFlight.set(e,i),i};exports.acquireFetch=acquireFetch;const releaseFetch=(e,t)=>{t.waiters-=1,t.waiters>0||(inFlight.get(e)===t&&inFlight.delete(e),t.controller.abort())};exports.releaseFetch=releaseFetch;

package/lib/commonjs/components/StatusBadge/StatusBadge.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.StatusBadge=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_toneInk=require("../../theme/toneInk.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_index2=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const sizeMap={sm:{height:22,paddingX:"sm",text:"xs",dot:5,gap:"xs"},md:{height:24,paddingX:"md",text:"sm",dot:6,gap:"xs"}},sizeFor=(e,t)=>{const s=sizeMap[t];return{height:s.height,paddingH:e.space[s.paddingX],fontSize:e.text[s.text].size,dot:s.dot,gap:e.space[s.gap]}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{const{colors:s}=e;switch(t){case"success":return{base:s.success,on:s["on-success"],ink:s["success-text"]};case"warning":return{base:s.warning,on:s["on-warning"],ink:s["warning-text"]};case"danger":return{base:s.danger,on:s["on-danger"],ink:s["danger-text"]};case"info":return{base:s.info,on:s["on-info"],ink:s["info-text"]};case"primary":return{base:s.primary,on:s["on-primary"],ink:s["primary-text"]};default:return{base:s["text-muted"],on:s["on-neutral-strong"],ink:s["text-muted"]}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,s,r)=>{const n=isHex(r),{base:i,on:o,ink:a}=n?{base:r,on:e.colors["text-inverse"],ink:(0,_toneInk.deriveToneInk)(r,[e.colors.bg,e.colors["bg-subtle"],e.colors["bg-muted"]],e.mode)}:toneFor(e,t),l=!n&&"neutral"===t,d=l?e.colors["bg-muted"]:(0,_color.tintOf)(i,.14,e.colors["bg-subtle"]),u=l?e.colors.border:(0,_color.tintOf)(i,.4,i);switch(s){case"solid":return{fill:i,border:i,text:o,dot:o};case"outline":return{fill:"transparent",border:l?u:i,text:a,dot:i};default:return{fill:d,border:u,text:a,dot:i}}},StatusBadge=exports.StatusBadge=(0,_react.forwardRef)((e,t)=>{const{label:s,tone:r="neutral",variant:n="soft",size:i="md",dot:o=!1,color:a,loading:l=!1,accessibilityLabel:d,style:u,textStyle:c,testID:g}=e,x=(0,_index.useTheme)(),b=sizeFor(x,i),m=(0,_react.useMemo)(()=>paletteFor(x,r,n,a),[x,r,n,a]);return l?(0,_jsxRuntime.jsx)(StatusBadgeSkeleton,{...e}):(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:d??s,testID:g,style:[styles.base,{minHeight:b.height,paddingHorizontal:b.paddingH,borderRadius:x.radius.pill,..._corners.smoothCorners,backgroundColor:m.fill,borderColor:m.border,borderWidth:1},u],children:[o?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:"status-badge-dot",style:{width:b.dot,height:b.dot,borderRadius:b.dot/2,marginRight:b.gap,backgroundColor:m.dot}}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.label,{color:m.text,fontSize:b.fontSize,...(0,_index.fontFor)(x,"semibold")},c],numberOfLines:1,maxFontSizeMultiplier:x.settings.maxFontSizeMultiplier,children:s})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:s,style:r})=>{const n=(0,_index.useTheme)(),i=sizeFor(n,t),o=Math.max(32,Math.min(120,6.5*(e??"").length))+2*i.paddingH+(s?i.dot+i.gap:0);return(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:o,height:i.height,radius:i.height/2,style:[styles.skeleton,r]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=_reactNative.StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});var _default=exports.default=StatusBadge;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.StatusBadge=void 0;var _react=require("react"),_reactNative=require("react-native"),_index=require("../../theme/index.js"),_toneInk=require("../../theme/toneInk.js"),_color=require("../../utils/color.js"),_corners=require("../../utils/corners.js"),_index2=require("../Skeleton/index.js"),_jsxRuntime=require("react/jsx-runtime");const sizeMap={sm:{height:22,paddingX:"sm",text:"xs",dot:5,gap:"xs"},md:{height:24,paddingX:"md",text:"sm",dot:6,gap:"xs"}},sizeFor=(e,t)=>{const r=sizeMap[t];return{height:r.height,paddingH:e.space[r.paddingX],fontSize:e.text[r.text].size,dot:r.dot,gap:e.space[r.gap]}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{const{colors:r}=e;switch(t){case"success":return{base:r.success,on:r["on-success"],ink:r["success-text"]};case"warning":return{base:r.warning,on:r["on-warning"],ink:r["warning-text"]};case"danger":return{base:r.danger,on:r["on-danger"],ink:r["danger-text"]};case"info":return{base:r.info,on:r["on-info"],ink:r["info-text"]};case"primary":return{base:r.primary,on:r["on-primary"],ink:r["primary-text"]};default:return{base:r["text-muted"],on:r["on-neutral-strong"],ink:r["text-muted"]}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,r,s)=>{const n=isHex(s),{base:i,on:o,ink:a}=n?{base:s,on:e.colors["text-inverse"],ink:(0,_toneInk.deriveToneInk)(s,[e.colors.bg,e.colors["bg-subtle"],e.colors["bg-muted"]],e.mode)}:toneFor(e,t),l=!n&&"neutral"===t,d=l?e.colors["bg-muted"]:(0,_color.tintOf)(i,.14,e.colors["bg-subtle"]),u=l?e.colors.border:(0,_color.tintOf)(i,.4,i);switch(r){case"solid":return{fill:i,border:i,text:o,dot:o};case"outline":return{fill:"transparent",border:l?u:i,text:a,dot:i};case"flat":return{fill:d,border:"transparent",text:a,dot:i};default:return{fill:d,border:u,text:a,dot:i}}},StatusBadge=exports.StatusBadge=(0,_react.forwardRef)((e,t)=>{const{label:r,tone:s="neutral",variant:n="soft",size:i="md",dot:o=!1,color:a,loading:l=!1,accessibilityLabel:d,style:u,textStyle:c,testID:g}=e,x=(0,_index.useTheme)(),b=sizeFor(x,i),m=(0,_react.useMemo)(()=>paletteFor(x,s,n,a),[x,s,n,a]);return l?(0,_jsxRuntime.jsx)(StatusBadgeSkeleton,{...e}):(0,_jsxRuntime.jsxs)(_reactNative.View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:d??r,testID:g,style:[styles.base,{minHeight:b.height,paddingHorizontal:b.paddingH,borderRadius:x.radius.pill,..._corners.smoothCorners,backgroundColor:m.fill,borderColor:m.border,borderWidth:1},u],children:[o?(0,_jsxRuntime.jsx)(_reactNative.View,{testID:"status-badge-dot",style:{width:b.dot,height:b.dot,borderRadius:b.dot/2,marginRight:b.gap,backgroundColor:m.dot}}):null,(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.label,{color:m.text,fontSize:b.fontSize,...(0,_index.fontFor)(x,"semibold")},c],numberOfLines:1,maxFontSizeMultiplier:x.settings.maxFontSizeMultiplier,children:r})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:r,style:s})=>{const n=(0,_index.useTheme)(),i=sizeFor(n,t),o=Math.max(32,Math.min(120,6.5*(e??"").length))+2*i.paddingH+(r?i.dot+i.gap:0);return(0,_jsxRuntime.jsx)(_index2.Skeleton,{width:o,height:i.height,radius:i.height/2,style:[styles.skeleton,s]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=_reactNative.StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});var _default=exports.default=StatusBadge;

package/lib/commonjs/components/StatusBadge/StatusBadge.meta.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.meta=void 0;var _meta=require("../../canvasKit/meta.js");const meta=exports.meta=(0,_meta.definePhoneMeta)()({name:"StatusBadge",marker:null,platforms:["phone"],acceptsChildren:!1,props:{label:{type:"string",required:!0,description:"The status as the reader should see it, such as Active or Pending review."},tone:{type:"enum",values:["success","warning","danger","info","primary","neutral"],default:"neutral",description:"The semantic colour."},variant:{type:"enum",values:["soft","outline","solid"],default:"soft",description:"Soft is a light tint with a tone border, outline drops the fill, solid fills with the tone."},size:{type:"enum",values:["sm","md"],default:"md",description:"A 22 or 24 point pill."},dot:{type:"boolean",default:!1,description:"A small disc before the label in the status colour."},color:{type:"string",description:"A status colour of the app's own as six-digit hex, for a status the backend names with a colour; it wins over the tone."},loading:{type:"boolean",default:!1,description:"Draws the skeleton placeholder at the pill's footprint."},accessibilityLabel:{type:"string",description:"Read instead of the label."}},omit:[],examples:[{id:"StatusBadge.default",title:"Active with a dot",props:{label:"Active",tone:"success",dot:!0}},{id:"StatusBadge.pending",title:"Pending review",props:{label:"Pending review",tone:"warning"}},{id:"StatusBadge.rejected",title:"Rejected outline",props:{label:"Rejected",tone:"danger",variant:"outline"}},{id:"StatusBadge.archived",title:"Archived solid",props:{label:"Archived",tone:"neutral",variant:"solid",size:"sm"}}],usage:{when:["Name a record's status in a semantic colour, such as Active, Pending or Rejected."],whenNot:[{text:"A status the person taps, selects or closes.",instead:"Chip"},{text:"A count anchored to an icon.",instead:"Badge"}],do:[{note:"Map the app's status to a label and a tone in one place, and send unknown statuses to neutral.",example:[{component:"StatusBadge",props:{label:"Active",tone:"success"}}]},{note:"Keep the label short and in the reader's words.",example:[{component:"StatusBadge",props:{label:"Done",tone:"success"}}]}],dont:[{note:"Do not map an unknown status to the danger tone.",example:[{component:"StatusBadge",props:{label:"Unknown",tone:"danger"}}]},{note:"Do not rely on the tone alone to say the status; the label always says it.",example:[{component:"StatusBadge",props:{label:"Success",tone:"success"}}]}],a11y:["It reads as plain text with the label as its name, so the label must carry the status without colour.","Use accessibilityLabel only when the spoken form needs more than the label."]}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.meta=void 0;var _meta=require("../../canvasKit/meta.js");const meta=exports.meta=(0,_meta.definePhoneMeta)()({name:"StatusBadge",marker:null,platforms:["phone"],acceptsChildren:!1,props:{label:{type:"string",required:!0,description:"The status as the reader should see it, such as Active or Pending review."},tone:{type:"enum",values:["success","warning","danger","info","primary","neutral"],default:"neutral",description:"The semantic colour."},variant:{type:"enum",values:["soft","flat","outline","solid"],default:"soft",description:"Soft is a light tint with a tone border, flat is the soft tint with no border, outline drops the fill, solid fills with the tone."},size:{type:"enum",values:["sm","md"],default:"md",description:"A 22 or 24 point pill."},dot:{type:"boolean",default:!1,description:"A small disc before the label in the status colour."},color:{type:"string",description:"A status colour of the app's own as six-digit hex, for a status the backend names with a colour; it wins over the tone."},loading:{type:"boolean",default:!1,description:"Draws the skeleton placeholder at the pill's footprint."},accessibilityLabel:{type:"string",description:"Read instead of the label."}},omit:[],examples:[{id:"StatusBadge.default",title:"Active with a dot",props:{label:"Active",tone:"success",dot:!0}},{id:"StatusBadge.pending",title:"Pending review",props:{label:"Pending review",tone:"warning"}},{id:"StatusBadge.rejected",title:"Rejected outline",props:{label:"Rejected",tone:"danger",variant:"outline"}},{id:"StatusBadge.flat",title:"Active flat",props:{label:"Active",tone:"success",variant:"flat"}},{id:"StatusBadge.archived",title:"Archived solid",props:{label:"Archived",tone:"neutral",variant:"solid",size:"sm"}}],usage:{when:["Name a record's status in a semantic colour, such as Active, Pending or Rejected."],whenNot:[{text:"A status the person taps, selects or closes.",instead:"Chip"},{text:"A count anchored to an icon.",instead:"Badge"}],do:[{note:"Map the app's status to a label and a tone in one place, and send unknown statuses to neutral.",example:[{component:"StatusBadge",props:{label:"Active",tone:"success"}}]},{note:"Keep the label short and in the reader's words.",example:[{component:"StatusBadge",props:{label:"Done",tone:"success"}}]}],dont:[{note:"Do not map an unknown status to the danger tone.",example:[{component:"StatusBadge",props:{label:"Unknown",tone:"danger"}}]},{note:"Do not rely on the tone alone to say the status; the label always says it.",example:[{component:"StatusBadge",props:{label:"Success",tone:"success"}}]}],a11y:["It reads as plain text with the label as its name, so the label must carry the status without colour.","Use accessibilityLabel only when the spoken form needs more than the label."]}});

package/lib/commonjs/theme/tokens.generated.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.lightTokens=exports.darkTokens=exports.WEIGHT_NAMES=exports.TEXT_NAMES=exports.SPACE_NAMES=exports.SIZE_NAMES=exports.SHADOW_NAMES=exports.RADIUS_NAMES=exports.LETTER_SPACING_NAMES=exports.LEADING_NAMES=exports.FONT_NAMES=exports.EASE_NAMES=exports.DURATION_NAMES=exports.COMPONENT_KINDS=exports.COLOR_NAMES=void 0;const COLOR_NAMES=exports.COLOR_NAMES=["bg","bg-subtle","bg-muted","surface","surface-inverse","text","text-body","text-muted","text-subtle","text-inverse","link","border","border-subtle","field-bg","field-border","field-border-focus","focus-ring","scrim","on-scrim","thumb","primary","primary-hover","primary-soft","primary-text","on-primary","primary-wash","primary-wash-strong","neutral","neutral-hover","neutral-text","on-neutral","success","success-soft","success-text","on-success","warning","warning-soft","warning-text","on-warning","danger","danger-soft","danger-border","danger-text","on-danger","info","info-soft","info-text","on-info","primary-pressed","on-neutral-strong","text-disabled","surface-pressed","surface-hover","surface-selected","surface-disabled","skeleton","skeleton-highlight","glass-fill","glass-border","on-glass","glass-badge","field-bg-focus","field-bg-disabled","field-border-error","field-label","field-text","field-text-disabled","field-placeholder","field-placeholder-disabled","field-icon","field-icon-focus","field-icon-disabled","field-caret","field-message","avatar-1","avatar-2","avatar-3","avatar-4","avatar-5","avatar-6","avatar-7","avatar-8"],SPACE_NAMES=exports.SPACE_NAMES=["none","xxs","xs","sm","md","lg","xl","2xl","3xl","4xl"],RADIUS_NAMES=exports.RADIUS_NAMES=["none","sm","md","lg","xl","pill"],TEXT_NAMES=exports.TEXT_NAMES=["xs","sm","base","lg","xl","2xl","3xl","4xl","5xl","6xl","7xl","8xl"],WEIGHT_NAMES=exports.WEIGHT_NAMES=["normal","medium","semibold","bold"],LEADING_NAMES=exports.LEADING_NAMES=["heading","body","display"],LETTER_SPACING_NAMES=exports.LETTER_SPACING_NAMES=["tight","normal","wide"],FONT_NAMES=exports.FONT_NAMES=["ui","display","mono"],SHADOW_NAMES=exports.SHADOW_NAMES=["card","elevated","popover","modal","drawer"],DURATION_NAMES=exports.DURATION_NAMES=["instant","fast","default","slow","slower"],EASE_NAMES=exports.EASE_NAMES=["in-out","accelerate","decelerate","sharp"],SIZE_NAMES=exports.SIZE_NAMES=["border"],COMPONENT_KINDS=exports.COMPONENT_KINDS={field:{radius:"radius","padding-x":"space","padding-y":"space","min-height":"px",text:"text",icon:"px","label-text":"text","label-gap":"space","message-text":"text","message-gap":"space"},press:{opacity:"number"},disabled:{opacity:"number"},button:{"padding-x":"space","padding-y":"space","min-height":"px",text:"text",radius:"radius",icon:"px","badge-icon":"px"},input:{"multiline-min-height":"px"},"search-bar":{radius:"radius"},"empty-state":{icon:"px","title-text":"text","description-text":"text","padding-y":"space","title-gap":"space","description-gap":"space"},"list-item":{"padding-y":"space","title-text":"text","subtitle-text":"text","min-height":"px"},badge:{text:"text","min-width":"px",height:"px","padding-x":"space","dot-size":"px","border-width":"px","anchor-offset":"px"},chip:{"padding-x":"space","padding-y":"space",text:"text","min-height":"px","close-size":"px","close-text":"text",gap:"space",icon:"px"},checkbox:{"box-size":"px","label-gap":"space"},radio:{outer:"px",inner:"px","label-gap":"space"},switch:{"track-width":"px","track-height":"px","thumb-size":"px",padding:"space"},"otp-input":{cell:"px",text:"text",radius:"radius",gap:"space"},"segmented-control":{height:"px",text:"text","padding-x":"space",icon:"px","track-padding":"space","underline-height":"px","pill-inset":"space"},tabs:{text:"text","padding-y":"space","padding-x":"space","scrollable-padding-x":"space",icon:"px","icon-gap":"space","track-padding":"space","underline-height":"px","pill-inset":"space","disabled-opacity":"number","badge-gap":"space"},slider:{"track-height":"px","thumb-diameter":"px"},"floating-action-button":{diameter:"px",icon:"px",text:"text","label-padding-x":"space","edge-offset":"space","bottom-offset":"space","secondary-gap":"space","stagger-ms":"ms"},dialog:{"icon-wrapper-size":"px","action-button-min-height":"px"},toast:{"icon-circle-size":"px","icon-glyph-text":"text","tint-bar-width":"px","action-min-height":"px"},banner:{"tint-bar-width":"px"}},lightTokens=exports.lightTokens={mode:"light",colors:{bg:"#ffffff","bg-subtle":"#f8f8fb","bg-muted":"#f1f1f5",surface:"#ffffff","surface-inverse":"#0f0f1a",text:"#252f4a","text-body":"#0f0f1a","text-muted":"#52525b","text-subtle":"#62626b","text-inverse":"#ffffff",link:"#5b5bd6",border:"#e5e5ec","border-subtle":"#efeff3","field-bg":"#f9fbfc","field-border":"#ebedf3","field-border-focus":"#bed2f9","focus-ring":"#5b5bd6",scrim:"#0f0f1a80","on-scrim":"#ffffff",thumb:"#ffffff",primary:"#5b5bd6","primary-hover":"#4f4fbf","primary-soft":"#eeeefc","primary-text":"#4f4fd3","on-primary":"#ffffff","primary-wash":"#5b5bd614","primary-wash-strong":"#5b5bd633",neutral:"#f4f4f8","neutral-hover":"#e9e9f0","neutral-text":"#52525b","on-neutral":"#0f0f1a",success:"#18864f","success-soft":"#e8faee","success-text":"#147042","on-success":"#ffffff",warning:"#f59e0b","warning-soft":"#fff8e6","warning-text":"#8f5c06","on-warning":"#0f0f1a",danger:"#e12c32","danger-soft":"#ffeaef","danger-border":"#e5484d","danger-text":"#bc1b20","on-danger":"#ffffff",info:"#1b6ef5","info-soft":"#e9f3ff","info-text":"#0958d9","on-info":"#ffffff","primary-pressed":"#4040a8","on-neutral-strong":"#ffffff","text-disabled":"#b4b4bb","surface-pressed":"#0f0f1a0f","surface-hover":"#0f0f1a0a","surface-selected":"#5b5bd61a","surface-disabled":"#f1f1f5",skeleton:"#ebedf3","skeleton-highlight":"#f5f6fa","glass-fill":"#ffffff47","glass-border":"#ffffff73","on-glass":"#0f0f1a","glass-badge":"#ffffff","field-bg-focus":"#ffffff","field-bg-disabled":"#f5f6fa","field-border-error":"#fdbfce","field-label":"#242f4a","field-text":"#252f4a","field-text-disabled":"#c4cada","field-placeholder":"#626d8b","field-placeholder-disabled":"#c4cada","field-icon":"#7a849f","field-icon-focus":"#4b5675","field-icon-disabled":"#c4cada","field-caret":"#5b8dee","field-message":"#d81736","avatar-1":"#5b5bd6","avatar-2":"#0a7979","avatar-3":"#a45a05","avatar-4":"#cd226e","avatar-5":"#2462eb","avatar-6":"#7c3aed","avatar-7":"#047c57","avatar-8":"#d42222"},space:{none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius:{none:0,sm:6,md:10,lg:14,xl:20,pill:9999},text:{xs:{size:11},sm:{size:13},base:{size:15},lg:{size:17},xl:{size:20},"2xl":{size:24},"3xl":{size:30},"4xl":{size:36},"5xl":{size:45},"6xl":{size:57},"7xl":{size:64},"8xl":{size:72}},weight:{normal:"400",medium:"500",semibold:"600",bold:"700"},leading:{heading:1.2,body:1.4,display:1.2},"letter-spacing":{tight:-.2,normal:0,wide:.4},font:{ui:{},display:{},mono:{}},shadow:{card:{shadowColor:"#000000",shadowOffset:{width:0,height:2},shadowOpacity:.059,shadowRadius:4,elevation:2},elevated:{shadowColor:"#000000",shadowOffset:{width:0,height:4},shadowOpacity:.078,shadowRadius:8,elevation:4},popover:{shadowColor:"#000000",shadowOffset:{width:0,height:8},shadowOpacity:.102,shadowRadius:16,elevation:8},modal:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.141,shadowRadius:24,elevation:12},drawer:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.141,shadowRadius:24,elevation:12}},motion:{duration:{instant:80,fast:160,default:240,slow:360,slower:500},ease:{"in-out":[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]}},size:{border:1},components:{field:{sm:{radius:"md","padding-x":"sm","padding-y":"sm","min-height":38,text:"sm",icon:14,"label-text":"xs","label-gap":"xs","message-text":"xs","message-gap":"xxs"},md:{radius:"md","padding-x":"md","padding-y":"md","min-height":44,text:"base",icon:16,"label-text":"sm","label-gap":"xs","message-text":"sm","message-gap":"xxs"},lg:{radius:"md","padding-x":"lg","padding-y":"lg","min-height":52,text:"lg",icon:18,"label-text":"base","label-gap":"xs","message-text":"base","message-gap":"xxs"}},press:{opacity:.85},disabled:{opacity:.55},button:{xs:{"padding-x":"sm","padding-y":"xs","min-height":28,text:"xs",radius:"md",icon:14,"badge-icon":11},sm:{"padding-x":"md","padding-y":"xs","min-height":34,text:"sm",radius:"md",icon:16,"badge-icon":16},md:{"padding-x":"lg","padding-y":"sm","min-height":44,text:"base",radius:"md",icon:18,"badge-icon":18},lg:{"padding-x":"xl","padding-y":"md","min-height":50,text:"lg",radius:"lg",icon:20,"badge-icon":20},xl:{"padding-x":"2xl","padding-y":"md","min-height":58,text:"xl",radius:"lg",icon:22,"badge-icon":22}},input:{sm:{"multiline-min-height":72},md:{"multiline-min-height":92},lg:{"multiline-min-height":110}},"search-bar":{sm:{radius:"pill"},md:{radius:"pill"},lg:{radius:"pill"}},"empty-state":{sm:{icon:48,"title-text":"lg","description-text":"sm","padding-y":"lg","title-gap":"md","description-gap":"xs"},md:{icon:64,"title-text":"xl","description-text":"base","padding-y":"xl","title-gap":"md","description-gap":"xs"},lg:{icon:80,"title-text":"2xl","description-text":"lg","padding-y":"2xl","title-gap":"md","description-gap":"xs"}},"list-item":{sm:{"padding-y":"sm","title-text":"sm","subtitle-text":"xs","min-height":44},md:{"padding-y":"md","title-text":"base","subtitle-text":"sm","min-height":56},lg:{"padding-y":"lg","title-text":"lg","subtitle-text":"base","min-height":72}},badge:{sm:{text:"xs","min-width":16,height:16,"padding-x":"xs","dot-size":8},md:{text:"sm","min-width":20,height:20,"padding-x":"sm","dot-size":10},"border-width":1.5,"anchor-offset":4},chip:{sm:{"padding-x":"sm","padding-y":"xs",text:"xs","min-height":26,"close-size":16,"close-text":"xs",gap:"xs",icon:14},md:{"padding-x":"md","padding-y":"xs",text:"sm","min-height":32,"close-size":18,"close-text":"sm",gap:"sm",icon:16}},checkbox:{sm:{"box-size":16},md:{"box-size":20},lg:{"box-size":24},"label-gap":"sm"},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},"label-gap":"sm"},switch:{sm:{"track-width":42,"track-height":26,"thumb-size":22,padding:"xxs"},md:{"track-width":51,"track-height":31,"thumb-size":27,padding:"xxs"},lg:{"track-width":60,"track-height":36,"thumb-size":32,padding:"xxs"}},"otp-input":{sm:{cell:36,text:"base",radius:"sm",gap:"sm"},md:{cell:48,text:"xl",radius:"md",gap:"sm"},lg:{cell:56,text:"2xl",radius:"lg",gap:"md"}},"segmented-control":{sm:{height:32,text:"sm","padding-x":"sm",icon:14},md:{height:40,text:"base","padding-x":"md",icon:16},lg:{height:48,text:"lg","padding-x":"lg",icon:18},"track-padding":"xs","underline-height":2,"pill-inset":"xs"},tabs:{sm:{text:"sm","padding-y":"sm","padding-x":"xs","scrollable-padding-x":"md",icon:16},md:{text:"base","padding-y":"md","padding-x":"sm","scrollable-padding-x":"lg",icon:18},lg:{text:"lg","padding-y":"lg","padding-x":"md","scrollable-padding-x":"xl",icon:20},"icon-gap":"xs","track-padding":"xs","underline-height":2,"pill-inset":"xs","disabled-opacity":.45,"badge-gap":"xs"},slider:{sm:{"track-height":4,"thumb-diameter":24},md:{"track-height":6,"thumb-diameter":28},lg:{"track-height":8,"thumb-diameter":32}},"floating-action-button":{sm:{diameter:40,icon:18,text:"sm","label-padding-x":"md"},md:{diameter:56,icon:22,text:"base","label-padding-x":"lg"},lg:{diameter:72,icon:28,text:"lg","label-padding-x":"xl"},"edge-offset":"xl","bottom-offset":"xl","secondary-gap":"lg","stagger-ms":50},dialog:{"icon-wrapper-size":48,"action-button-min-height":44},toast:{"icon-circle-size":28,"icon-glyph-text":"lg","tint-bar-width":0,"action-min-height":30},banner:{"tint-bar-width":0}}},darkTokens=exports.darkTokens={mode:"dark",colors:{bg:"#0b0b12","bg-subtle":"#13131c","bg-muted":"#1c1c26",surface:"#1c1c26","surface-inverse":"#fafafa",text:"#e2e2e2","text-body":"#fafafa","text-muted":"#b4b4bb","text-subtle":"#919199","text-inverse":"#0f0f1a",link:"#9292ee",border:"#27272f","border-subtle":"#1c1c26","field-bg":"#13131c","field-border":"#27272f","field-border-focus":"#3d5fb0","focus-ring":"#7c7ce8",scrim:"#000000a6","on-scrim":"#ffffff",thumb:"#ffffff",primary:"#7c7ce8","primary-hover":"#9292ee","primary-soft":"#1f1f3d","primary-text":"#8989ea","on-primary":"#0f0f1a","primary-wash":"#7c7ce814","primary-wash-strong":"#7c7ce833",neutral:"#1f1f26","neutral-hover":"#2a2a33","neutral-text":"#b4b4bb","on-neutral":"#fafafa",success:"#30c780","success-soft":"#04b4402e","success-text":"#30c780","on-success":"#0f0f1a",warning:"#fbbf24","warning-soft":"#dfa0002e","warning-text":"#fbbf24","on-warning":"#0f0f1a",danger:"#f87171","danger-soft":"#e826462e","danger-border":"#f87171","danger-text":"#f87171","on-danger":"#0f0f1a",info:"#60a5fa","info-soft":"#056ee92e","info-text":"#60a5fa","on-info":"#0f0f1a","primary-pressed":"#a8a8f2","on-neutral-strong":"#0f0f1a","text-disabled":"#52525b","surface-pressed":"#ffffff14","surface-hover":"#ffffff0d","surface-selected":"#7c7ce82e","surface-disabled":"#1c1c26",skeleton:"#1c1c26","skeleton-highlight":"#27272f","glass-fill":"#ffffff47","glass-border":"#ffffff73","on-glass":"#0f0f1a","glass-badge":"#ffffff","field-bg-focus":"#0b0b12","field-bg-disabled":"#1c1c26","field-border-error":"#8a2f42","field-label":"#e4e6ee","field-text":"#fafafa","field-text-disabled":"#52525b","field-placeholder":"#84848d","field-placeholder-disabled":"#52525b","field-icon":"#8b8b95","field-icon-focus":"#d4d4db","field-icon-disabled":"#52525b","field-caret":"#7c9ef0","field-message":"#f87171","avatar-1":"#8b8bee","avatar-2":"#2dd4bf","avatar-3":"#fcd34d","avatar-4":"#f472b6","avatar-5":"#60a5fa","avatar-6":"#a78bfa","avatar-7":"#34d399","avatar-8":"#f87171"},space:{none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius:{none:0,sm:6,md:10,lg:14,xl:20,pill:9999},text:{xs:{size:11},sm:{size:13},base:{size:15},lg:{size:17},xl:{size:20},"2xl":{size:24},"3xl":{size:30},"4xl":{size:36},"5xl":{size:45},"6xl":{size:57},"7xl":{size:64},"8xl":{size:72}},weight:{normal:"400",medium:"500",semibold:"600",bold:"700"},leading:{heading:1.2,body:1.4,display:1.2},"letter-spacing":{tight:-.2,normal:0,wide:.4},font:{ui:{},display:{},mono:{}},shadow:{card:{shadowColor:"#000000",shadowOffset:{width:0,height:2},shadowOpacity:.4,shadowRadius:4,elevation:2},elevated:{shadowColor:"#000000",shadowOffset:{width:0,height:4},shadowOpacity:.502,shadowRadius:8,elevation:4},popover:{shadowColor:"#000000",shadowOffset:{width:0,height:8},shadowOpacity:.549,shadowRadius:16,elevation:8},modal:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12},drawer:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12}},motion:{duration:{instant:80,fast:160,default:240,slow:360,slower:500},ease:{"in-out":[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]}},size:{border:1},components:{field:{sm:{radius:"md","padding-x":"sm","padding-y":"sm","min-height":38,text:"sm",icon:14,"label-text":"xs","label-gap":"xs","message-text":"xs","message-gap":"xxs"},md:{radius:"md","padding-x":"md","padding-y":"md","min-height":44,text:"base",icon:16,"label-text":"sm","label-gap":"xs","message-text":"sm","message-gap":"xxs"},lg:{radius:"md","padding-x":"lg","padding-y":"lg","min-height":52,text:"lg",icon:18,"label-text":"base","label-gap":"xs","message-text":"base","message-gap":"xxs"}},press:{opacity:.85},disabled:{opacity:.55},button:{xs:{"padding-x":"sm","padding-y":"xs","min-height":28,text:"xs",radius:"md",icon:14,"badge-icon":11},sm:{"padding-x":"md","padding-y":"xs","min-height":34,text:"sm",radius:"md",icon:16,"badge-icon":16},md:{"padding-x":"lg","padding-y":"sm","min-height":44,text:"base",radius:"md",icon:18,"badge-icon":18},lg:{"padding-x":"xl","padding-y":"md","min-height":50,text:"lg",radius:"lg",icon:20,"badge-icon":20},xl:{"padding-x":"2xl","padding-y":"md","min-height":58,text:"xl",radius:"lg",icon:22,"badge-icon":22}},input:{sm:{"multiline-min-height":72},md:{"multiline-min-height":92},lg:{"multiline-min-height":110}},"search-bar":{sm:{radius:"pill"},md:{radius:"pill"},lg:{radius:"pill"}},"empty-state":{sm:{icon:48,"title-text":"lg","description-text":"sm","padding-y":"lg","title-gap":"md","description-gap":"xs"},md:{icon:64,"title-text":"xl","description-text":"base","padding-y":"xl","title-gap":"md","description-gap":"xs"},lg:{icon:80,"title-text":"2xl","description-text":"lg","padding-y":"2xl","title-gap":"md","description-gap":"xs"}},"list-item":{sm:{"padding-y":"sm","title-text":"sm","subtitle-text":"xs","min-height":44},md:{"padding-y":"md","title-text":"base","subtitle-text":"sm","min-height":56},lg:{"padding-y":"lg","title-text":"lg","subtitle-text":"base","min-height":72}},badge:{sm:{text:"xs","min-width":16,height:16,"padding-x":"xs","dot-size":8},md:{text:"sm","min-width":20,height:20,"padding-x":"sm","dot-size":10},"border-width":1.5,"anchor-offset":4},chip:{sm:{"padding-x":"sm","padding-y":"xs",text:"xs","min-height":26,"close-size":16,"close-text":"xs",gap:"xs",icon:14},md:{"padding-x":"md","padding-y":"xs",text:"sm","min-height":32,"close-size":18,"close-text":"sm",gap:"sm",icon:16}},checkbox:{sm:{"box-size":16},md:{"box-size":20},lg:{"box-size":24},"label-gap":"sm"},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},"label-gap":"sm"},switch:{sm:{"track-width":42,"track-height":26,"thumb-size":22,padding:"xxs"},md:{"track-width":51,"track-height":31,"thumb-size":27,padding:"xxs"},lg:{"track-width":60,"track-height":36,"thumb-size":32,padding:"xxs"}},"otp-input":{sm:{cell:36,text:"base",radius:"sm",gap:"sm"},md:{cell:48,text:"xl",radius:"md",gap:"sm"},lg:{cell:56,text:"2xl",radius:"lg",gap:"md"}},"segmented-control":{sm:{height:32,text:"sm","padding-x":"sm",icon:14},md:{height:40,text:"base","padding-x":"md",icon:16},lg:{height:48,text:"lg","padding-x":"lg",icon:18},"track-padding":"xs","underline-height":2,"pill-inset":"xs"},tabs:{sm:{text:"sm","padding-y":"sm","padding-x":"xs","scrollable-padding-x":"md",icon:16},md:{text:"base","padding-y":"md","padding-x":"sm","scrollable-padding-x":"lg",icon:18},lg:{text:"lg","padding-y":"lg","padding-x":"md","scrollable-padding-x":"xl",icon:20},"icon-gap":"xs","track-padding":"xs","underline-height":2,"pill-inset":"xs","disabled-opacity":.45,"badge-gap":"xs"},slider:{sm:{"track-height":4,"thumb-diameter":24},md:{"track-height":6,"thumb-diameter":28},lg:{"track-height":8,"thumb-diameter":32}},"floating-action-button":{sm:{diameter:40,icon:18,text:"sm","label-padding-x":"md"},md:{diameter:56,icon:22,text:"base","label-padding-x":"lg"},lg:{diameter:72,icon:28,text:"lg","label-padding-x":"xl"},"edge-offset":"xl","bottom-offset":"xl","secondary-gap":"lg","stagger-ms":50},dialog:{"icon-wrapper-size":48,"action-button-min-height":44},toast:{"icon-circle-size":28,"icon-glyph-text":"lg","tint-bar-width":0,"action-min-height":30},banner:{"tint-bar-width":0}}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.lightTokens=exports.darkTokens=exports.WEIGHT_NAMES=exports.TEXT_NAMES=exports.SPACE_NAMES=exports.SIZE_NAMES=exports.SHADOW_NAMES=exports.RADIUS_NAMES=exports.LETTER_SPACING_NAMES=exports.LEADING_NAMES=exports.FONT_NAMES=exports.EASE_NAMES=exports.DURATION_NAMES=exports.COMPONENT_KINDS=exports.COLOR_NAMES=void 0;const COLOR_NAMES=exports.COLOR_NAMES=["bg","bg-subtle","bg-muted","surface","surface-inverse","surface-dark","surface-dark-border","on-surface-dark","on-surface-dark-muted","text","text-body","text-muted","text-subtle","text-inverse","link","border","border-subtle","field-bg","field-border","field-border-focus","focus-ring","scrim","on-scrim","thumb","primary","primary-hover","primary-soft","primary-text","on-primary","primary-wash","primary-wash-strong","neutral","neutral-hover","neutral-text","on-neutral","success","success-soft","success-text","on-success","warning","warning-soft","warning-text","on-warning","danger","danger-soft","danger-border","danger-text","on-danger","info","info-soft","info-text","on-info","primary-pressed","on-neutral-strong","text-disabled","surface-pressed","surface-hover","surface-selected","surface-disabled","skeleton","skeleton-highlight","glass-fill","glass-border","on-glass","glass-badge","field-bg-focus","field-bg-disabled","field-border-error","field-label","field-text","field-text-disabled","field-placeholder","field-placeholder-disabled","field-icon","field-icon-focus","field-icon-disabled","field-caret","field-message","avatar-1","avatar-2","avatar-3","avatar-4","avatar-5","avatar-6","avatar-7","avatar-8"],SPACE_NAMES=exports.SPACE_NAMES=["none","xxs","xs","sm","md","lg","xl","2xl","3xl","4xl"],RADIUS_NAMES=exports.RADIUS_NAMES=["none","sm","md","lg","xl","pill"],TEXT_NAMES=exports.TEXT_NAMES=["xs","sm","base","lg","xl","2xl","3xl","4xl","5xl","6xl","7xl","8xl"],WEIGHT_NAMES=exports.WEIGHT_NAMES=["normal","medium","semibold","bold"],LEADING_NAMES=exports.LEADING_NAMES=["heading","body","display"],LETTER_SPACING_NAMES=exports.LETTER_SPACING_NAMES=["tight","normal","wide"],FONT_NAMES=exports.FONT_NAMES=["ui","display","mono"],SHADOW_NAMES=exports.SHADOW_NAMES=["card","elevated","popover","modal","drawer"],DURATION_NAMES=exports.DURATION_NAMES=["instant","fast","default","slow","slower"],EASE_NAMES=exports.EASE_NAMES=["in-out","accelerate","decelerate","sharp"],SIZE_NAMES=exports.SIZE_NAMES=["border"],COMPONENT_KINDS=exports.COMPONENT_KINDS={field:{radius:"radius","padding-x":"space","padding-y":"space","min-height":"px",text:"text",icon:"px","label-text":"text","label-gap":"space","message-text":"text","message-gap":"space"},press:{opacity:"number"},disabled:{opacity:"number"},button:{"padding-x":"space","padding-y":"space","min-height":"px",text:"text",radius:"radius",icon:"px","badge-icon":"px"},input:{"multiline-min-height":"px"},"search-bar":{radius:"radius"},"empty-state":{icon:"px","title-text":"text","description-text":"text","padding-y":"space","title-gap":"space","description-gap":"space"},"list-item":{"padding-y":"space","title-text":"text","subtitle-text":"text","min-height":"px"},badge:{text:"text","min-width":"px",height:"px","padding-x":"space","dot-size":"px","border-width":"px","anchor-offset":"px"},chip:{"padding-x":"space","padding-y":"space",text:"text","min-height":"px","close-size":"px","close-text":"text",gap:"space",icon:"px"},checkbox:{"box-size":"px","label-gap":"space"},radio:{outer:"px",inner:"px","label-gap":"space"},switch:{"track-width":"px","track-height":"px","thumb-size":"px",padding:"space"},"otp-input":{cell:"px",text:"text",radius:"radius",gap:"space"},"segmented-control":{height:"px",text:"text","padding-x":"space",icon:"px","track-padding":"space","underline-height":"px","pill-inset":"space"},tabs:{text:"text","padding-y":"space","padding-x":"space","scrollable-padding-x":"space",icon:"px","icon-gap":"space","track-padding":"space","underline-height":"px","pill-inset":"space","disabled-opacity":"number","badge-gap":"space"},slider:{"track-height":"px","thumb-diameter":"px"},"floating-action-button":{diameter:"px",icon:"px",text:"text","label-padding-x":"space","edge-offset":"space","bottom-offset":"space","secondary-gap":"space","stagger-ms":"ms"},dialog:{"icon-wrapper-size":"px","action-button-min-height":"px"},toast:{"icon-circle-size":"px","icon-glyph-text":"text","tint-bar-width":"px","action-min-height":"px"},banner:{"tint-bar-width":"px"}},lightTokens=exports.lightTokens={mode:"light",colors:{bg:"#ffffff","bg-subtle":"#f8f8fb","bg-muted":"#f1f1f5",surface:"#ffffff","surface-inverse":"#0f0f1a","surface-dark":"#071437","surface-dark-border":"#2a3553","on-surface-dark":"#ffffff","on-surface-dark-muted":"#babdc7",text:"#252f4a","text-body":"#0f0f1a","text-muted":"#52525b","text-subtle":"#62626b","text-inverse":"#ffffff",link:"#5b5bd6",border:"#e5e5ec","border-subtle":"#efeff3","field-bg":"#f9fbfc","field-border":"#ebedf3","field-border-focus":"#bed2f9","focus-ring":"#5b5bd6",scrim:"#0f0f1a80","on-scrim":"#ffffff",thumb:"#ffffff",primary:"#5b5bd6","primary-hover":"#4f4fbf","primary-soft":"#eeeefc","primary-text":"#4f4fd3","on-primary":"#ffffff","primary-wash":"#5b5bd614","primary-wash-strong":"#5b5bd633",neutral:"#f4f4f8","neutral-hover":"#e9e9f0","neutral-text":"#52525b","on-neutral":"#0f0f1a",success:"#18864f","success-soft":"#e8faee","success-text":"#147042","on-success":"#ffffff",warning:"#f59e0b","warning-soft":"#fff8e6","warning-text":"#8f5c06","on-warning":"#0f0f1a",danger:"#e12c32","danger-soft":"#ffeaef","danger-border":"#e5484d","danger-text":"#bc1b20","on-danger":"#ffffff",info:"#1b6ef5","info-soft":"#e9f3ff","info-text":"#0958d9","on-info":"#ffffff","primary-pressed":"#4040a8","on-neutral-strong":"#ffffff","text-disabled":"#b4b4bb","surface-pressed":"#0f0f1a0f","surface-hover":"#0f0f1a0a","surface-selected":"#5b5bd61a","surface-disabled":"#f1f1f5",skeleton:"#ebedf3","skeleton-highlight":"#f5f6fa","glass-fill":"#ffffff47","glass-border":"#ffffff73","on-glass":"#0f0f1a","glass-badge":"#ffffff","field-bg-focus":"#ffffff","field-bg-disabled":"#f5f6fa","field-border-error":"#fdbfce","field-label":"#242f4a","field-text":"#252f4a","field-text-disabled":"#c4cada","field-placeholder":"#626d8b","field-placeholder-disabled":"#c4cada","field-icon":"#7a849f","field-icon-focus":"#4b5675","field-icon-disabled":"#c4cada","field-caret":"#5b8dee","field-message":"#d81736","avatar-1":"#5b5bd6","avatar-2":"#0a7979","avatar-3":"#a45a05","avatar-4":"#cd226e","avatar-5":"#2462eb","avatar-6":"#7c3aed","avatar-7":"#047c57","avatar-8":"#d42222"},space:{none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius:{none:0,sm:6,md:10,lg:14,xl:20,pill:9999},text:{xs:{size:11},sm:{size:13},base:{size:15},lg:{size:17},xl:{size:20},"2xl":{size:24},"3xl":{size:30},"4xl":{size:36},"5xl":{size:45},"6xl":{size:57},"7xl":{size:64},"8xl":{size:72}},weight:{normal:"400",medium:"500",semibold:"600",bold:"700"},leading:{heading:1.2,body:1.4,display:1.2},"letter-spacing":{tight:-.2,normal:0,wide:.4},font:{ui:{},display:{},mono:{}},shadow:{card:{shadowColor:"#000000",shadowOffset:{width:0,height:2},shadowOpacity:.059,shadowRadius:4,elevation:2},elevated:{shadowColor:"#000000",shadowOffset:{width:0,height:4},shadowOpacity:.078,shadowRadius:8,elevation:4},popover:{shadowColor:"#000000",shadowOffset:{width:0,height:8},shadowOpacity:.102,shadowRadius:16,elevation:8},modal:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.141,shadowRadius:24,elevation:12},drawer:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.141,shadowRadius:24,elevation:12}},motion:{duration:{instant:80,fast:160,default:240,slow:360,slower:500},ease:{"in-out":[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]}},size:{border:1},components:{field:{sm:{radius:"md","padding-x":"sm","padding-y":"sm","min-height":38,text:"sm",icon:14,"label-text":"xs","label-gap":"xs","message-text":"xs","message-gap":"xxs"},md:{radius:"md","padding-x":"md","padding-y":"md","min-height":44,text:"base",icon:16,"label-text":"sm","label-gap":"xs","message-text":"sm","message-gap":"xxs"},lg:{radius:"md","padding-x":"lg","padding-y":"lg","min-height":52,text:"lg",icon:18,"label-text":"base","label-gap":"xs","message-text":"base","message-gap":"xxs"}},press:{opacity:.85},disabled:{opacity:.55},button:{xs:{"padding-x":"sm","padding-y":"xs","min-height":28,text:"xs",radius:"md",icon:14,"badge-icon":11},sm:{"padding-x":"md","padding-y":"xs","min-height":34,text:"sm",radius:"md",icon:16,"badge-icon":16},md:{"padding-x":"lg","padding-y":"sm","min-height":44,text:"base",radius:"md",icon:18,"badge-icon":18},lg:{"padding-x":"xl","padding-y":"md","min-height":50,text:"lg",radius:"lg",icon:20,"badge-icon":20},xl:{"padding-x":"2xl","padding-y":"md","min-height":58,text:"xl",radius:"lg",icon:22,"badge-icon":22}},input:{sm:{"multiline-min-height":72},md:{"multiline-min-height":92},lg:{"multiline-min-height":110}},"search-bar":{sm:{radius:"pill"},md:{radius:"pill"},lg:{radius:"pill"}},"empty-state":{sm:{icon:48,"title-text":"lg","description-text":"sm","padding-y":"lg","title-gap":"md","description-gap":"xs"},md:{icon:64,"title-text":"xl","description-text":"base","padding-y":"xl","title-gap":"md","description-gap":"xs"},lg:{icon:80,"title-text":"2xl","description-text":"lg","padding-y":"2xl","title-gap":"md","description-gap":"xs"}},"list-item":{sm:{"padding-y":"sm","title-text":"sm","subtitle-text":"xs","min-height":44},md:{"padding-y":"md","title-text":"base","subtitle-text":"sm","min-height":56},lg:{"padding-y":"lg","title-text":"lg","subtitle-text":"base","min-height":72}},badge:{sm:{text:"xs","min-width":16,height:16,"padding-x":"xs","dot-size":8},md:{text:"sm","min-width":20,height:20,"padding-x":"sm","dot-size":10},"border-width":1.5,"anchor-offset":4},chip:{sm:{"padding-x":"sm","padding-y":"xs",text:"xs","min-height":26,"close-size":16,"close-text":"xs",gap:"xs",icon:14},md:{"padding-x":"md","padding-y":"xs",text:"sm","min-height":32,"close-size":18,"close-text":"sm",gap:"sm",icon:16}},checkbox:{sm:{"box-size":16},md:{"box-size":20},lg:{"box-size":24},"label-gap":"sm"},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},"label-gap":"sm"},switch:{sm:{"track-width":42,"track-height":26,"thumb-size":22,padding:"xxs"},md:{"track-width":51,"track-height":31,"thumb-size":27,padding:"xxs"},lg:{"track-width":60,"track-height":36,"thumb-size":32,padding:"xxs"}},"otp-input":{sm:{cell:36,text:"base",radius:"sm",gap:"sm"},md:{cell:48,text:"xl",radius:"md",gap:"sm"},lg:{cell:56,text:"2xl",radius:"lg",gap:"md"}},"segmented-control":{sm:{height:32,text:"sm","padding-x":"sm",icon:14},md:{height:40,text:"base","padding-x":"md",icon:16},lg:{height:48,text:"lg","padding-x":"lg",icon:18},"track-padding":"xs","underline-height":2,"pill-inset":"xs"},tabs:{sm:{text:"sm","padding-y":"sm","padding-x":"xs","scrollable-padding-x":"md",icon:16},md:{text:"base","padding-y":"md","padding-x":"sm","scrollable-padding-x":"lg",icon:18},lg:{text:"lg","padding-y":"lg","padding-x":"md","scrollable-padding-x":"xl",icon:20},"icon-gap":"xs","track-padding":"xs","underline-height":2,"pill-inset":"xs","disabled-opacity":.45,"badge-gap":"xs"},slider:{sm:{"track-height":4,"thumb-diameter":24},md:{"track-height":6,"thumb-diameter":28},lg:{"track-height":8,"thumb-diameter":32}},"floating-action-button":{sm:{diameter:40,icon:18,text:"sm","label-padding-x":"md"},md:{diameter:56,icon:22,text:"base","label-padding-x":"lg"},lg:{diameter:72,icon:28,text:"lg","label-padding-x":"xl"},"edge-offset":"xl","bottom-offset":"xl","secondary-gap":"lg","stagger-ms":50},dialog:{"icon-wrapper-size":48,"action-button-min-height":44},toast:{"icon-circle-size":28,"icon-glyph-text":"lg","tint-bar-width":0,"action-min-height":30},banner:{"tint-bar-width":0}}},darkTokens=exports.darkTokens={mode:"dark",colors:{bg:"#0b0b12","bg-subtle":"#13131c","bg-muted":"#1c1c26",surface:"#1c1c26","surface-inverse":"#fafafa","surface-dark":"#071437","surface-dark-border":"#2a3553","on-surface-dark":"#ffffff","on-surface-dark-muted":"#babdc7",text:"#e2e2e2","text-body":"#fafafa","text-muted":"#b4b4bb","text-subtle":"#919199","text-inverse":"#0f0f1a",link:"#9292ee",border:"#27272f","border-subtle":"#1c1c26","field-bg":"#13131c","field-border":"#27272f","field-border-focus":"#3d5fb0","focus-ring":"#7c7ce8",scrim:"#000000a6","on-scrim":"#ffffff",thumb:"#ffffff",primary:"#7c7ce8","primary-hover":"#9292ee","primary-soft":"#1f1f3d","primary-text":"#8989ea","on-primary":"#0f0f1a","primary-wash":"#7c7ce814","primary-wash-strong":"#7c7ce833",neutral:"#1f1f26","neutral-hover":"#2a2a33","neutral-text":"#b4b4bb","on-neutral":"#fafafa",success:"#30c780","success-soft":"#04b4402e","success-text":"#30c780","on-success":"#0f0f1a",warning:"#fbbf24","warning-soft":"#dfa0002e","warning-text":"#fbbf24","on-warning":"#0f0f1a",danger:"#f87171","danger-soft":"#e826462e","danger-border":"#f87171","danger-text":"#f87171","on-danger":"#0f0f1a",info:"#60a5fa","info-soft":"#056ee92e","info-text":"#60a5fa","on-info":"#0f0f1a","primary-pressed":"#a8a8f2","on-neutral-strong":"#0f0f1a","text-disabled":"#52525b","surface-pressed":"#ffffff14","surface-hover":"#ffffff0d","surface-selected":"#7c7ce82e","surface-disabled":"#1c1c26",skeleton:"#1c1c26","skeleton-highlight":"#27272f","glass-fill":"#ffffff47","glass-border":"#ffffff73","on-glass":"#0f0f1a","glass-badge":"#ffffff","field-bg-focus":"#0b0b12","field-bg-disabled":"#1c1c26","field-border-error":"#8a2f42","field-label":"#e4e6ee","field-text":"#fafafa","field-text-disabled":"#52525b","field-placeholder":"#84848d","field-placeholder-disabled":"#52525b","field-icon":"#8b8b95","field-icon-focus":"#d4d4db","field-icon-disabled":"#52525b","field-caret":"#7c9ef0","field-message":"#f87171","avatar-1":"#8b8bee","avatar-2":"#2dd4bf","avatar-3":"#fcd34d","avatar-4":"#f472b6","avatar-5":"#60a5fa","avatar-6":"#a78bfa","avatar-7":"#34d399","avatar-8":"#f87171"},space:{none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius:{none:0,sm:6,md:10,lg:14,xl:20,pill:9999},text:{xs:{size:11},sm:{size:13},base:{size:15},lg:{size:17},xl:{size:20},"2xl":{size:24},"3xl":{size:30},"4xl":{size:36},"5xl":{size:45},"6xl":{size:57},"7xl":{size:64},"8xl":{size:72}},weight:{normal:"400",medium:"500",semibold:"600",bold:"700"},leading:{heading:1.2,body:1.4,display:1.2},"letter-spacing":{tight:-.2,normal:0,wide:.4},font:{ui:{},display:{},mono:{}},shadow:{card:{shadowColor:"#000000",shadowOffset:{width:0,height:2},shadowOpacity:.4,shadowRadius:4,elevation:2},elevated:{shadowColor:"#000000",shadowOffset:{width:0,height:4},shadowOpacity:.502,shadowRadius:8,elevation:4},popover:{shadowColor:"#000000",shadowOffset:{width:0,height:8},shadowOpacity:.549,shadowRadius:16,elevation:8},modal:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12},drawer:{shadowColor:"#000000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12}},motion:{duration:{instant:80,fast:160,default:240,slow:360,slower:500},ease:{"in-out":[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]}},size:{border:1},components:{field:{sm:{radius:"md","padding-x":"sm","padding-y":"sm","min-height":38,text:"sm",icon:14,"label-text":"xs","label-gap":"xs","message-text":"xs","message-gap":"xxs"},md:{radius:"md","padding-x":"md","padding-y":"md","min-height":44,text:"base",icon:16,"label-text":"sm","label-gap":"xs","message-text":"sm","message-gap":"xxs"},lg:{radius:"md","padding-x":"lg","padding-y":"lg","min-height":52,text:"lg",icon:18,"label-text":"base","label-gap":"xs","message-text":"base","message-gap":"xxs"}},press:{opacity:.85},disabled:{opacity:.55},button:{xs:{"padding-x":"sm","padding-y":"xs","min-height":28,text:"xs",radius:"md",icon:14,"badge-icon":11},sm:{"padding-x":"md","padding-y":"xs","min-height":34,text:"sm",radius:"md",icon:16,"badge-icon":16},md:{"padding-x":"lg","padding-y":"sm","min-height":44,text:"base",radius:"md",icon:18,"badge-icon":18},lg:{"padding-x":"xl","padding-y":"md","min-height":50,text:"lg",radius:"lg",icon:20,"badge-icon":20},xl:{"padding-x":"2xl","padding-y":"md","min-height":58,text:"xl",radius:"lg",icon:22,"badge-icon":22}},input:{sm:{"multiline-min-height":72},md:{"multiline-min-height":92},lg:{"multiline-min-height":110}},"search-bar":{sm:{radius:"pill"},md:{radius:"pill"},lg:{radius:"pill"}},"empty-state":{sm:{icon:48,"title-text":"lg","description-text":"sm","padding-y":"lg","title-gap":"md","description-gap":"xs"},md:{icon:64,"title-text":"xl","description-text":"base","padding-y":"xl","title-gap":"md","description-gap":"xs"},lg:{icon:80,"title-text":"2xl","description-text":"lg","padding-y":"2xl","title-gap":"md","description-gap":"xs"}},"list-item":{sm:{"padding-y":"sm","title-text":"sm","subtitle-text":"xs","min-height":44},md:{"padding-y":"md","title-text":"base","subtitle-text":"sm","min-height":56},lg:{"padding-y":"lg","title-text":"lg","subtitle-text":"base","min-height":72}},badge:{sm:{text:"xs","min-width":16,height:16,"padding-x":"xs","dot-size":8},md:{text:"sm","min-width":20,height:20,"padding-x":"sm","dot-size":10},"border-width":1.5,"anchor-offset":4},chip:{sm:{"padding-x":"sm","padding-y":"xs",text:"xs","min-height":26,"close-size":16,"close-text":"xs",gap:"xs",icon:14},md:{"padding-x":"md","padding-y":"xs",text:"sm","min-height":32,"close-size":18,"close-text":"sm",gap:"sm",icon:16}},checkbox:{sm:{"box-size":16},md:{"box-size":20},lg:{"box-size":24},"label-gap":"sm"},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},"label-gap":"sm"},switch:{sm:{"track-width":42,"track-height":26,"thumb-size":22,padding:"xxs"},md:{"track-width":51,"track-height":31,"thumb-size":27,padding:"xxs"},lg:{"track-width":60,"track-height":36,"thumb-size":32,padding:"xxs"}},"otp-input":{sm:{cell:36,text:"base",radius:"sm",gap:"sm"},md:{cell:48,text:"xl",radius:"md",gap:"sm"},lg:{cell:56,text:"2xl",radius:"lg",gap:"md"}},"segmented-control":{sm:{height:32,text:"sm","padding-x":"sm",icon:14},md:{height:40,text:"base","padding-x":"md",icon:16},lg:{height:48,text:"lg","padding-x":"lg",icon:18},"track-padding":"xs","underline-height":2,"pill-inset":"xs"},tabs:{sm:{text:"sm","padding-y":"sm","padding-x":"xs","scrollable-padding-x":"md",icon:16},md:{text:"base","padding-y":"md","padding-x":"sm","scrollable-padding-x":"lg",icon:18},lg:{text:"lg","padding-y":"lg","padding-x":"md","scrollable-padding-x":"xl",icon:20},"icon-gap":"xs","track-padding":"xs","underline-height":2,"pill-inset":"xs","disabled-opacity":.45,"badge-gap":"xs"},slider:{sm:{"track-height":4,"thumb-diameter":24},md:{"track-height":6,"thumb-diameter":28},lg:{"track-height":8,"thumb-diameter":32}},"floating-action-button":{sm:{diameter:40,icon:18,text:"sm","label-padding-x":"md"},md:{diameter:56,icon:22,text:"base","label-padding-x":"lg"},lg:{diameter:72,icon:28,text:"lg","label-padding-x":"xl"},"edge-offset":"xl","bottom-offset":"xl","secondary-gap":"lg","stagger-ms":50},dialog:{"icon-wrapper-size":48,"action-button-min-height":44},toast:{"icon-circle-size":28,"icon-glyph-text":"lg","tint-bar-width":0,"action-min-height":30},banner:{"tint-bar-width":0}}};

package/lib/module/components/AuthedImage/AuthedImage.meta.js

@@ -1 +1 @@
-"use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"AuthedImage",marker:null,platforms:["phone"],acceptsChildren:!1,props:{uri:{type:"url",required:!0,description:"The address of the image."},resizeMode:{type:"enum",values:["cover","contain","stretch","repeat","center"],description:"How the image fits its box, in React Native's names; contentFit wins when both are set."},contentFit:{type:"enum",values:["cover","contain","fill","none","scale-down"],description:"How the image fits its box, in expo-image's names."},fadeDuration:{type:"number",description:"The cross-fade in milliseconds when the image appears."},headers:{type:"object",description:"Extra request headers sent with the fetch."},authenticated:{type:"boolean",default:!0,description:"Attaches the stored sign-in token to the request when no client is given."},ttlMs:{type:"number",default:6048e5,description:"How long a cached image counts as fresh, in milliseconds."},placeholder:{type:"node",description:"Shown while the image loads."},fallback:{type:"node",description:"Shown when no usable image exists."},cacheKey:{type:"string",description:"Overrides the cache key derived from the address."},blurRadius:{type:"number",description:"Blurs the image by this radius in points."},tintColor:{type:"string",description:"Paints the image in one colour, for a mask-like icon."}},omit:[],examples:[{id:"AuthedImage.cover",title:"Cover fit",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"cover"}},{id:"AuthedImage.contain",title:"Contain fit",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"contain"}},{id:"AuthedImage.blurred",title:"Blurred",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"cover",blurRadius:12}},{id:"AuthedImage.missing",title:"Image not found",props:{uri:"https://picsum.photos/id/999999/400/300",authenticated:!1,contentFit:"cover"}}],usage:{when:["Show an image that sits behind a sign-in, which the plain Image cannot fetch.","Cache the image on the device so it opens at once the next time."],whenNot:[{text:"The image is public and needs no token.",instead:"Use Image with a plain address."},{text:"The image is a person's picture.",instead:"Use Avatar."}],do:[{note:"Give the image a fixed height or aspect ratio so the layout does not jump.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/webority/400/300"}}]},{note:"Pass a fallback for the case where the image cannot load.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/webority/400/300",fallback:{component:"AppIcon",props:{name:"user"}}}}]}],dont:[{note:"Do not set one cache key for different pictures.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/id/10/400/300",cacheKey:"shared-key"}},{component:"AuthedImage",props:{uri:"https://picsum.photos/id/11/400/300",cacheKey:"shared-key"}}]},{note:"Do not send the token to a public address; turn authenticated off.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/public/400/300",authenticated:!0}}]}],a11y:["Pass an accessibility label that describes the picture when it carries meaning.","A decorative image needs no label."]}});
+"use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"AuthedImage",marker:null,platforms:["phone"],acceptsChildren:!1,props:{uri:{type:"url",required:!0,description:"The address of the image."},resizeMode:{type:"enum",values:["cover","contain","stretch","repeat","center"],description:"How the image fits its box, in React Native's names; contentFit wins when both are set."},contentFit:{type:"enum",values:["cover","contain","fill","none","scale-down"],description:"How the image fits its box, in expo-image's names."},fadeDuration:{type:"number",description:"The cross-fade in milliseconds when the image appears."},headers:{type:"object",description:"Extra request headers sent with the fetch."},authenticated:{type:"boolean",default:!0,description:"Attaches the stored sign-in token when no client is given, only for a relative address or one on the app's configured API address."},ttlMs:{type:"number",default:6048e5,description:"How long a cached image counts as fresh, in milliseconds."},placeholder:{type:"node",description:"Shown while the image loads."},fallback:{type:"node",description:"Shown when no usable image exists."},cacheKey:{type:"string",description:"Overrides the cache key derived from the address."},blurRadius:{type:"number",description:"Blurs the image by this radius in points."},tintColor:{type:"string",description:"Paints the image in one colour, for a mask-like icon."}},omit:[],examples:[{id:"AuthedImage.cover",title:"Cover fit",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"cover"}},{id:"AuthedImage.contain",title:"Contain fit",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"contain"}},{id:"AuthedImage.blurred",title:"Blurred",props:{uri:"https://picsum.photos/seed/webority-authed-image/400/300",authenticated:!1,contentFit:"cover",blurRadius:12}},{id:"AuthedImage.missing",title:"Image not found",props:{uri:"https://picsum.photos/id/999999/400/300",authenticated:!1,contentFit:"cover"}}],usage:{when:["Show an image that sits behind a sign-in, which the plain Image cannot fetch.","Cache the image on the device so it opens at once the next time."],whenNot:[{text:"The image is public and needs no token.",instead:"Use Image with a plain address."},{text:"The image is a person's picture.",instead:"Use Avatar."}],do:[{note:"Give the image a fixed height or aspect ratio so the layout does not jump.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/webority/400/300"}}]},{note:"Pass a fallback for the case where the image cannot load.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/webority/400/300",fallback:{component:"AppIcon",props:{name:"user"}}}}]}],dont:[{note:"Do not set one cache key for different pictures.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/id/10/400/300",cacheKey:"shared-key"}},{component:"AuthedImage",props:{uri:"https://picsum.photos/id/11/400/300",cacheKey:"shared-key"}}]},{note:"Do not send the token to a public address; turn authenticated off.",example:[{component:"AuthedImage",props:{uri:"https://picsum.photos/seed/public/400/300",authenticated:!0}}]}],a11y:["Pass an accessibility label that describes the picture when it carries meaning.","A decorative image needs no label."]}});

package/lib/module/components/AuthedImage/authedImageCache.js

@@ -1 +1 @@
-"use strict";import{ACCESS_TOKEN_KEY,getToken,isStorageAvailable,Logger,publicClient,Storage}from"@webority/mobile-core";import{Directory,File,Paths}from"expo-file-system";import{AppState}from"react-native";import{hashString}from"../../utils/hashString.js";const INDEX_KEY="@webority/authed-image/v2/index",LEGACY_PREFIX="@webority/authed-image/v1/",FOLDER="authed-images",DEFAULT_BYTE_CEILING=52428800,TOUCH_PERSIST_MS=36e5,PERSIST_DELAY_MS=1e3;export const DEFAULT_TTL_MS=6048e5;let byteCeiling=52428800;export const setAuthedImageCacheLimit=e=>{if(!Number.isFinite(e)||e<=0)throw new Error(`[@webority/mobile-ui] setAuthedImageCacheLimit() needs a positive number of bytes, received ${String(e)}. Pass e.g. 50 * 1024 * 1024 for 50 MB.`);byteCeiling=e};export const getAuthedImageCacheLimit=()=>byteCeiling;export const deriveCacheKey=(e,t)=>hashString(t??e);const imageFile=e=>new File(Paths.cache,FOLDER,e),toMeta=({fetchedAt:e,bytes:t,contentType:s,lastAccessedAt:r})=>({fetchedAt:e,bytes:t,contentType:s,lastAccessedAt:r});let index=null,indexBytes=0,indexLoad=null,persistTimer=null,persistTarget=null,appStateSub=null;const persistIndex=async e=>{if(!isStorageAvailable())return;const t={};for(const[s,r]of e)t[s]={...r,persistedAccessAt:r.lastAccessedAt};if(await Storage.setItem(INDEX_KEY,JSON.stringify(t)))for(const t of e.values())t.persistedAccessAt=t.lastAccessedAt},schedulePersist=e=>{persistTarget=e,null===appStateSub&&(appStateSub=AppState.addEventListener("change",e=>{"active"!==e&&flushAuthedImageIndex()})),null===persistTimer&&(persistTimer=setTimeout(()=>{flushAuthedImageIndex()},1e3))};export const flushAuthedImageIndex=async()=>{null!==persistTimer&&(clearTimeout(persistTimer),persistTimer=null);const e=persistTarget;persistTarget=null,null!==e&&await persistIndex(e)};const removeLegacyEntries=async()=>{const e=(await Storage.getAllKeys()).filter(e=>e.startsWith(LEGACY_PREFIX));e.length>0&&await Storage.multiRemove(e)},removeOrphanFiles=e=>{try{const t=new Directory(Paths.cache,FOLDER);if(!t.exists)return;const s=new Set([...e.values()].map(e=>imageFile(e.fileName).uri));for(const e of t.list())s.has(e.uri)||e.delete()}catch(e){Logger.warn("[AuthedImage] could not tidy the image cache folder",e)}},readStoredIndex=async()=>{const e=new Map;if(!isStorageAvailable())return e;const t=await Storage.getItem(INDEX_KEY);if(!t)return await removeLegacyEntries(),e;try{for(const[s,r]of Object.entries(JSON.parse(t)))e.set(s,r)}catch{}return e},loadIndex=()=>index?Promise.resolve(index):(indexLoad||(indexLoad=readStoredIndex().then(e=>(removeOrphanFiles(e),index=e,indexBytes=[...e.values()].reduce((e,t)=>e+t.bytes,0),e)).finally(()=>{indexLoad=null})),indexLoad),deleteFile=e=>{try{const t=imageFile(e);t.exists&&t.delete()}catch(e){Logger.warn("[AuthedImage] could not delete a cached image file",e)}};export const readEntry=async e=>{const t=await loadIndex(),s=t.get(e);if(!s)return null;const r=imageFile(s.fileName);return r.exists?{fileUri:r.uri,meta:toMeta(s)}:(t.delete(e),indexBytes-=s.bytes,schedulePersist(t),null)};export const removeEntry=async e=>{const t=await loadIndex(),s=t.get(e);s&&(t.delete(e),indexBytes-=s.bytes,deleteFile(s.fileName),schedulePersist(t))};export class AuthedImageHttpError extends Error{constructor(e,t){super(e),this.name="AuthedImageHttpError",this.status=t}}export const isPermanentRefusal=e=>e instanceof AuthedImageHttpError&&e.status>=400&&e.status<500&&408!==e.status&&429!==e.status;export const isFresh=(e,t,s=Date.now())=>s-e.fetchedAt<t;export const touchEntry=async e=>{const t=await loadIndex(),s=t.get(e);s&&(s.lastAccessedAt=Date.now(),s.lastAccessedAt-s.persistedAccessAt>=36e5&&schedulePersist(t))};const evictIfNeeded=e=>{let t=indexBytes;if(t<=byteCeiling)return 0;const s=[...e].sort(([,e],[,t])=>e.lastAccessedAt-t.lastAccessedAt);let r=0;for(const[i,a]of s){if(t<=byteCeiling)break;e.delete(i),indexBytes-=a.bytes,deleteFile(a.fileName),t-=a.bytes,r+=1}return r};export const clearAuthedImageCache=async()=>{null!==persistTimer&&(clearTimeout(persistTimer),persistTimer=null),persistTarget=null;(await loadIndex()).clear(),indexBytes=0;const e=new Directory(Paths.cache,FOLDER);e.exists&&e.delete(),isStorageAvailable()&&await Storage.removeItem(INDEX_KEY)};export const authedImageCacheStats=async()=>{const e=await loadIndex();let t=0;for(const s of e.values())t+=s.bytes;return{entries:e.size,bytes:t}};const responseHeader=(e,t)=>{if(!e||"object"!=typeof e)return;const s=e.get,r="function"==typeof s?s.call(e,t):e[t];return"string"==typeof r?r:void 0},fetchAndStore=async(e,t,s)=>{const r={Accept:"image/*",...t.headers};if(!t.client&&t.authenticated){const e=await getToken(ACCESS_TOKEN_KEY);e?.token&&(r.Authorization=`Bearer ${e.token}`)}const i=t.client??publicClient;let a;try{a=await i.get(t.uri,{headers:r,responseType:"arraybuffer",signal:s})}catch(e){const s=e?.response?.status;if("number"!=typeof s)throw e;throw new AuthedImageHttpError(`[@webority/mobile-ui] AuthedImage could not load "${t.uri}": the server answered ${s}. Check the URL and whether the request needs to be signed in (pass the signed-in client as \`client\`, or authenticated={false} for public media).`,s)}const n=new Uint8Array(a.data??new ArrayBuffer(0)),o=responseHeader(a.headers,"content-type"),c=(o?o.split(";")[0].trim():"")||"image/jpeg",l=await loadIndex(),d=Date.now(),u=`${e}-${d.toString(36)}`,h=imageFile(u);try{h.create({intermediates:!0,overwrite:!0}),h.write(n)}catch(e){throw new Error(`[@webority/mobile-ui] AuthedImage fetched "${t.uri}" but could not write it to the app's cache folder: ${e instanceof Error?e.message:String(e)}. The device may be out of storage.`)}const g={fetchedAt:d,bytes:n.byteLength,contentType:c,lastAccessedAt:d,fileName:u,persistedAccessAt:d},m=l.get(e);m&&(indexBytes-=m.bytes),l.set(e,g),indexBytes+=g.bytes,m&&m.fileName!==u&&deleteFile(m.fileName);const p=evictIfNeeded(l);return schedulePersist(l),p>0&&Logger.info(`[AuthedImage] evicted ${p} cached image(s) over the byte ceiling`),{fileUri:h.uri,meta:toMeta(g)}},inFlight=new Map;export const acquireFetch=(e,t)=>{const s=inFlight.get(e);if(s)return s.waiters+=1,s;const r=new AbortController,i={controller:r,waiters:1,promise:Promise.resolve()};return i.promise=fetchAndStore(e,t,r.signal).finally(()=>{inFlight.get(e)===i&&inFlight.delete(e)}),inFlight.set(e,i),i};export const releaseFetch=(e,t)=>{t.waiters-=1,t.waiters>0||(inFlight.get(e)===t&&inFlight.delete(e),t.controller.abort())};
+"use strict";import{ACCESS_TOKEN_KEY,getConfigValue,getToken,isStorageAvailable,Logger,publicClient,Storage}from"@webority/mobile-core";import{Directory,File,Paths}from"expo-file-system";import{AppState}from"react-native";import{hashString}from"../../utils/hashString.js";const INDEX_KEY="@webority/authed-image/v2/index",LEGACY_PREFIX="@webority/authed-image/v1/",FOLDER="authed-images",DEFAULT_BYTE_CEILING=52428800,TOUCH_PERSIST_MS=36e5,PERSIST_DELAY_MS=1e3;export const DEFAULT_TTL_MS=6048e5;let byteCeiling=52428800;export const setAuthedImageCacheLimit=e=>{if(!Number.isFinite(e)||e<=0)throw new Error(`[@webority/mobile-ui] setAuthedImageCacheLimit() needs a positive number of bytes, received ${String(e)}. Pass e.g. 50 * 1024 * 1024 for 50 MB.`);byteCeiling=e};export const getAuthedImageCacheLimit=()=>byteCeiling;export const deriveCacheKey=(e,t)=>hashString(t??e);const imageFile=e=>new File(Paths.cache,FOLDER,e),toMeta=({fetchedAt:e,bytes:t,contentType:s,lastAccessedAt:r})=>({fetchedAt:e,bytes:t,contentType:s,lastAccessedAt:r});let index=null,indexBytes=0,indexLoad=null,persistTimer=null,persistTarget=null,appStateSub=null;const persistIndex=async e=>{if(!isStorageAvailable())return;const t={};for(const[s,r]of e)t[s]={...r,persistedAccessAt:r.lastAccessedAt};if(await Storage.setItem(INDEX_KEY,JSON.stringify(t)))for(const t of e.values())t.persistedAccessAt=t.lastAccessedAt},schedulePersist=e=>{persistTarget=e,null===appStateSub&&(appStateSub=AppState.addEventListener("change",e=>{"active"!==e&&flushAuthedImageIndex()})),null===persistTimer&&(persistTimer=setTimeout(()=>{flushAuthedImageIndex()},1e3))};export const flushAuthedImageIndex=async()=>{null!==persistTimer&&(clearTimeout(persistTimer),persistTimer=null);const e=persistTarget;persistTarget=null,null!==e&&await persistIndex(e)};const removeLegacyEntries=async()=>{const e=(await Storage.getAllKeys()).filter(e=>e.startsWith(LEGACY_PREFIX));e.length>0&&await Storage.multiRemove(e)},removeOrphanFiles=e=>{try{const t=new Directory(Paths.cache,FOLDER);if(!t.exists)return;const s=new Set([...e.values()].map(e=>imageFile(e.fileName).uri));for(const e of t.list())s.has(e.uri)||e.delete()}catch(e){Logger.warn("[AuthedImage] could not tidy the image cache folder",e)}},readStoredIndex=async()=>{const e=new Map;if(!isStorageAvailable())return e;const t=await Storage.getItem(INDEX_KEY);if(!t)return await removeLegacyEntries(),e;try{for(const[s,r]of Object.entries(JSON.parse(t)))e.set(s,r)}catch{}return e},loadIndex=()=>index?Promise.resolve(index):(indexLoad||(indexLoad=readStoredIndex().then(e=>(removeOrphanFiles(e),index=e,indexBytes=[...e.values()].reduce((e,t)=>e+t.bytes,0),e)).finally(()=>{indexLoad=null})),indexLoad),deleteFile=e=>{try{const t=imageFile(e);t.exists&&t.delete()}catch(e){Logger.warn("[AuthedImage] could not delete a cached image file",e)}};export const readEntry=async e=>{const t=await loadIndex(),s=t.get(e);if(!s)return null;const r=imageFile(s.fileName);return r.exists?{fileUri:r.uri,meta:toMeta(s)}:(t.delete(e),indexBytes-=s.bytes,schedulePersist(t),null)};export const removeEntry=async e=>{const t=await loadIndex(),s=t.get(e);s&&(t.delete(e),indexBytes-=s.bytes,deleteFile(s.fileName),schedulePersist(t))};export class AuthedImageHttpError extends Error{constructor(e,t){super(e),this.name="AuthedImageHttpError",this.status=t}}export const isPermanentRefusal=e=>e instanceof AuthedImageHttpError&&e.status>=400&&e.status<500&&408!==e.status&&429!==e.status;export const isFresh=(e,t,s=Date.now())=>s-e.fetchedAt<t;export const touchEntry=async e=>{const t=await loadIndex(),s=t.get(e);s&&(s.lastAccessedAt=Date.now(),s.lastAccessedAt-s.persistedAccessAt>=36e5&&schedulePersist(t))};const evictIfNeeded=e=>{let t=indexBytes;if(t<=byteCeiling)return 0;const s=[...e].sort(([,e],[,t])=>e.lastAccessedAt-t.lastAccessedAt);let r=0;for(const[i,a]of s){if(t<=byteCeiling)break;e.delete(i),indexBytes-=a.bytes,deleteFile(a.fileName),t-=a.bytes,r+=1}return r};export const clearAuthedImageCache=async()=>{null!==persistTimer&&(clearTimeout(persistTimer),persistTimer=null),persistTarget=null;(await loadIndex()).clear(),indexBytes=0;const e=new Directory(Paths.cache,FOLDER);e.exists&&e.delete(),isStorageAvailable()&&await Storage.removeItem(INDEX_KEY)};export const authedImageCacheStats=async()=>{const e=await loadIndex();let t=0;for(const s of e.values())t+=s.bytes;return{entries:e.size,bytes:t}};const responseHeader=(e,t)=>{if(!e||"object"!=typeof e)return;const s=e.get,r="function"==typeof s?s.call(e,t):e[t];return"string"==typeof r?r:void 0},originOf=e=>{const t=/^([a-z][a-z0-9+.-]*:\/\/[^/?#]+)/i.exec(e);return t?t[1].toLowerCase():null},isOwnApiAddress=e=>{const t=originOf(e);if(null===t)return!0;const s=getConfigValue("baseUrl");return"string"==typeof s&&originOf(s)===t},fetchAndStore=async(e,t,s)=>{const r={Accept:"image/*",...t.headers};if(!t.client&&t.authenticated&&isOwnApiAddress(t.uri)){const e=await getToken(ACCESS_TOKEN_KEY);e?.token&&(r.Authorization=`Bearer ${e.token}`)}const i=t.client??publicClient;let a;try{a=await i.get(t.uri,{headers:r,responseType:"arraybuffer",signal:s})}catch(e){const s=e?.response?.status;if("number"!=typeof s)throw e;throw new AuthedImageHttpError(`[@webority/mobile-ui] AuthedImage could not load "${t.uri}": the server answered ${s}. Check the URL and whether the request needs to be signed in (pass the signed-in client as \`client\`, or authenticated={false} for public media).`,s)}const n=new Uint8Array(a.data??new ArrayBuffer(0)),o=responseHeader(a.headers,"content-type"),c=(o?o.split(";")[0].trim():"")||"image/jpeg",l=await loadIndex(),d=Date.now(),u=`${e}-${d.toString(36)}`,g=imageFile(u);try{g.create({intermediates:!0,overwrite:!0}),g.write(n)}catch(e){throw new Error(`[@webority/mobile-ui] AuthedImage fetched "${t.uri}" but could not write it to the app's cache folder: ${e instanceof Error?e.message:String(e)}. The device may be out of storage.`)}const h={fetchedAt:d,bytes:n.byteLength,contentType:c,lastAccessedAt:d,fileName:u,persistedAccessAt:d},m=l.get(e);m&&(indexBytes-=m.bytes),l.set(e,h),indexBytes+=h.bytes,m&&m.fileName!==u&&deleteFile(m.fileName);const p=evictIfNeeded(l);return schedulePersist(l),p>0&&Logger.info(`[AuthedImage] evicted ${p} cached image(s) over the byte ceiling`),{fileUri:g.uri,meta:toMeta(h)}},inFlight=new Map;export const acquireFetch=(e,t)=>{const s=inFlight.get(e);if(s)return s.waiters+=1,s;const r=new AbortController,i={controller:r,waiters:1,promise:Promise.resolve()};return i.promise=fetchAndStore(e,t,r.signal).finally(()=>{inFlight.get(e)===i&&inFlight.delete(e)}),inFlight.set(e,i),i};export const releaseFetch=(e,t)=>{t.waiters-=1,t.waiters>0||(inFlight.get(e)===t&&inFlight.delete(e),t.controller.abort())};

package/lib/module/components/StatusBadge/StatusBadge.js

@@ -1 +1 @@
-"use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{deriveToneInk}from"../../theme/toneInk.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:{height:22,paddingX:"sm",text:"xs",dot:5,gap:"xs"},md:{height:24,paddingX:"md",text:"sm",dot:6,gap:"xs"}},sizeFor=(e,t)=>{const s=sizeMap[t];return{height:s.height,paddingH:e.space[s.paddingX],fontSize:e.text[s.text].size,dot:s.dot,gap:e.space[s.gap]}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{const{colors:s}=e;switch(t){case"success":return{base:s.success,on:s["on-success"],ink:s["success-text"]};case"warning":return{base:s.warning,on:s["on-warning"],ink:s["warning-text"]};case"danger":return{base:s.danger,on:s["on-danger"],ink:s["danger-text"]};case"info":return{base:s.info,on:s["on-info"],ink:s["info-text"]};case"primary":return{base:s.primary,on:s["on-primary"],ink:s["primary-text"]};default:return{base:s["text-muted"],on:s["on-neutral-strong"],ink:s["text-muted"]}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,s,o)=>{const r=isHex(o),{base:n,on:i,ink:a}=r?{base:o,on:e.colors["text-inverse"],ink:deriveToneInk(o,[e.colors.bg,e.colors["bg-subtle"],e.colors["bg-muted"]],e.mode)}:toneFor(e,t),l=!r&&"neutral"===t,d=l?e.colors["bg-muted"]:tintOf(n,.14,e.colors["bg-subtle"]),c=l?e.colors.border:tintOf(n,.4,n);switch(s){case"solid":return{fill:n,border:n,text:i,dot:i};case"outline":return{fill:"transparent",border:l?c:n,text:a,dot:n};default:return{fill:d,border:c,text:a,dot:n}}},StatusBadge=forwardRef((e,t)=>{const{label:s,tone:o="neutral",variant:r="soft",size:n="md",dot:i=!1,color:a,loading:l=!1,accessibilityLabel:d,style:c,textStyle:g,testID:u}=e,m=useTheme(),x=sizeFor(m,n),f=useMemo(()=>paletteFor(m,o,r,a),[m,o,r,a]);return l?_jsx(StatusBadgeSkeleton,{...e}):_jsxs(View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:d??s,testID:u,style:[styles.base,{minHeight:x.height,paddingHorizontal:x.paddingH,borderRadius:m.radius.pill,...smoothCorners,backgroundColor:f.fill,borderColor:f.border,borderWidth:1},c],children:[i?_jsx(View,{testID:"status-badge-dot",style:{width:x.dot,height:x.dot,borderRadius:x.dot/2,marginRight:x.gap,backgroundColor:f.dot}}):null,_jsx(Text,{style:[styles.label,{color:f.text,fontSize:x.fontSize,...fontFor(m,"semibold")},g],numberOfLines:1,maxFontSizeMultiplier:m.settings.maxFontSizeMultiplier,children:s})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:s,style:o})=>{const r=useTheme(),n=sizeFor(r,t),i=Math.max(32,Math.min(120,6.5*(e??"").length))+2*n.paddingH+(s?n.dot+n.gap:0);return _jsx(Skeleton,{width:i,height:n.height,radius:n.height/2,style:[styles.skeleton,o]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});export{StatusBadge};export default StatusBadge;
+"use strict";import{forwardRef,useMemo}from"react";import{StyleSheet,Text,View}from"react-native";import{fontFor,useTheme}from"../../theme/index.js";import{deriveToneInk}from"../../theme/toneInk.js";import{tintOf}from"../../utils/color.js";import{smoothCorners}from"../../utils/corners.js";import{Skeleton}from"../Skeleton/index.js";import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const sizeMap={sm:{height:22,paddingX:"sm",text:"xs",dot:5,gap:"xs"},md:{height:24,paddingX:"md",text:"sm",dot:6,gap:"xs"}},sizeFor=(e,t)=>{const s=sizeMap[t];return{height:s.height,paddingH:e.space[s.paddingX],fontSize:e.text[s.text].size,dot:s.dot,gap:e.space[s.gap]}},SOFT_FILL_OPACITY=.14,SOFT_BORDER_OPACITY=.4,BORDER_WIDTH=1,toneFor=(e,t)=>{const{colors:s}=e;switch(t){case"success":return{base:s.success,on:s["on-success"],ink:s["success-text"]};case"warning":return{base:s.warning,on:s["on-warning"],ink:s["warning-text"]};case"danger":return{base:s.danger,on:s["on-danger"],ink:s["danger-text"]};case"info":return{base:s.info,on:s["on-info"],ink:s["info-text"]};case"primary":return{base:s.primary,on:s["on-primary"],ink:s["primary-text"]};default:return{base:s["text-muted"],on:s["on-neutral-strong"],ink:s["text-muted"]}}},isHex=e=>"string"==typeof e&&/^#[0-9a-f]{6}$/i.test(e),paletteFor=(e,t,s,o)=>{const r=isHex(o),{base:n,on:i,ink:a}=r?{base:o,on:e.colors["text-inverse"],ink:deriveToneInk(o,[e.colors.bg,e.colors["bg-subtle"],e.colors["bg-muted"]],e.mode)}:toneFor(e,t),l=!r&&"neutral"===t,d=l?e.colors["bg-muted"]:tintOf(n,.14,e.colors["bg-subtle"]),c=l?e.colors.border:tintOf(n,.4,n);switch(s){case"solid":return{fill:n,border:n,text:i,dot:i};case"outline":return{fill:"transparent",border:l?c:n,text:a,dot:n};case"flat":return{fill:d,border:"transparent",text:a,dot:n};default:return{fill:d,border:c,text:a,dot:n}}},StatusBadge=forwardRef((e,t)=>{const{label:s,tone:o="neutral",variant:r="soft",size:n="md",dot:i=!1,color:a,loading:l=!1,accessibilityLabel:d,style:c,textStyle:g,testID:u}=e,m=useTheme(),x=sizeFor(m,n),f=useMemo(()=>paletteFor(m,o,r,a),[m,o,r,a]);return l?_jsx(StatusBadgeSkeleton,{...e}):_jsxs(View,{ref:t,accessible:!0,accessibilityRole:"text",accessibilityLabel:d??s,testID:u,style:[styles.base,{minHeight:x.height,paddingHorizontal:x.paddingH,borderRadius:m.radius.pill,...smoothCorners,backgroundColor:f.fill,borderColor:f.border,borderWidth:1},c],children:[i?_jsx(View,{testID:"status-badge-dot",style:{width:x.dot,height:x.dot,borderRadius:x.dot/2,marginRight:x.gap,backgroundColor:f.dot}}):null,_jsx(Text,{style:[styles.label,{color:f.text,fontSize:x.fontSize,...fontFor(m,"semibold")},g],numberOfLines:1,maxFontSizeMultiplier:m.settings.maxFontSizeMultiplier,children:s})]})});StatusBadge.displayName="StatusBadge";const StatusBadgeSkeleton=({label:e,size:t="md",dot:s,style:o})=>{const r=useTheme(),n=sizeFor(r,t),i=Math.max(32,Math.min(120,6.5*(e??"").length))+2*n.paddingH+(s?n.dot+n.gap:0);return _jsx(Skeleton,{width:i,height:n.height,radius:n.height/2,style:[styles.skeleton,o]})};StatusBadgeSkeleton.displayName="StatusBadgeSkeleton",StatusBadge.Skeleton=StatusBadgeSkeleton;const styles=StyleSheet.create({base:{alignSelf:"flex-start",flexDirection:"row",alignItems:"center",justifyContent:"center"},label:{textAlign:"center",includeFontPadding:!1,textAlignVertical:"center"},skeleton:{alignSelf:"flex-start"}});export{StatusBadge};export default StatusBadge;

package/lib/module/components/StatusBadge/StatusBadge.meta.js

@@ -1 +1 @@
-"use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"StatusBadge",marker:null,platforms:["phone"],acceptsChildren:!1,props:{label:{type:"string",required:!0,description:"The status as the reader should see it, such as Active or Pending review."},tone:{type:"enum",values:["success","warning","danger","info","primary","neutral"],default:"neutral",description:"The semantic colour."},variant:{type:"enum",values:["soft","outline","solid"],default:"soft",description:"Soft is a light tint with a tone border, outline drops the fill, solid fills with the tone."},size:{type:"enum",values:["sm","md"],default:"md",description:"A 22 or 24 point pill."},dot:{type:"boolean",default:!1,description:"A small disc before the label in the status colour."},color:{type:"string",description:"A status colour of the app's own as six-digit hex, for a status the backend names with a colour; it wins over the tone."},loading:{type:"boolean",default:!1,description:"Draws the skeleton placeholder at the pill's footprint."},accessibilityLabel:{type:"string",description:"Read instead of the label."}},omit:[],examples:[{id:"StatusBadge.default",title:"Active with a dot",props:{label:"Active",tone:"success",dot:!0}},{id:"StatusBadge.pending",title:"Pending review",props:{label:"Pending review",tone:"warning"}},{id:"StatusBadge.rejected",title:"Rejected outline",props:{label:"Rejected",tone:"danger",variant:"outline"}},{id:"StatusBadge.archived",title:"Archived solid",props:{label:"Archived",tone:"neutral",variant:"solid",size:"sm"}}],usage:{when:["Name a record's status in a semantic colour, such as Active, Pending or Rejected."],whenNot:[{text:"A status the person taps, selects or closes.",instead:"Chip"},{text:"A count anchored to an icon.",instead:"Badge"}],do:[{note:"Map the app's status to a label and a tone in one place, and send unknown statuses to neutral.",example:[{component:"StatusBadge",props:{label:"Active",tone:"success"}}]},{note:"Keep the label short and in the reader's words.",example:[{component:"StatusBadge",props:{label:"Done",tone:"success"}}]}],dont:[{note:"Do not map an unknown status to the danger tone.",example:[{component:"StatusBadge",props:{label:"Unknown",tone:"danger"}}]},{note:"Do not rely on the tone alone to say the status; the label always says it.",example:[{component:"StatusBadge",props:{label:"Success",tone:"success"}}]}],a11y:["It reads as plain text with the label as its name, so the label must carry the status without colour.","Use accessibilityLabel only when the spoken form needs more than the label."]}});
+"use strict";import{definePhoneMeta}from"../../canvasKit/meta.js";export const meta=definePhoneMeta()({name:"StatusBadge",marker:null,platforms:["phone"],acceptsChildren:!1,props:{label:{type:"string",required:!0,description:"The status as the reader should see it, such as Active or Pending review."},tone:{type:"enum",values:["success","warning","danger","info","primary","neutral"],default:"neutral",description:"The semantic colour."},variant:{type:"enum",values:["soft","flat","outline","solid"],default:"soft",description:"Soft is a light tint with a tone border, flat is the soft tint with no border, outline drops the fill, solid fills with the tone."},size:{type:"enum",values:["sm","md"],default:"md",description:"A 22 or 24 point pill."},dot:{type:"boolean",default:!1,description:"A small disc before the label in the status colour."},color:{type:"string",description:"A status colour of the app's own as six-digit hex, for a status the backend names with a colour; it wins over the tone."},loading:{type:"boolean",default:!1,description:"Draws the skeleton placeholder at the pill's footprint."},accessibilityLabel:{type:"string",description:"Read instead of the label."}},omit:[],examples:[{id:"StatusBadge.default",title:"Active with a dot",props:{label:"Active",tone:"success",dot:!0}},{id:"StatusBadge.pending",title:"Pending review",props:{label:"Pending review",tone:"warning"}},{id:"StatusBadge.rejected",title:"Rejected outline",props:{label:"Rejected",tone:"danger",variant:"outline"}},{id:"StatusBadge.flat",title:"Active flat",props:{label:"Active",tone:"success",variant:"flat"}},{id:"StatusBadge.archived",title:"Archived solid",props:{label:"Archived",tone:"neutral",variant:"solid",size:"sm"}}],usage:{when:["Name a record's status in a semantic colour, such as Active, Pending or Rejected."],whenNot:[{text:"A status the person taps, selects or closes.",instead:"Chip"},{text:"A count anchored to an icon.",instead:"Badge"}],do:[{note:"Map the app's status to a label and a tone in one place, and send unknown statuses to neutral.",example:[{component:"StatusBadge",props:{label:"Active",tone:"success"}}]},{note:"Keep the label short and in the reader's words.",example:[{component:"StatusBadge",props:{label:"Done",tone:"success"}}]}],dont:[{note:"Do not map an unknown status to the danger tone.",example:[{component:"StatusBadge",props:{label:"Unknown",tone:"danger"}}]},{note:"Do not rely on the tone alone to say the status; the label always says it.",example:[{component:"StatusBadge",props:{label:"Success",tone:"success"}}]}],a11y:["It reads as plain text with the label as its name, so the label must carry the status without colour.","Use accessibilityLabel only when the spoken form needs more than the label."]}});