@lmb-it/kitsconcerto-native 0.1.285 → 0.1.286
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/apps/mobile/src/ui/accordion/index.js +2 -2
- package/components/ImageCropper/compression.cjs +63 -0
- package/components/ImageCropper/compression.cjs.map +1 -0
- package/components/ImageCropper/compression.js +58 -0
- package/components/ImageCropper/compression.js.map +1 -0
- package/components/ImageCropper/constants.cjs +35 -0
- package/components/ImageCropper/constants.cjs.map +1 -0
- package/components/ImageCropper/constants.js +23 -0
- package/components/ImageCropper/constants.js.map +1 -0
- package/components/ImageCropper/cropperState.cjs +119 -0
- package/components/ImageCropper/cropperState.cjs.map +1 -0
- package/components/ImageCropper/cropperState.js +114 -0
- package/components/ImageCropper/cropperState.js.map +1 -0
- package/components/ImageCropper/encode.cjs +45 -0
- package/components/ImageCropper/encode.cjs.map +1 -0
- package/components/ImageCropper/encode.js +42 -0
- package/components/ImageCropper/encode.js.map +1 -0
- package/components/ImageCropper/encoderRegistry.cjs +13 -0
- package/components/ImageCropper/encoderRegistry.cjs.map +1 -0
- package/components/ImageCropper/encoderRegistry.js +9 -0
- package/components/ImageCropper/encoderRegistry.js.map +1 -0
- package/components/ImageCropper/encoders/rnImageEncoder.cjs +54 -0
- package/components/ImageCropper/encoders/rnImageEncoder.cjs.map +1 -0
- package/components/ImageCropper/encoders/rnImageEncoder.js +51 -0
- package/components/ImageCropper/encoders/rnImageEncoder.js.map +1 -0
- package/components/ImageCropper/geometry.cjs +208 -0
- package/components/ImageCropper/geometry.cjs.map +1 -0
- package/components/ImageCropper/geometry.js +186 -0
- package/components/ImageCropper/geometry.js.map +1 -0
- package/components/ImageCropper/index.cjs +436 -0
- package/components/ImageCropper/index.cjs.map +1 -0
- package/components/ImageCropper/index.js +434 -0
- package/components/ImageCropper/index.js.map +1 -0
- package/components/ImageCropper/pinchZoom.cjs +8 -0
- package/components/ImageCropper/pinchZoom.cjs.map +1 -0
- package/components/ImageCropper/pinchZoom.js +5 -0
- package/components/ImageCropper/pinchZoom.js.map +1 -0
- package/components/ImageCropper/useImageSource.cjs +87 -0
- package/components/ImageCropper/useImageSource.cjs.map +1 -0
- package/components/ImageCropper/useImageSource.js +84 -0
- package/components/ImageCropper/useImageSource.js.map +1 -0
- package/hooks/useComponentDefaults.cjs +12 -0
- package/hooks/useComponentDefaults.cjs.map +1 -1
- package/hooks/useComponentDefaults.js +12 -0
- package/hooks/useComponentDefaults.js.map +1 -1
- package/index.cjs +120 -115
- package/index.cjs.map +1 -1
- package/index.d.ts +394 -3
- package/index.js +2 -0
- package/index.js.map +1 -1
- package/package.json +13 -1
- package/packages/types/src/Theme/defaultTheme.cjs +111 -0
- package/packages/types/src/Theme/defaultTheme.cjs.map +1 -1
- package/packages/types/src/Theme/defaultTheme.js +111 -0
- package/packages/types/src/Theme/defaultTheme.js.map +1 -1
package/index.d.ts
CHANGED
|
@@ -925,7 +925,7 @@ export interface IRadioSlots extends IFormElementBaseSlots {
|
|
|
925
925
|
* `useComponentDefaults`) — derive from this to keep the runtime set
|
|
926
926
|
* in sync with the type contract automatically.
|
|
927
927
|
*/
|
|
928
|
-
export type AllSlotKeys = keyof IFormElementBaseSlots | keyof ITextInputSlots | keyof IDatepickerSlots | keyof ISelectSlots | keyof IChipInputSlots | keyof IMultiSelectSlots | keyof ISwitchSlots | keyof ICheckboxSlots | keyof IRadioSlots;
|
|
928
|
+
export type AllSlotKeys = keyof IFormElementBaseSlots | keyof ITextInputSlots | keyof IDatepickerSlots | keyof ISelectSlots | keyof IChipInputSlots | keyof IMultiSelectSlots | keyof ISwitchSlots | keyof ICheckboxSlots | keyof IRadioSlots | keyof IImageCropperSlots;
|
|
929
929
|
/**
|
|
930
930
|
* Wide superset of every form-element slot — the union of all
|
|
931
931
|
* form-element slot interfaces.
|
|
@@ -975,6 +975,81 @@ export interface IButtonElementSlots {
|
|
|
975
975
|
/** The text label inside the button */
|
|
976
976
|
label?: IElementSlotConfig;
|
|
977
977
|
}
|
|
978
|
+
/**
|
|
979
|
+
* Element slots for ImageCropper.
|
|
980
|
+
*
|
|
981
|
+
* ⛔ THE CROPPER IS DRAWN, NOT COMPOSED, SO IT NEEDS SLOTS NOTHING ELSE HAS.
|
|
982
|
+
* A shade that dims everything outside the window, a window outline, thirds
|
|
983
|
+
* guides, eight grips, a zoom readout — none of these is a Button or a Card
|
|
984
|
+
* with a different colour, and a consumer who cannot reach them cannot make
|
|
985
|
+
* the cropper look like the rest of their product. Eight new keys below; the
|
|
986
|
+
* rest are the names this library already uses for the same jobs.
|
|
987
|
+
*
|
|
988
|
+
* ⚠️ A SLOT ADDED HERE IS INERT UNTIL IT IS ADDED TO `ELEMENT_SLOT_KEYS` IN
|
|
989
|
+
* `useComponentDefaults.ts` TOO. That allowlist is what decides whether a slot
|
|
990
|
+
* is merged at all; a key in this interface and not in that set type-checks
|
|
991
|
+
* perfectly, themes without complaint, and renders nothing. See the note on
|
|
992
|
+
* that constant — it has caught this before.
|
|
993
|
+
*/
|
|
994
|
+
export interface IImageCropperSlots {
|
|
995
|
+
/** The whole component's outer shell — border, radius, background. */
|
|
996
|
+
root?: IElementSlotConfig;
|
|
997
|
+
/** Top bar: title on one side, close on the other. */
|
|
998
|
+
header?: IElementSlotConfig;
|
|
999
|
+
/** The header's text. */
|
|
1000
|
+
title?: IElementSlotConfig;
|
|
1001
|
+
/** Everything between header and footer — stage plus preview. */
|
|
1002
|
+
content?: IElementSlotConfig;
|
|
1003
|
+
/**
|
|
1004
|
+
* The STAGE: the bounded box the image and the crop window live in.
|
|
1005
|
+
*
|
|
1006
|
+
* ⚠️ ITS SIZE IS THE VIEWPORT THE GEOMETRY IS WRITTEN AGAINST, so a
|
|
1007
|
+
* padding here changes what every pointer coordinate means. That is
|
|
1008
|
+
* intended — it is measured, not assumed — but it is not merely cosmetic.
|
|
1009
|
+
*/
|
|
1010
|
+
container?: IElementSlotConfig;
|
|
1011
|
+
/** The action row — cancel, rotate, reset, save. */
|
|
1012
|
+
footer?: IElementSlotConfig;
|
|
1013
|
+
/** Icons inside the toolbar buttons. */
|
|
1014
|
+
icon?: IElementSlotConfig;
|
|
1015
|
+
/** Secondary text: the hint line, the "JPG · 320 KB" readout. */
|
|
1016
|
+
text?: IElementSlotConfig;
|
|
1017
|
+
/**
|
|
1018
|
+
* The crop window's own chrome — its outline and corner radius. The shape
|
|
1019
|
+
* that gets CUT OUT of the shade is `mask`; this is the line drawn on top.
|
|
1020
|
+
*/
|
|
1021
|
+
cropWindow?: IElementSlotConfig;
|
|
1022
|
+
/**
|
|
1023
|
+
* The dimmed region OUTSIDE the crop window.
|
|
1024
|
+
*
|
|
1025
|
+
* ⚠️ ITS `backgroundColor` WANTS AN ALPHA TOKEN, not a solid colour —
|
|
1026
|
+
* `black-alpha-60` and friends are literal in both colour modes precisely
|
|
1027
|
+
* so a scrim never inverts. A solid value here hides the image completely.
|
|
1028
|
+
*/
|
|
1029
|
+
shade?: IElementSlotConfig;
|
|
1030
|
+
/** The rule-of-thirds guides drawn inside the window. */
|
|
1031
|
+
gridLine?: IElementSlotConfig;
|
|
1032
|
+
/** One of the eight resize grips. */
|
|
1033
|
+
handle?: IElementSlotConfig;
|
|
1034
|
+
/** The pill that reads back the current zoom. */
|
|
1035
|
+
zoomChip?: IElementSlotConfig;
|
|
1036
|
+
/** The box around the live preview of the cropped result. */
|
|
1037
|
+
previewFrame?: IElementSlotConfig;
|
|
1038
|
+
/** The "drop an image here" target shown before a source is chosen. */
|
|
1039
|
+
dropZone?: IElementSlotConfig;
|
|
1040
|
+
/** The filled portion of the processing/compression bar. */
|
|
1041
|
+
progressFill?: IElementSlotConfig;
|
|
1042
|
+
/**
|
|
1043
|
+
* The crop window's cut-out SHAPE — a circle for avatars, a rect for
|
|
1044
|
+
* covers. Shares the Sidebar's `mask` name because it does the same job:
|
|
1045
|
+
* the overlay geometry, not the chrome drawn over it.
|
|
1046
|
+
*/
|
|
1047
|
+
mask?: IElementSlotConfig;
|
|
1048
|
+
/** Zoom slider rail. Same name, same job, as the Switch's. */
|
|
1049
|
+
track?: IElementSlotConfig;
|
|
1050
|
+
/** Zoom slider knob. */
|
|
1051
|
+
thumb?: IElementSlotConfig;
|
|
1052
|
+
}
|
|
978
1053
|
/** Element slots for Card */
|
|
979
1054
|
export interface ICardElementSlots {
|
|
980
1055
|
/** The card root element (outer container) */
|
|
@@ -1380,6 +1455,7 @@ export interface IKitsComponentDefaults {
|
|
|
1380
1455
|
*/
|
|
1381
1456
|
Table?: IComponentThemeConfig<ITableElementSlots> & ITableFlatConfig;
|
|
1382
1457
|
Sidebar?: IComponentThemeConfig<ISidebarElementSlots>;
|
|
1458
|
+
ImageCropper?: IComponentThemeConfig<IImageCropperSlots>;
|
|
1383
1459
|
Accordion?: IComponentThemeConfig<IAccordionElementSlots>;
|
|
1384
1460
|
Group?: IComponentThemeConfig<IGroupElementSlots>;
|
|
1385
1461
|
Header?: IComponentThemeConfig<IHeaderElementSlots>;
|
|
@@ -8143,6 +8219,249 @@ export interface IWidgetData<T> {
|
|
|
8143
8219
|
};
|
|
8144
8220
|
}
|
|
8145
8221
|
|
|
8222
|
+
/**
|
|
8223
|
+
* The vocabulary the cropper's geometry is written in.
|
|
8224
|
+
*
|
|
8225
|
+
* ⛔ THREE COORDINATE SPACES, AND CONFUSING TWO OF THEM IS THE WHOLE BUG CLASS
|
|
8226
|
+
* THIS FILE EXISTS TO NAME. Every rect and point below belongs to exactly one
|
|
8227
|
+
* of them, and a function that crosses between them says so in its name.
|
|
8228
|
+
*
|
|
8229
|
+
* SOURCE — the original image's own pixels, before any rotation. The only
|
|
8230
|
+
* space a crop can finally be expressed in, because it is the only
|
|
8231
|
+
* one the decoder understands.
|
|
8232
|
+
* ORIENTED — source after a 90°-step rotation. Same pixels, and for 90/270 the
|
|
8233
|
+
* width and height have SWAPPED. Still image pixels, not screen.
|
|
8234
|
+
* VIEWPORT — the on-screen stage, in layout units (CSS px on web, DIP on
|
|
8235
|
+
* native). This is where the crop window and the pointer live.
|
|
8236
|
+
*
|
|
8237
|
+
* ⚠️ VIEWPORT UNITS ARE NOT DEVICE PIXELS and this module never converts to
|
|
8238
|
+
* them. A retina screen draws the same viewport rect over twice as many device
|
|
8239
|
+
* pixels; that is the renderer's business. Mixing the two is how a crop comes
|
|
8240
|
+
* out half size on one device and right on another.
|
|
8241
|
+
*/
|
|
8242
|
+
/** Width and height, in whichever space the function taking it names. */
|
|
8243
|
+
export interface ICropSize {
|
|
8244
|
+
width: number;
|
|
8245
|
+
height: number;
|
|
8246
|
+
}
|
|
8247
|
+
/** A point, in whichever space the function taking it names. */
|
|
8248
|
+
export interface ICropPoint {
|
|
8249
|
+
x: number;
|
|
8250
|
+
y: number;
|
|
8251
|
+
}
|
|
8252
|
+
/** An axis-aligned rect: `x`/`y` are its TOP-LEFT corner. */
|
|
8253
|
+
export interface ICropRect extends ICropSize, ICropPoint {
|
|
8254
|
+
}
|
|
8255
|
+
/**
|
|
8256
|
+
* Display rotation in 90° steps, CLOCKWISE.
|
|
8257
|
+
*
|
|
8258
|
+
* ⚠️ CLOCKWISE IS A CHOICE, AND IT IS THE ONE THE "ROTATE" BUTTON MAKES. Both
|
|
8259
|
+
* platform encoders are told the same number, so flipping this convention means
|
|
8260
|
+
* flipping it in three places at once.
|
|
8261
|
+
*/
|
|
8262
|
+
export type CropRotation = 0 | 90 | 180 | 270;
|
|
8263
|
+
/**
|
|
8264
|
+
* Where the oriented image sits on the stage: scaled by `scale`, then its
|
|
8265
|
+
* top-left placed at (`x`, `y`) in VIEWPORT space.
|
|
8266
|
+
*
|
|
8267
|
+
* ⚠️ `x`/`y` ARE THE IMAGE'S TOP-LEFT, NOT ITS CENTRE. A centre-based transform
|
|
8268
|
+
* is equally valid and reads better for pinch gestures — it is not what this
|
|
8269
|
+
* module uses, and the two differ by half a scaled image.
|
|
8270
|
+
*/
|
|
8271
|
+
export interface ICropTransform {
|
|
8272
|
+
scale: number;
|
|
8273
|
+
x: number;
|
|
8274
|
+
y: number;
|
|
8275
|
+
}
|
|
8276
|
+
/** The eight resize grips, named for the compass edge they sit on. */
|
|
8277
|
+
export type CropHandle = 'n' | 's' | 'e' | 'w' | 'ne' | 'nw' | 'se' | 'sw';
|
|
8278
|
+
/** `[width, height]` — e.g. `[1, 1]` for a square, `[16, 9]` for a cover. */
|
|
8279
|
+
export type CropAspect = readonly [number, number];
|
|
8280
|
+
/** Options for {@link resizeRect}. */
|
|
8281
|
+
export interface ICropResizeOptions {
|
|
8282
|
+
/** Locked width ÷ height. Omit for a free resize. */
|
|
8283
|
+
ratio?: number;
|
|
8284
|
+
/** Floor on the result, in viewport units. */
|
|
8285
|
+
min?: ICropSize;
|
|
8286
|
+
/** The result may not leave this rect — except where `min` forbids it. */
|
|
8287
|
+
bounds?: ICropRect;
|
|
8288
|
+
}
|
|
8289
|
+
|
|
8290
|
+
/** What the crop window is cut to. */
|
|
8291
|
+
export type CropMaskShape = "circle" | "rectangle";
|
|
8292
|
+
/** Encoders both platforms can actually produce. */
|
|
8293
|
+
export type CropOutputFormat = "jpeg" | "png" | "webp";
|
|
8294
|
+
/**
|
|
8295
|
+
* What the cropper is asked to produce.
|
|
8296
|
+
*
|
|
8297
|
+
* ⚠️ EVERY FIELD IS A CEILING, NOT A TARGET. A 200×200 source asked for at most
|
|
8298
|
+
* 1024×1024 comes back 200×200 — upscaling invents detail and charges bytes for
|
|
8299
|
+
* it. Likewise `maxBytes` is "no larger than", reached by lowering quality and
|
|
8300
|
+
* then, only if that is not enough, by scaling down.
|
|
8301
|
+
*/
|
|
8302
|
+
export interface ICropOutput {
|
|
8303
|
+
/** Ceiling on the result's width, in image pixels. */
|
|
8304
|
+
maxWidth?: number;
|
|
8305
|
+
/** Ceiling on the result's height, in image pixels. */
|
|
8306
|
+
maxHeight?: number;
|
|
8307
|
+
/**
|
|
8308
|
+
* Ceiling on the encoded file size, in BYTES. Defaults to 500 KB.
|
|
8309
|
+
*
|
|
8310
|
+
* ⚠️ `png` IS LOSSLESS, SO QUALITY CANNOT BUY BYTES BACK. A PNG over the
|
|
8311
|
+
* ceiling can only be made smaller by shrinking its dimensions, and a PNG
|
|
8312
|
+
* of a photograph may not reach a tight ceiling at any sane size. Use
|
|
8313
|
+
* `jpeg` or `webp` when `maxBytes` matters.
|
|
8314
|
+
*/
|
|
8315
|
+
maxBytes?: number;
|
|
8316
|
+
/**
|
|
8317
|
+
* Encoder for the result. Defaults to `jpeg`.
|
|
8318
|
+
*
|
|
8319
|
+
* ⛔ THE OUTPUT FORMAT NEVER ECHOES THE INPUT'S. A HEIC chosen on an iPhone
|
|
8320
|
+
* is re-encoded to this format, which is how a photo that no browser would
|
|
8321
|
+
* display becomes one that every browser displays. The input's format is
|
|
8322
|
+
* never carried through.
|
|
8323
|
+
*/
|
|
8324
|
+
format?: CropOutputFormat;
|
|
8325
|
+
}
|
|
8326
|
+
/** What the cropper hands back. */
|
|
8327
|
+
export interface ICropResult {
|
|
8328
|
+
/**
|
|
8329
|
+
* The cropped image. A `blob:` object URL on web, a `file://` path on
|
|
8330
|
+
* native.
|
|
8331
|
+
*
|
|
8332
|
+
* ⛔ ON WEB THIS IS AN OBJECT URL THE CALLER NOW OWNS. It holds its blob in
|
|
8333
|
+
* memory until someone calls `URL.revokeObjectURL` on it; dropping the
|
|
8334
|
+
* reference does not free it. Revoke it once uploaded or once a later crop
|
|
8335
|
+
* replaces it.
|
|
8336
|
+
*/
|
|
8337
|
+
uri: string;
|
|
8338
|
+
/** The result's real pixel width, after every ceiling was applied. */
|
|
8339
|
+
width: number;
|
|
8340
|
+
/** The result's real pixel height. */
|
|
8341
|
+
height: number;
|
|
8342
|
+
/** The encoded size in bytes — what `maxBytes` was measured against. */
|
|
8343
|
+
size: number;
|
|
8344
|
+
/** The encoder that actually produced it. */
|
|
8345
|
+
format: CropOutputFormat;
|
|
8346
|
+
/** The blob itself, on web, for callers that would rather not re-fetch the URL. */
|
|
8347
|
+
blob?: Blob;
|
|
8348
|
+
}
|
|
8349
|
+
/** Why a crop could not be produced. */
|
|
8350
|
+
export type CropErrorReason =
|
|
8351
|
+
/** The source could not be decoded — most often a HEIC in a browser that has no decoder. */
|
|
8352
|
+
"decode-failed"
|
|
8353
|
+
/** The encoder could not reach `maxBytes` even at its smallest. */
|
|
8354
|
+
| "too-large"
|
|
8355
|
+
/** The platform refused the encode. */
|
|
8356
|
+
| "encode-failed";
|
|
8357
|
+
export interface ICropError {
|
|
8358
|
+
reason: CropErrorReason;
|
|
8359
|
+
/** A sentence fit to show a user. */
|
|
8360
|
+
message: string;
|
|
8361
|
+
}
|
|
8362
|
+
export interface IImageCropperProps {
|
|
8363
|
+
/**
|
|
8364
|
+
* The image to crop: a URL/URI, a `File` picked on web, or — on native — a
|
|
8365
|
+
* bundled asset straight from `require('./photo.png')`.
|
|
8366
|
+
*
|
|
8367
|
+
* ⛔ PREFER THE `require()` FORM ON NATIVE. React Native hands back an
|
|
8368
|
+
* asset id whose dimensions are already known, so the cropper reads them
|
|
8369
|
+
* synchronously from the asset registry. A bundled asset passed as a URI
|
|
8370
|
+
* STRING instead forces an `Image.getSize` round-trip to whatever host that
|
|
8371
|
+
* URI names — in development that is the Metro dev server, which a physical
|
|
8372
|
+
* phone frequently cannot reach, and in a release build it is not fetchable
|
|
8373
|
+
* that way at all. Both failures surface as
|
|
8374
|
+
* `onError({reason: 'decode-failed'})`, which reads like a corrupt image
|
|
8375
|
+
* and is not one.
|
|
8376
|
+
*
|
|
8377
|
+
* ⚠️ THE `require()` FORM IS NATIVE-ONLY and is reported, not ignored, on
|
|
8378
|
+
* web: a bundler there resolves `require` of an image to a URL string or a
|
|
8379
|
+
* module object, never to React Native's numeric asset id.
|
|
8380
|
+
*
|
|
8381
|
+
* ⚠️ A HEIC `File` IS ACCEPTED AND MAY STILL FAIL TO DECODE ON WEB. Safari
|
|
8382
|
+
* decodes HEIC; Chrome and Firefox do not, and no amount of re-encoding
|
|
8383
|
+
* helps because the pixels were never read. That case arrives as
|
|
8384
|
+
* `onError({reason: 'decode-failed'})` with a sentence saying so, rather
|
|
8385
|
+
* than as a blank stage. Native decodes HEIC on both platforms.
|
|
8386
|
+
*/
|
|
8387
|
+
source?: string | File | number | null;
|
|
8388
|
+
/** Locked crop ratio as `[width, height]`. Defaults to `[1, 1]`. */
|
|
8389
|
+
aspect?: CropAspect;
|
|
8390
|
+
/** Circle for avatars, rectangle for covers. Defaults to `rectangle`. */
|
|
8391
|
+
maskShape?: CropMaskShape;
|
|
8392
|
+
/** Ceilings on the result. See {@link ICropOutput}. */
|
|
8393
|
+
output?: ICropOutput;
|
|
8394
|
+
/** The crop the user accepted. */
|
|
8395
|
+
onCrop?: (result: ICropResult) => void;
|
|
8396
|
+
/** The user backed out. */
|
|
8397
|
+
onCancel?: () => void;
|
|
8398
|
+
/** Something could not be done, with a reason fit to show. */
|
|
8399
|
+
onError?: (error: ICropError) => void;
|
|
8400
|
+
/**
|
|
8401
|
+
* A finger is on the stage (`true`), or has left it (`false`).
|
|
8402
|
+
*
|
|
8403
|
+
* ⛔ IT EXISTS FOR ONE JOB: TURNING OFF AN ENCLOSING `ScrollView` ON NATIVE.
|
|
8404
|
+
* A cropper lives inside a scrollable form, and iOS gives a vertical drag
|
|
8405
|
+
* to the scroll view before anything in the content can ask for it —
|
|
8406
|
+
* `UIScrollView` delays content touches, decides the gesture is a scroll,
|
|
8407
|
+
* and then never delivers it. Nothing rendered INSIDE that scroll view can
|
|
8408
|
+
* outvote it, so the owner of the scroll view has to stand down:
|
|
8409
|
+
*
|
|
8410
|
+
* ```tsx
|
|
8411
|
+
* const [framing, setFraming] = useState(false);
|
|
8412
|
+
* <ScrollView scrollEnabled={!framing}>
|
|
8413
|
+
* <ImageCropper onInteractionChange={setFraming} ... />
|
|
8414
|
+
* </ScrollView>
|
|
8415
|
+
* ```
|
|
8416
|
+
*
|
|
8417
|
+
* ⚠️ IT IS NOT NEEDED ON WEB, and is harmless there — the web stage stops
|
|
8418
|
+
* page scrolling itself with a non-passive wheel listener and pointer
|
|
8419
|
+
* capture, neither of which native has an equivalent for.
|
|
8420
|
+
*
|
|
8421
|
+
* ⚠️ AND IT IS A BELT, NOT THE ONLY BRACES. The native cropper already
|
|
8422
|
+
* claims the touch in a way that blocks the scroll view wherever the touch
|
|
8423
|
+
* reaches it at all; this is the deterministic fallback for the case where
|
|
8424
|
+
* it does not.
|
|
8425
|
+
*/
|
|
8426
|
+
onInteractionChange?: (active: boolean) => void;
|
|
8427
|
+
/** Shown in the header. Omit for no header. */
|
|
8428
|
+
title?: ReactNode;
|
|
8429
|
+
/** Hide the live preview of the result. */
|
|
8430
|
+
hidePreview?: boolean;
|
|
8431
|
+
/** Hide the rule-of-thirds guides. */
|
|
8432
|
+
hideGrid?: boolean;
|
|
8433
|
+
/**
|
|
8434
|
+
* Let the crop window be resized by its eight grips.
|
|
8435
|
+
*
|
|
8436
|
+
* ⚠️ WEB ONLY, AND ACCEPTED-AND-INERT ON NATIVE, the same contract `popup`
|
|
8437
|
+
* carries on the selects: a shared config stays valid on both surfaces
|
|
8438
|
+
* rather than making a consumer branch on platform. A finger has no hover
|
|
8439
|
+
* and a grip small enough to look right is too small to hit, so native
|
|
8440
|
+
* frames by pinch and pan against a fixed window instead.
|
|
8441
|
+
*/
|
|
8442
|
+
resizable?: boolean;
|
|
8443
|
+
/** Zoom ceiling, as a multiple of the scale that just covers the window. Defaults to 8. */
|
|
8444
|
+
maxZoom?: number;
|
|
8445
|
+
/** Labels, for translation. */
|
|
8446
|
+
labels?: {
|
|
8447
|
+
cancel?: string;
|
|
8448
|
+
save?: string;
|
|
8449
|
+
rotate?: string;
|
|
8450
|
+
reset?: string;
|
|
8451
|
+
zoom?: string;
|
|
8452
|
+
preview?: string;
|
|
8453
|
+
dropZone?: string;
|
|
8454
|
+
processing?: string;
|
|
8455
|
+
};
|
|
8456
|
+
/** Stable test id, forwarded to the stage. */
|
|
8457
|
+
testID?: string;
|
|
8458
|
+
/** Per-instance slot overrides, merged over the theme. */
|
|
8459
|
+
slots?: Partial<IImageCropperSlots>;
|
|
8460
|
+
/** Style on the outer shell. */
|
|
8461
|
+
style?: IStyleClasses;
|
|
8462
|
+
className?: string;
|
|
8463
|
+
}
|
|
8464
|
+
|
|
8146
8465
|
export interface ILoaderProps<TColor = string, TStyle = unknown, TLocal = Record<string, unknown>> {
|
|
8147
8466
|
localProps?: TLocal;
|
|
8148
8467
|
animating?: boolean;
|
|
@@ -8714,6 +9033,78 @@ declare function Avatar(props: IAvatarProps): React__default.JSX.Element;
|
|
|
8714
9033
|
*/
|
|
8715
9034
|
declare function AvatarStack(props: IAvatarStackProps): React__default.JSX.Element;
|
|
8716
9035
|
|
|
9036
|
+
declare function ImageCropper(rawProps: IImageCropperProps): React__default.JSX.Element;
|
|
9037
|
+
|
|
9038
|
+
/**
|
|
9039
|
+
* Where a host app plugs in the one thing the NATIVE cropper cannot do itself.
|
|
9040
|
+
*
|
|
9041
|
+
* ⛔ THIS FILE HAS NO `.native` SUFFIX ON PURPOSE, AND THAT IS NOT COSMETIC.
|
|
9042
|
+
* `rollup.web.config.mjs` treats any path containing `.native.` as EXTERNAL —
|
|
9043
|
+
* so a registry living in `encode.native.ts` and re-exported from the shared
|
|
9044
|
+
* `components` barrel would compile, and then emit a bare import of a native
|
|
9045
|
+
* file into the WEB bundle for a consumer's bundler to fail on. Found by
|
|
9046
|
+
* reading that config rather than by shipping it. The registry itself imports
|
|
9047
|
+
* nothing platform-specific, so a neutral name is also the honest one.
|
|
9048
|
+
*
|
|
9049
|
+
* ⚠️ THE WEB CROPPER NEVER CONSULTS THIS. It has a canvas and needs no
|
|
9050
|
+
* injection. A cross-platform app can therefore call `setCropEncoder` once at
|
|
9051
|
+
* start-up unconditionally: on web it is a harmless no-op, on a device it is
|
|
9052
|
+
* what makes Save work.
|
|
9053
|
+
*/
|
|
9054
|
+
export interface ICropEncoder {
|
|
9055
|
+
/**
|
|
9056
|
+
* Produce one encoded file.
|
|
9057
|
+
*
|
|
9058
|
+
* @param uri the source image
|
|
9059
|
+
* @param sourceRect the region to keep, in SOURCE pixels, rotation undone
|
|
9060
|
+
* @param sourceSize the source's full pixel size
|
|
9061
|
+
* @param rotation degrees clockwise to apply when saving
|
|
9062
|
+
* @param size the output's pixel size, already decided by the search
|
|
9063
|
+
* @param quality 0–1; ignored by lossless formats
|
|
9064
|
+
* @param format the encoder to use
|
|
9065
|
+
* @returns the written file's uri, its size in bytes, and — when the
|
|
9066
|
+
* implementation knows them — the dimensions it actually produced
|
|
9067
|
+
*
|
|
9068
|
+
* ⚠️ `width`/`height` ARE REPORTED BECAUSE THE REQUEST IS NOT ALWAYS THE
|
|
9069
|
+
* RESULT. The bare-React-Native encoder asks its resizer for a square
|
|
9070
|
+
* ceiling with `contain` (the only orientation-safe way to drive it), so
|
|
9071
|
+
* the output can land a pixel or two off the requested size. Reporting the
|
|
9072
|
+
* number back beats the caller assuming the one it asked for.
|
|
9073
|
+
*/
|
|
9074
|
+
(args: {
|
|
9075
|
+
uri: string;
|
|
9076
|
+
sourceRect: ICropRect;
|
|
9077
|
+
/**
|
|
9078
|
+
* The source's full size.
|
|
9079
|
+
*
|
|
9080
|
+
* ⚠️ THE BUNDLED ENCODER NO LONGER NEEDS THIS, and the field stays
|
|
9081
|
+
* anyway. It was added when that encoder rotated the file BEFORE
|
|
9082
|
+
* cropping it and therefore had to re-express the rect into the rotated
|
|
9083
|
+
* frame. Reordering the chain to crop first removed that mapping — but
|
|
9084
|
+
* the contract is public, any implementation that rotates first still
|
|
9085
|
+
* needs the dimensions, and they are free to carry. A canvas encoder
|
|
9086
|
+
* ignores the field entirely.
|
|
9087
|
+
*/
|
|
9088
|
+
sourceSize: ICropSize;
|
|
9089
|
+
rotation: number;
|
|
9090
|
+
size: ICropSize;
|
|
9091
|
+
quality: number;
|
|
9092
|
+
format: CropOutputFormat;
|
|
9093
|
+
}): Promise<{
|
|
9094
|
+
uri: string;
|
|
9095
|
+
bytes: number;
|
|
9096
|
+
width?: number;
|
|
9097
|
+
height?: number;
|
|
9098
|
+
}>;
|
|
9099
|
+
}
|
|
9100
|
+
/**
|
|
9101
|
+
* Register the native encoder. Call once, at app start, before the cropper is
|
|
9102
|
+
* used. Passing `null` unregisters it, which is what a test wants.
|
|
9103
|
+
*/
|
|
9104
|
+
declare const setCropEncoder: (next: ICropEncoder | null) => void;
|
|
9105
|
+
/** Whether a host app has wired one up. The native UI reads this to disable Save. */
|
|
9106
|
+
declare const hasCropEncoder: () => boolean;
|
|
9107
|
+
|
|
8717
9108
|
/**
|
|
8718
9109
|
* Stepper — horizontal progress indicator for multi-step flows.
|
|
8719
9110
|
*
|
|
@@ -15269,5 +15660,5 @@ declare const localeFiles: {
|
|
|
15269
15660
|
};
|
|
15270
15661
|
};
|
|
15271
15662
|
|
|
15272
|
-
export { ALPHA_COLOR_VARS, ALPHA_STEPS, ALPHA_TOKEN_NAMES, AccentEdge, CustomAccordion as Accordion, ActionCard, Alert, AlertDescription, AlertIcon, AlertTitle, KitsAnimatePresence as AnimatePresence, AnyFile, Avatar, AvatarStack, Badge, Banner, BottomTabBar, Box, BreadCrumb, BreadcrumbProvider, Button, Card, Carousel, Center, ChatBubble, Chip, CircularProgress, Collapse, CommandPalette, Container, CustomPopover, DEFAULT_NATIVE_SHADOWS, DataView, DataViewContext, DateSeparator, Delta, DetailList as DetailsList, Divider, Donut, DotGrid, EDateFormat, EKeyFilter, Editable, EmptyState, FIELD_LABEL_MARGIN, FIELD_MARGIN, Flex, Form, FormSelect, GUTTER, Gallery, Gauge, Form as GoForm, Datatable as GoTable, KitsGrid as Grid, KitsGridItem as GridItem, GroupedBars, HELPER_TEXT_MARGIN, HStack, Heading, Icon, IconMap, Image, KitsInputSwitch as InputSwitch, KeyboardNavContext, KitsAutoComplete, KitsBarChart, KitsCascadeSelect, KitsCheckbox as KitsCheckboxes, KitsConfirm, KitsConfirmPopup, KitsContainer, KitsInputCalendar as KitsDatepicker, KitsDialogControlled as KitsDialog, KitsDropdown, FilePicker as KitsFilePicker, KitsInputColorPicker, KitsInputLocation, KitsInputMask, KitsInputNumber, KitsInputPassword, KitsInputText, KitsInputTextarea, KitsLineChart, KitsListBox, KitsMultiSelect, KitsPhoneComponent, KitsRadar, KitsRadio as KitsRadios, RadiusPicker as KitsRadiusPicker, KitsSliders, KitsThemeProvider, KitsToast, KitsTreeSelect, Label, Legend, Link, List, ListItem, Loader, LocaleContext, LocaleContextProvider, MainContext, MainContextProvider, MapTile, MessageComposer, MessageReceipt, MetricCard, KitsMultiSelect as MultiSelect, PermissionsProvider, PersonCard, ProgressBar, RadiusPicker, RankedList, ReducedMotionProvider, Rise, SHADOW_PRESET_KEYS, SPACER, KitsScrollView as ScrollView, SegmentedControl, FormSelect as Select, SelectButton, Skeleton$1 as Skeleton, SkeletonRows, Skeleton as SkeletonText, Sparkline, StackedBars, StatCard, StatGroup, StatePill, StatusCard, Stepper, Striped, Svg, TableContext, Tabs, Text, ThemeContextProvider, Timeline, Tip, Tooltip, Translate, KitsTreeSelect as TreeSelect, TreeView, TriStateCheckbox, TypingIndicator, VStack, Wash, WidgetPanel, borderProperties, breakpoints, capitalizeFirstLetter, checkExtAgainstAccepted, checkNameDuplication, colorWithAlpha, dateTimeFormat, deepMerge, defaultSeverityTheme, defaultTheme, downloadCanvas, dynamicList, expandShadowNative, extendTheme, fileTypeIcon, fileValidation, filesExt, filesMemes, filesTypes, flattenSlotStyles, fontSizeMapping, formFileValidation, formatNumber, getActiveNativeShadows, getCombinedChildIds, getCustomDateTime, getDateElements, getDefaultValues, getMeme, getParams, getPropertyByPath, getType, getTypes, getURLParams, imagesExt, imagesMemes, imagesTypes, isAlphaToken, isNumber, isSemanticToken, isShadowPreset, isThemeToken, isToday, isValidURL, kitsMotion, listingProperties, localeFiles, allProperties as mapCssProperties, mergeRefs, nonPxProperties, propertiesWithoutCssEquivalent, pxProperties, resolveStyleRecord, resolveTokenValue, schemaBuilder, setActiveNativeShadows, shadowNative, shadowWeb, sizeMapping, sizingProperties, timeAgo, timeSince, toMemes, useAllSeverityColors, useBreadcrumb, useBreadcrumbTrail, useComponentDefaults, useCountUp, useDataView, useDialog, useDisclosure, useEnter, useFieldLogic, useFocusStyles, useFormFieldKeyboardNav, useFormManager, useKeyboardNav, useKeyboardNavProvider, useKitsColorScheme, useKitsConcerto, useKitsTheme, useLanguage, useMeasuredWidth, useNativeColorMap, usePermissions, usePopup, useReducedMotion, useResolvedElementStyles, useResolvedStyle, useRtlLineHeight, useScrollState, useSelectionController, useSeverityColors, useTable, useTheme, useThemedFont, useToast };
|
|
15273
|
-
export type { AlignmentsValues, AllSlotKeys, AnimationsValues, AvatarShape, AvatarSize, AvatarStatus, BannerAction, BannerStatus, BaseFieldProps, Booleanish, Breakpoint, CallbackProps, ChatBubbleTone, ChatBubbleVariant, ChipSeverity, ChipSize, ColorMode, ColorScale, ColorValue, Colors, ColorsType, ComponentSize, CustomSubmitButtonProps, DataTableFilterMeta, DataTableFilterMetaData, DataTableOperatorFilterMetaData, DataTableSelectionSingleChangeEvent, DataTableSortMeta, DeepPartial, DetailItemInputType, DynamicValue, ElementProps, EnteringAnimation, ExitingAnimation, ExpandedKeys, FetchError, FetchSuccess, FetchTableDataRes, FetchTablePaginationData, FieldWrapperProps, File$1 as File, FileUploaderTemplate, FileUploaderTemplateParams, FlexAlignmentsValues, FlexValues, FormBooleanEvent, FormBooleanTarget, FormEvent, FormTarget, GroupFieldConfigs, HighSizingValue, IAccentEdgeProps, IAccordionElementSlots, IAccordionProps, IActionCardProps, IAddressComponentValue, IAddressExperianFormat, IAddressFormat, IAddressFormatResults, IAddressSearchResults, IAlertComponent, IAlertProps, IAlignment, IAnimation, IAutoCompleteCore, IAutoCompleteElement, IAvatarElementSlots, IAvatarProps, IAvatarStackElementSlots, IAvatarStackProps, IBadgeProps, IBannerProps, IBarChartProps, IBaseValidation, IBasicSectionProps, IBg, IBodyTemplate, IBodyTemplateIcon, IBorder, IBottomTabBarElementSlots, IBottomTabBarProps, IBoxComponent, IBreadcrumbCrumb, IBreadcrumbProps, IBuilderAddressField, IBuilderCheckboxField, IBuilderContainerField, IBuilderDateField, IBuilderField, IBuilderFieldBase, IBuilderFieldExport, IBuilderFileField, IBuilderGroupField, IBuilderMultiselectField, IBuilderNumberField, IBuilderPhoneField, IBuilderRadiosField, IBuilderRadiusPickerField, IBuilderSectionField, IBuilderSelectField, IBuilderSwitchField, IBuilderTagsField, IBuilderTextField, IBuilderTextareaField, IButton, IButtonElementSlots, IButtonParams, IButtonProps, IButtonState, IButtonsFilter, ICanvasProps, ICardComponent, ICardElementSlots, ICarouselElementSlots, ICarouselProps, ICascadeSelect, ICascadeSelectCore, IChatBubbleElementSlots, IChatBubbleProps, ICheckbox, ICheckboxFilter, ICheckboxSlots, IChildren, IChildrenParams, IChipInputSlots, IChipProps, ICircularProgressProps, ICollapseProps, IColorPicker, IColumn, IColumnBase, ICombined, ICommandPaletteGroup, ICommandPaletteItem, ICommandPaletteProps, IComponentThemeConfig, IConditionGroupProps, IConditionRowProps, IConditionRule, IConditionsSectionProps, IConfirmDialogProps, IConfirmPopupProps, IContainer, IContainerCardProps, IContainerProps, IContextValues, ICountrySearchResults, ICssStyling, IDVButtonsFilter, IDVCheckboxFilter, IDVDateFilter, IDVDropdownFilter, IDVFilters, IDVMessages, IDVMultiselectFilter, IDVNumberFilter, IDVPaginationRequest, IDVPaginationResponse, IDVPaginationState, IDVPhoneFilter, IDVRangeFilter, IDVTextFilter, IDVTriStateFilter, IDataTableContextValues, IDataTableProps, IDataViewContextValues, IDataViewProps, IDataViewRefValues, IDatatableRefValues, IDate, IDateFilter, IDateProps, IDateSeparatorElementSlots, IDateSeparatorProps, IDateValidation, IDatepickerSlots, IDeltaProps, IDetailItem, IDetailListProps, IDialogButton, IDialogProps, IDialogRef, IDialogState, IDisplay, IDividerComponent, IDonutProps, IDonutSegment, IDotGridProps, IDoughnutChartProps, IDropdownCore, IDropdownFilter, IDropdownSelect, IEditableProps, IEditors, IEffects, IElementBase, IElementSlotConfig, IElementStyle, IEmail, IEmailSearchResults, IEmptyStateElementSlots, IEmptyStateProps, IFieldCardProps, IFieldCondition, IFieldPreviewProps, IFile, IFileUploader, IFileUploaderElement, IFileUploaderTypes, IFileValidation, IFilesExtTypeKeys, IFilters, IFlexAlignment, IFlexComponent, IFormAddon, IFormBuilderInternalState, IFormBuilderMeta, IFormBuilderPayload, IFormBuilderProps, IFormComponent, IFormElement, IFormElementBaseSlots, IFormElementSlots, IFormGrid, IFormListsElements, IFormSelect, IFormSelectElements, IFormSingleElement, IGalleryElementSlots, IGalleryItem, IGalleryProps, IGaugeProps, IGrid, IGridCellStyle, IGridComponent, IGridItem, IGridItemComponent, IGroup, IGroupCardProps, IGroupElementSlots, IGroupSettings, IGroupedBarsDatum, IGroupedBarsProps, IHeaderElementSlots, IHeadingComponent, IIconProps, IImageComponent, IImagesExtTypeKeys, IInteractivity, IKeyedColumn, IKitsAnimation, IKitsBarChartDatum, IKitsBarChartProps, IKitsCheckboxProps, IKitsComponentDefaults, IKitsContainer, IKitsDialogControlled, IKitsInputCalendar, IKitsInputColorPicker, IKitsInputLocation, IKitsInputMask, IKitsInputNumber, IKitsInputPassword, IKitsInputRating, IKitsInputSwitch, IKitsInputText, IKitsInputTextarea, IKitsLineChartProps, IKitsLineChartSeries, IKitsPhoneInput, IKitsRadioProps, IKitsTheme, IKitsThemeColors, IKitsThemeConfig, IKitsThemeContextValues, IKitsThemeFontSizes, IKitsThemeFontWeights, IKitsThemeFonts, IKitsThemeLineHeights, IKitsThemeRadii, IKitsThemeShadows, IKitsThemeSpacing, IKitsToastRef, ILabelElement, ILabelProps, ILanguage, ILayout, ILegendItem, ILegendProps, ILineChartProps, ILinkComponent, ILinkOverrides, IList, IListBoxCore, IListBoxElement, IListBoxSelect, IListItem, IListing, ILoaderProps, ILoadingIndicatorContext, ILocaleContextProps, ILocaleContextValues, ILocation, ILocationDetailsResponse, ILocationResponse, IMainContextProps, IMainContextValues, IMapTilePoint, IMapTileProps, IMemes, IMenuItem, IMessageComposerElementSlots, IMessageComposerProps, IMessageReceiptElementSlots, IMessageReceiptProps, IMessages, IMetricCardProps, IMinusButton, IModalComponent, IModalFormProps, IMultiSelect, IMultiSelectCore, IMultiSelectSlots, IMultiselect, IMultiselectFilter, INativeShadow, INonCrossPlatformTypes, INumberFilter, INumberInput, INumberProps, INumberValidation, IObjectGroup, IOneOfTypes, IOptionItem, IOptionsEditorProps, IOptionsSource, IPageISection, IPaginationRequest, IPaginationResponse, IPaginatorLabels, IPaletteItemProps, IPaletteProps, IPanelCustomSlot, IPassword, IPasswordProps, IPersonCardProps, IPhone, IPhoneFilter, IPhoneObjectValue, IPhoneValidationResults, IPhoneValue, IPieChartProps, IPlusButton, IPolarAreaChartProps, IPopoverProps, IProgressBarElementSlots, IProgressBarProps, IPropertiesPanelProps, IRTLDetection, IRadarChartProps, IRadarProps, IRadarSeries, IRadioCheckboxListItem, IRadioGroup, IRadioSlots, IRadiusPickerEvents, IRadiusPickerField, IRadiusPickerI18n, IRadiusPickerProps, IRangeFilter, IRankedListProps, IRankedListRow, IRef, IRepeatableSettings, IResponsiveElement, IRiseProps, ISVGComponent, IScrollViewComponent, ISegmentedControlOption, ISegmentedControlProps, ISelect, ISelectBase, ISelectCore, ISelectElement, ISelectSlots, ISelectType, ISelectedFile, ISelectedFileType, ISelectionValidation, ISeverityColorSlots, ISeverityThemeMap, IShadowDefinition, IShadowValue, ISidebarElementSlots, ISizing, ISkeleton, ISkeletonRowsProps, ISkeletonText, ISliderProps, ISpacing, ISparklineProps, IStackProps, IStackedBarsDatum, IStackedBarsProps, IStatCardElementSlots, IStatCardProps, IStatGroupElementSlots, IStatGroupProps, IStatePillProps, IStatisticsProps, IStats, IStatusCardProps, IStepperElementSlots, IStepperProps, IStripedProps, IStyleClasses, ISwitch, ISwitchSlots, ITabBarItem, ITabItem, ITableElementSlots, ITableFlatConfig, ITabsElementSlots, ITabsProps, ITags, IText, ITextComponent, ITextFieldProps, ITextFilter, ITextInput, ITextInputProps, ITextInputSlots, ITextValidation, ITextarea, IThemeContextProps, IThemeContextValues, ITimelineElementSlots, ITimelineItem, ITimelineProps, ITipProps, IToastAction, IToastFunction, IToastOptions, IToastParams, IToolbarProps, ITransforms, ITransition, ITranslatableInputProps, ITranslatableText, ITranslateComponent, ITreeItem, ITreeSelect, ITreeSelectCore, ITreeSelectElement, ITreeSelectNode, ITreeViewProps, ITriStateFilter, ITypingIndicatorElementSlots, ITypingIndicatorProps, IUnkeyedColumn, IUseCountUpOptions, IUseFormReturn, IUserAvatar, IValidationSectionProps, IWashProps, IWidgetBarIncomingProp, IWidgetChartContextProps, IWidgetChartProp, IWidgetData, IWidgetDoughnutIncomingProp, IWidgetLineIncomingProp, IWidgetPanelProps, IWidgetPieIncomingProp, IWidgetPolarAreaIncomingProp, IWidgetRadarIncomingProp, IconName, IconType, InputTextFieldProps, KitsBreakpoint, KitsConditionalObject, KitsDevice, KitsMotion, KitsOrientation, KitsPlatform, KitsResponsiveObject, KitsResponsiveValue, KitsThemeOverride, LabelVariant, LatLng, LoadMode, LoadingIndicatorRenderer, LogicFunction, MapInteraction, MeasurementValues, MessageReceiptState, Nullable, Numbering0_12, Numbering0_32, Numberish, OnCenterChange, OnLocationError, OnLocationFound, OnRadiusChange, OnRadiusValueChange, OnSubmitHandler, OnUnitChange, Orientation, PaginationState, PaginatorPageChangeEvent$1 as PaginatorPageChangeEvent, Permissions, PlatformKey, RadiusPickerDisplay, RadiusPickerLayout, RadiusPickerSize, RadiusUnit, RadiusValue, RenderLocationButtonProps, RenderMapProps, RenderSearchBoxProps, SelectFieldProps, SemanticColorTokens, ServerMethod, ServerResponse, ServerSideProps, SetManyOpts, Severity, Shades, ShadowPreset, Shapes, SidesValues, SizingNumbering, SizingValue, StatePillState, StepperVariant, TAcceptedFileType, TBuilderFieldType, TCheckboxRadioMode, TCheckboxRadioSize, TConditionAction, TConditionMatch, TConditionOperator, TDateBoundary, TDynamicFlag, TExternalFilterLabelMode, TFiltersLayout, TIsoFormat, TItemsPerRow, TKeyFilter, TLocationProvider, TPaginatorAlign, TextLabels, TextProps, ThemedFontKind, TimelineItemStatus, Timeout, TimingNumbering, ToastPosition, ToastSeverity, ToastSize, TooltipDataAttributes, TooltipProps, TreeChangeProps, TreeCheckboxSelectionKeyType, TreeCheckboxSelectionKeys, TreeNode, TreeNodeClickEvent, TreeNodeTemplateOptions, TreeProps, TreeRef, TreeSelectionEvent, Types, UseComponentDefaultsResult, UseDisclosureReturnType, UseFieldLogicElementProps, UseFieldLogicProps, UseFieldLogicReturn, UseFormManagerEvents, UseFormManagerReturn, UseToastApi, ValidationProps, children, clearFunction, downloadableFileResponse, settings1, settings2 };
|
|
15663
|
+
export { ALPHA_COLOR_VARS, ALPHA_STEPS, ALPHA_TOKEN_NAMES, AccentEdge, CustomAccordion as Accordion, ActionCard, Alert, AlertDescription, AlertIcon, AlertTitle, KitsAnimatePresence as AnimatePresence, AnyFile, Avatar, AvatarStack, Badge, Banner, BottomTabBar, Box, BreadCrumb, BreadcrumbProvider, Button, Card, Carousel, Center, ChatBubble, Chip, CircularProgress, Collapse, CommandPalette, Container, CustomPopover, DEFAULT_NATIVE_SHADOWS, DataView, DataViewContext, DateSeparator, Delta, DetailList as DetailsList, Divider, Donut, DotGrid, EDateFormat, EKeyFilter, Editable, EmptyState, FIELD_LABEL_MARGIN, FIELD_MARGIN, Flex, Form, FormSelect, GUTTER, Gallery, Gauge, Form as GoForm, Datatable as GoTable, KitsGrid as Grid, KitsGridItem as GridItem, GroupedBars, HELPER_TEXT_MARGIN, HStack, Heading, Icon, IconMap, Image, ImageCropper, KitsInputSwitch as InputSwitch, KeyboardNavContext, KitsAutoComplete, KitsBarChart, KitsCascadeSelect, KitsCheckbox as KitsCheckboxes, KitsConfirm, KitsConfirmPopup, KitsContainer, KitsInputCalendar as KitsDatepicker, KitsDialogControlled as KitsDialog, KitsDropdown, FilePicker as KitsFilePicker, KitsInputColorPicker, KitsInputLocation, KitsInputMask, KitsInputNumber, KitsInputPassword, KitsInputText, KitsInputTextarea, KitsLineChart, KitsListBox, KitsMultiSelect, KitsPhoneComponent, KitsRadar, KitsRadio as KitsRadios, RadiusPicker as KitsRadiusPicker, KitsSliders, KitsThemeProvider, KitsToast, KitsTreeSelect, Label, Legend, Link, List, ListItem, Loader, LocaleContext, LocaleContextProvider, MainContext, MainContextProvider, MapTile, MessageComposer, MessageReceipt, MetricCard, KitsMultiSelect as MultiSelect, PermissionsProvider, PersonCard, ProgressBar, RadiusPicker, RankedList, ReducedMotionProvider, Rise, SHADOW_PRESET_KEYS, SPACER, KitsScrollView as ScrollView, SegmentedControl, FormSelect as Select, SelectButton, Skeleton$1 as Skeleton, SkeletonRows, Skeleton as SkeletonText, Sparkline, StackedBars, StatCard, StatGroup, StatePill, StatusCard, Stepper, Striped, Svg, TableContext, Tabs, Text, ThemeContextProvider, Timeline, Tip, Tooltip, Translate, KitsTreeSelect as TreeSelect, TreeView, TriStateCheckbox, TypingIndicator, VStack, Wash, WidgetPanel, borderProperties, breakpoints, capitalizeFirstLetter, checkExtAgainstAccepted, checkNameDuplication, colorWithAlpha, dateTimeFormat, deepMerge, defaultSeverityTheme, defaultTheme, downloadCanvas, dynamicList, expandShadowNative, extendTheme, fileTypeIcon, fileValidation, filesExt, filesMemes, filesTypes, flattenSlotStyles, fontSizeMapping, formFileValidation, formatNumber, getActiveNativeShadows, getCombinedChildIds, getCustomDateTime, getDateElements, getDefaultValues, getMeme, getParams, getPropertyByPath, getType, getTypes, getURLParams, hasCropEncoder, imagesExt, imagesMemes, imagesTypes, isAlphaToken, isNumber, isSemanticToken, isShadowPreset, isThemeToken, isToday, isValidURL, kitsMotion, listingProperties, localeFiles, allProperties as mapCssProperties, mergeRefs, nonPxProperties, propertiesWithoutCssEquivalent, pxProperties, resolveStyleRecord, resolveTokenValue, schemaBuilder, setActiveNativeShadows, setCropEncoder, shadowNative, shadowWeb, sizeMapping, sizingProperties, timeAgo, timeSince, toMemes, useAllSeverityColors, useBreadcrumb, useBreadcrumbTrail, useComponentDefaults, useCountUp, useDataView, useDialog, useDisclosure, useEnter, useFieldLogic, useFocusStyles, useFormFieldKeyboardNav, useFormManager, useKeyboardNav, useKeyboardNavProvider, useKitsColorScheme, useKitsConcerto, useKitsTheme, useLanguage, useMeasuredWidth, useNativeColorMap, usePermissions, usePopup, useReducedMotion, useResolvedElementStyles, useResolvedStyle, useRtlLineHeight, useScrollState, useSelectionController, useSeverityColors, useTable, useTheme, useThemedFont, useToast };
|
|
15664
|
+
export type { AlignmentsValues, AllSlotKeys, AnimationsValues, AvatarShape, AvatarSize, AvatarStatus, BannerAction, BannerStatus, BaseFieldProps, Booleanish, Breakpoint, CallbackProps, ChatBubbleTone, ChatBubbleVariant, ChipSeverity, ChipSize, ColorMode, ColorScale, ColorValue, Colors, ColorsType, ComponentSize, CropAspect, CropErrorReason, CropHandle, CropMaskShape, CropOutputFormat, CropRotation, CustomSubmitButtonProps, DataTableFilterMeta, DataTableFilterMetaData, DataTableOperatorFilterMetaData, DataTableSelectionSingleChangeEvent, DataTableSortMeta, DeepPartial, DetailItemInputType, DynamicValue, ElementProps, EnteringAnimation, ExitingAnimation, ExpandedKeys, FetchError, FetchSuccess, FetchTableDataRes, FetchTablePaginationData, FieldWrapperProps, File$1 as File, FileUploaderTemplate, FileUploaderTemplateParams, FlexAlignmentsValues, FlexValues, FormBooleanEvent, FormBooleanTarget, FormEvent, FormTarget, GroupFieldConfigs, HighSizingValue, IAccentEdgeProps, IAccordionElementSlots, IAccordionProps, IActionCardProps, IAddressComponentValue, IAddressExperianFormat, IAddressFormat, IAddressFormatResults, IAddressSearchResults, IAlertComponent, IAlertProps, IAlignment, IAnimation, IAutoCompleteCore, IAutoCompleteElement, IAvatarElementSlots, IAvatarProps, IAvatarStackElementSlots, IAvatarStackProps, IBadgeProps, IBannerProps, IBarChartProps, IBaseValidation, IBasicSectionProps, IBg, IBodyTemplate, IBodyTemplateIcon, IBorder, IBottomTabBarElementSlots, IBottomTabBarProps, IBoxComponent, IBreadcrumbCrumb, IBreadcrumbProps, IBuilderAddressField, IBuilderCheckboxField, IBuilderContainerField, IBuilderDateField, IBuilderField, IBuilderFieldBase, IBuilderFieldExport, IBuilderFileField, IBuilderGroupField, IBuilderMultiselectField, IBuilderNumberField, IBuilderPhoneField, IBuilderRadiosField, IBuilderRadiusPickerField, IBuilderSectionField, IBuilderSelectField, IBuilderSwitchField, IBuilderTagsField, IBuilderTextField, IBuilderTextareaField, IButton, IButtonElementSlots, IButtonParams, IButtonProps, IButtonState, IButtonsFilter, ICanvasProps, ICardComponent, ICardElementSlots, ICarouselElementSlots, ICarouselProps, ICascadeSelect, ICascadeSelectCore, IChatBubbleElementSlots, IChatBubbleProps, ICheckbox, ICheckboxFilter, ICheckboxSlots, IChildren, IChildrenParams, IChipInputSlots, IChipProps, ICircularProgressProps, ICollapseProps, IColorPicker, IColumn, IColumnBase, ICombined, ICommandPaletteGroup, ICommandPaletteItem, ICommandPaletteProps, IComponentThemeConfig, IConditionGroupProps, IConditionRowProps, IConditionRule, IConditionsSectionProps, IConfirmDialogProps, IConfirmPopupProps, IContainer, IContainerCardProps, IContainerProps, IContextValues, ICountrySearchResults, ICropEncoder, ICropError, ICropOutput, ICropPoint, ICropRect, ICropResizeOptions, ICropResult, ICropSize, ICropTransform, ICssStyling, IDVButtonsFilter, IDVCheckboxFilter, IDVDateFilter, IDVDropdownFilter, IDVFilters, IDVMessages, IDVMultiselectFilter, IDVNumberFilter, IDVPaginationRequest, IDVPaginationResponse, IDVPaginationState, IDVPhoneFilter, IDVRangeFilter, IDVTextFilter, IDVTriStateFilter, IDataTableContextValues, IDataTableProps, IDataViewContextValues, IDataViewProps, IDataViewRefValues, IDatatableRefValues, IDate, IDateFilter, IDateProps, IDateSeparatorElementSlots, IDateSeparatorProps, IDateValidation, IDatepickerSlots, IDeltaProps, IDetailItem, IDetailListProps, IDialogButton, IDialogProps, IDialogRef, IDialogState, IDisplay, IDividerComponent, IDonutProps, IDonutSegment, IDotGridProps, IDoughnutChartProps, IDropdownCore, IDropdownFilter, IDropdownSelect, IEditableProps, IEditors, IEffects, IElementBase, IElementSlotConfig, IElementStyle, IEmail, IEmailSearchResults, IEmptyStateElementSlots, IEmptyStateProps, IFieldCardProps, IFieldCondition, IFieldPreviewProps, IFile, IFileUploader, IFileUploaderElement, IFileUploaderTypes, IFileValidation, IFilesExtTypeKeys, IFilters, IFlexAlignment, IFlexComponent, IFormAddon, IFormBuilderInternalState, IFormBuilderMeta, IFormBuilderPayload, IFormBuilderProps, IFormComponent, IFormElement, IFormElementBaseSlots, IFormElementSlots, IFormGrid, IFormListsElements, IFormSelect, IFormSelectElements, IFormSingleElement, IGalleryElementSlots, IGalleryItem, IGalleryProps, IGaugeProps, IGrid, IGridCellStyle, IGridComponent, IGridItem, IGridItemComponent, IGroup, IGroupCardProps, IGroupElementSlots, IGroupSettings, IGroupedBarsDatum, IGroupedBarsProps, IHeaderElementSlots, IHeadingComponent, IIconProps, IImageComponent, IImageCropperProps, IImageCropperSlots, IImagesExtTypeKeys, IInteractivity, IKeyedColumn, IKitsAnimation, IKitsBarChartDatum, IKitsBarChartProps, IKitsCheckboxProps, IKitsComponentDefaults, IKitsContainer, IKitsDialogControlled, IKitsInputCalendar, IKitsInputColorPicker, IKitsInputLocation, IKitsInputMask, IKitsInputNumber, IKitsInputPassword, IKitsInputRating, IKitsInputSwitch, IKitsInputText, IKitsInputTextarea, IKitsLineChartProps, IKitsLineChartSeries, IKitsPhoneInput, IKitsRadioProps, IKitsTheme, IKitsThemeColors, IKitsThemeConfig, IKitsThemeContextValues, IKitsThemeFontSizes, IKitsThemeFontWeights, IKitsThemeFonts, IKitsThemeLineHeights, IKitsThemeRadii, IKitsThemeShadows, IKitsThemeSpacing, IKitsToastRef, ILabelElement, ILabelProps, ILanguage, ILayout, ILegendItem, ILegendProps, ILineChartProps, ILinkComponent, ILinkOverrides, IList, IListBoxCore, IListBoxElement, IListBoxSelect, IListItem, IListing, ILoaderProps, ILoadingIndicatorContext, ILocaleContextProps, ILocaleContextValues, ILocation, ILocationDetailsResponse, ILocationResponse, IMainContextProps, IMainContextValues, IMapTilePoint, IMapTileProps, IMemes, IMenuItem, IMessageComposerElementSlots, IMessageComposerProps, IMessageReceiptElementSlots, IMessageReceiptProps, IMessages, IMetricCardProps, IMinusButton, IModalComponent, IModalFormProps, IMultiSelect, IMultiSelectCore, IMultiSelectSlots, IMultiselect, IMultiselectFilter, INativeShadow, INonCrossPlatformTypes, INumberFilter, INumberInput, INumberProps, INumberValidation, IObjectGroup, IOneOfTypes, IOptionItem, IOptionsEditorProps, IOptionsSource, IPageISection, IPaginationRequest, IPaginationResponse, IPaginatorLabels, IPaletteItemProps, IPaletteProps, IPanelCustomSlot, IPassword, IPasswordProps, IPersonCardProps, IPhone, IPhoneFilter, IPhoneObjectValue, IPhoneValidationResults, IPhoneValue, IPieChartProps, IPlusButton, IPolarAreaChartProps, IPopoverProps, IProgressBarElementSlots, IProgressBarProps, IPropertiesPanelProps, IRTLDetection, IRadarChartProps, IRadarProps, IRadarSeries, IRadioCheckboxListItem, IRadioGroup, IRadioSlots, IRadiusPickerEvents, IRadiusPickerField, IRadiusPickerI18n, IRadiusPickerProps, IRangeFilter, IRankedListProps, IRankedListRow, IRef, IRepeatableSettings, IResponsiveElement, IRiseProps, ISVGComponent, IScrollViewComponent, ISegmentedControlOption, ISegmentedControlProps, ISelect, ISelectBase, ISelectCore, ISelectElement, ISelectSlots, ISelectType, ISelectedFile, ISelectedFileType, ISelectionValidation, ISeverityColorSlots, ISeverityThemeMap, IShadowDefinition, IShadowValue, ISidebarElementSlots, ISizing, ISkeleton, ISkeletonRowsProps, ISkeletonText, ISliderProps, ISpacing, ISparklineProps, IStackProps, IStackedBarsDatum, IStackedBarsProps, IStatCardElementSlots, IStatCardProps, IStatGroupElementSlots, IStatGroupProps, IStatePillProps, IStatisticsProps, IStats, IStatusCardProps, IStepperElementSlots, IStepperProps, IStripedProps, IStyleClasses, ISwitch, ISwitchSlots, ITabBarItem, ITabItem, ITableElementSlots, ITableFlatConfig, ITabsElementSlots, ITabsProps, ITags, IText, ITextComponent, ITextFieldProps, ITextFilter, ITextInput, ITextInputProps, ITextInputSlots, ITextValidation, ITextarea, IThemeContextProps, IThemeContextValues, ITimelineElementSlots, ITimelineItem, ITimelineProps, ITipProps, IToastAction, IToastFunction, IToastOptions, IToastParams, IToolbarProps, ITransforms, ITransition, ITranslatableInputProps, ITranslatableText, ITranslateComponent, ITreeItem, ITreeSelect, ITreeSelectCore, ITreeSelectElement, ITreeSelectNode, ITreeViewProps, ITriStateFilter, ITypingIndicatorElementSlots, ITypingIndicatorProps, IUnkeyedColumn, IUseCountUpOptions, IUseFormReturn, IUserAvatar, IValidationSectionProps, IWashProps, IWidgetBarIncomingProp, IWidgetChartContextProps, IWidgetChartProp, IWidgetData, IWidgetDoughnutIncomingProp, IWidgetLineIncomingProp, IWidgetPanelProps, IWidgetPieIncomingProp, IWidgetPolarAreaIncomingProp, IWidgetRadarIncomingProp, IconName, IconType, InputTextFieldProps, KitsBreakpoint, KitsConditionalObject, KitsDevice, KitsMotion, KitsOrientation, KitsPlatform, KitsResponsiveObject, KitsResponsiveValue, KitsThemeOverride, LabelVariant, LatLng, LoadMode, LoadingIndicatorRenderer, LogicFunction, MapInteraction, MeasurementValues, MessageReceiptState, Nullable, Numbering0_12, Numbering0_32, Numberish, OnCenterChange, OnLocationError, OnLocationFound, OnRadiusChange, OnRadiusValueChange, OnSubmitHandler, OnUnitChange, Orientation, PaginationState, PaginatorPageChangeEvent$1 as PaginatorPageChangeEvent, Permissions, PlatformKey, RadiusPickerDisplay, RadiusPickerLayout, RadiusPickerSize, RadiusUnit, RadiusValue, RenderLocationButtonProps, RenderMapProps, RenderSearchBoxProps, SelectFieldProps, SemanticColorTokens, ServerMethod, ServerResponse, ServerSideProps, SetManyOpts, Severity, Shades, ShadowPreset, Shapes, SidesValues, SizingNumbering, SizingValue, StatePillState, StepperVariant, TAcceptedFileType, TBuilderFieldType, TCheckboxRadioMode, TCheckboxRadioSize, TConditionAction, TConditionMatch, TConditionOperator, TDateBoundary, TDynamicFlag, TExternalFilterLabelMode, TFiltersLayout, TIsoFormat, TItemsPerRow, TKeyFilter, TLocationProvider, TPaginatorAlign, TextLabels, TextProps, ThemedFontKind, TimelineItemStatus, Timeout, TimingNumbering, ToastPosition, ToastSeverity, ToastSize, TooltipDataAttributes, TooltipProps, TreeChangeProps, TreeCheckboxSelectionKeyType, TreeCheckboxSelectionKeys, TreeNode, TreeNodeClickEvent, TreeNodeTemplateOptions, TreeProps, TreeRef, TreeSelectionEvent, Types, UseComponentDefaultsResult, UseDisclosureReturnType, UseFieldLogicElementProps, UseFieldLogicProps, UseFieldLogicReturn, UseFormManagerEvents, UseFormManagerReturn, UseToastApi, ValidationProps, children, clearFunction, downloadableFileResponse, settings1, settings2 };
|
package/index.js
CHANGED
|
@@ -35,6 +35,8 @@ export { SegmentedControl } from './components/SegmentedControl/index.js';
|
|
|
35
35
|
export { CommandPalette } from './components/overlay/CommandPalette/index.js';
|
|
36
36
|
export { StatePill } from './components/StatePill/index.js';
|
|
37
37
|
export { Avatar, AvatarStack } from './components/Avatar/index.js';
|
|
38
|
+
export { ImageCropper } from './components/ImageCropper/index.js';
|
|
39
|
+
export { hasCropEncoder, setCropEncoder } from './components/ImageCropper/encoderRegistry.js';
|
|
38
40
|
export { Stepper } from './components/Stepper/index.js';
|
|
39
41
|
export { StatCard, StatGroup } from './components/StatCard/index.js';
|
|
40
42
|
export { default as Rise } from './components/Rise/index.js';
|
package/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lmb-it/kitsconcerto-native",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.286",
|
|
4
4
|
"description": "KitsConcerto — Native (React Native) UI components",
|
|
5
5
|
"main": "index.cjs",
|
|
6
6
|
"module": "index.js",
|
|
@@ -38,15 +38,24 @@
|
|
|
38
38
|
"yup-password": "^0.4.0"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
|
+
"@bam.tech/react-native-image-resizer": "^3.0.11",
|
|
42
|
+
"@react-native-community/image-editor": "^5.0.0",
|
|
41
43
|
"chart.js": "^4.5.0",
|
|
42
44
|
"jspdf": "^3.0.1",
|
|
43
45
|
"lucide-react": "^0.400.0 || ^1.0.0",
|
|
44
46
|
"react": "^19.0.0",
|
|
45
47
|
"react-native": ">=0.70.0",
|
|
48
|
+
"react-native-gesture-handler": ">=2.0.0",
|
|
46
49
|
"react-router-dom": "^7.9.4",
|
|
47
50
|
"xlsx": "^0.18.4"
|
|
48
51
|
},
|
|
49
52
|
"peerDependenciesMeta": {
|
|
53
|
+
"@bam.tech/react-native-image-resizer": {
|
|
54
|
+
"optional": true
|
|
55
|
+
},
|
|
56
|
+
"@react-native-community/image-editor": {
|
|
57
|
+
"optional": true
|
|
58
|
+
},
|
|
50
59
|
"chart.js": {
|
|
51
60
|
"optional": true
|
|
52
61
|
},
|
|
@@ -59,6 +68,9 @@
|
|
|
59
68
|
"react-native": {
|
|
60
69
|
"optional": true
|
|
61
70
|
},
|
|
71
|
+
"react-native-gesture-handler": {
|
|
72
|
+
"optional": true
|
|
73
|
+
},
|
|
62
74
|
"react-router-dom": {
|
|
63
75
|
"optional": true
|
|
64
76
|
},
|
|
@@ -1202,6 +1202,117 @@ const defaultTheme = {
|
|
|
1202
1202
|
}
|
|
1203
1203
|
},
|
|
1204
1204
|
// ─── Sidebar ──────────────────────────────────────────
|
|
1205
|
+
// ─── ImageCropper ─────────────────────────────────
|
|
1206
|
+
// ⚠️ NUMBERS, NOT CSS STRINGS, FOR ANYTHING NATIVE ALSO READS — the
|
|
1207
|
+
// same rule `Input.inputGroup` carries: React Native's ViewStyle wants
|
|
1208
|
+
// `borderWidth: 1`, web treats the bare `1` as `1px`, and one shared
|
|
1209
|
+
// declaration then renders the same frame on both.
|
|
1210
|
+
ImageCropper: {
|
|
1211
|
+
root: {
|
|
1212
|
+
style: {
|
|
1213
|
+
backgroundColor: "surface-card",
|
|
1214
|
+
borderRadius: 16,
|
|
1215
|
+
overflow: "hidden"
|
|
1216
|
+
}
|
|
1217
|
+
},
|
|
1218
|
+
header: {
|
|
1219
|
+
style: {
|
|
1220
|
+
paddingLeft: 16,
|
|
1221
|
+
paddingRight: 16,
|
|
1222
|
+
paddingTop: 12,
|
|
1223
|
+
paddingBottom: 12,
|
|
1224
|
+
borderBottomWidth: 1,
|
|
1225
|
+
borderColor: "border"
|
|
1226
|
+
}
|
|
1227
|
+
},
|
|
1228
|
+
title: {
|
|
1229
|
+
style: { fontSize: 16, fontWeight: "600", fontColor: "text-primary" }
|
|
1230
|
+
},
|
|
1231
|
+
content: {
|
|
1232
|
+
style: { padding: 16, gap: 12 }
|
|
1233
|
+
},
|
|
1234
|
+
/* The stage. Dark on purpose: a photo reads against it in either
|
|
1235
|
+
colour mode, and a light stage makes every pale image look like
|
|
1236
|
+
it has no edges. */
|
|
1237
|
+
container: {
|
|
1238
|
+
style: {
|
|
1239
|
+
backgroundColor: "black-alpha-90",
|
|
1240
|
+
borderRadius: 12,
|
|
1241
|
+
overflow: "hidden"
|
|
1242
|
+
}
|
|
1243
|
+
},
|
|
1244
|
+
footer: {
|
|
1245
|
+
style: {
|
|
1246
|
+
paddingLeft: 16,
|
|
1247
|
+
paddingRight: 16,
|
|
1248
|
+
paddingTop: 12,
|
|
1249
|
+
paddingBottom: 12,
|
|
1250
|
+
borderTopWidth: 1,
|
|
1251
|
+
borderColor: "border",
|
|
1252
|
+
gap: 8
|
|
1253
|
+
}
|
|
1254
|
+
},
|
|
1255
|
+
icon: { style: { fontColor: "text-primary" } },
|
|
1256
|
+
text: { style: { fontSize: 12, fontColor: "text-secondary" } },
|
|
1257
|
+
/* ⛔ THE SCRIM IS AN ALPHA TOKEN, NOT A SOLID. `black-alpha-*` is
|
|
1258
|
+
literal in both colour modes — a scrim that inverted in dark mode
|
|
1259
|
+
would light UP the area the user is cropping away. */
|
|
1260
|
+
shade: { style: { backgroundColor: "black-alpha-60" } },
|
|
1261
|
+
cropWindow: { style: { borderWidth: 2, borderColor: "#FFFFFF" } },
|
|
1262
|
+
gridLine: { style: { backgroundColor: "white-alpha-40" } },
|
|
1263
|
+
handle: {
|
|
1264
|
+
style: {
|
|
1265
|
+
backgroundColor: "#FFFFFF",
|
|
1266
|
+
borderRadius: 2,
|
|
1267
|
+
width: 14,
|
|
1268
|
+
height: 14
|
|
1269
|
+
}
|
|
1270
|
+
},
|
|
1271
|
+
zoomChip: {
|
|
1272
|
+
style: {
|
|
1273
|
+
backgroundColor: "black-alpha-60",
|
|
1274
|
+
fontColor: "#FFFFFF",
|
|
1275
|
+
borderRadius: 999,
|
|
1276
|
+
paddingLeft: 10,
|
|
1277
|
+
paddingRight: 10,
|
|
1278
|
+
paddingTop: 2,
|
|
1279
|
+
paddingBottom: 2,
|
|
1280
|
+
fontSize: 12,
|
|
1281
|
+
fontWeight: "600"
|
|
1282
|
+
}
|
|
1283
|
+
},
|
|
1284
|
+
previewFrame: {
|
|
1285
|
+
style: {
|
|
1286
|
+
borderWidth: 1,
|
|
1287
|
+
borderColor: "border",
|
|
1288
|
+
borderRadius: 12,
|
|
1289
|
+
overflow: "hidden",
|
|
1290
|
+
backgroundColor: "bg-subtle"
|
|
1291
|
+
}
|
|
1292
|
+
},
|
|
1293
|
+
dropZone: {
|
|
1294
|
+
style: {
|
|
1295
|
+
borderWidth: 1,
|
|
1296
|
+
borderStyle: "dashed",
|
|
1297
|
+
borderColor: "border-strong",
|
|
1298
|
+
borderRadius: 12,
|
|
1299
|
+
backgroundColor: "bg-subtle",
|
|
1300
|
+
padding: 24
|
|
1301
|
+
}
|
|
1302
|
+
},
|
|
1303
|
+
progressFill: { style: { backgroundColor: "primary", height: 4 } },
|
|
1304
|
+
/* ⛔ THE SHAPE SLOT, AND IT CARRIES THE *RECTANGLE'S* RADIUS. The
|
|
1305
|
+
circle is NOT a 999 pill set here — `maskShape: 'circle'` makes
|
|
1306
|
+
the component use a true 50%, because a pill radius on a window
|
|
1307
|
+
that is wider than it is tall gives a STADIUM, not a circle.
|
|
1308
|
+
That is exactly what shipped for one render of the 16:9 cover
|
|
1309
|
+
story: 999 leaked out of this slot into the rectangle case and
|
|
1310
|
+
drew a lozenge. What belongs here is the corner rounding a
|
|
1311
|
+
RECTANGULAR window should have; the circle overrides it. */
|
|
1312
|
+
mask: { style: { borderRadius: 12 } },
|
|
1313
|
+
track: { style: { backgroundColor: "bg-accent", borderRadius: 999, height: 4 } },
|
|
1314
|
+
thumb: { style: { backgroundColor: "primary", borderRadius: 999 } }
|
|
1315
|
+
},
|
|
1205
1316
|
Sidebar: {
|
|
1206
1317
|
root: {
|
|
1207
1318
|
style: {
|