@bynder/compact-view 3.3.4 → 3.4.0
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/README.md +55 -0
- package/components.d.ts +3 -1
- package/components.js +106 -27
- package/index.d.ts +1 -0
- package/index.js +106 -27
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -45,3 +45,58 @@ class App extends React.Component {
|
|
|
45
45
|
}
|
|
46
46
|
ReactDOM.render(<App />, document.getElementById('app'));
|
|
47
47
|
```
|
|
48
|
+
|
|
49
|
+
See more info on [Bynder Docs](https://developer-docs.bynder.com/ui-components/#compact-view)
|
|
50
|
+
|
|
51
|
+
### Configuration
|
|
52
|
+
|
|
53
|
+
The optional `options` object accepts the following attributes (which are also all optional):
|
|
54
|
+
|
|
55
|
+
| Attribute | Description | Possible Values | Default Value |
|
|
56
|
+
| --------------------- | ------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------ | ----------------------------------------- |
|
|
57
|
+
| `onSuccess` | Comma separated list of asset types to display | `function (assets: asset[], { selectedFile?: File })): void` | `console.log` |
|
|
58
|
+
| `container` | A DOM element to act as the container for Compact View (disables modal) | A `Dom.HTMLElement` instance | None |
|
|
59
|
+
| `portal` | Portal config object | | None |
|
|
60
|
+
| `portal.url` | Set a default portal URL for the Compact View login screen | A string containing Bynder portal URL | None |
|
|
61
|
+
| `portal.readOnly` | If true, limits Compact View to a single portal | `true`, `false` | `false` |
|
|
62
|
+
| `defaultSearchTerm` | Set the initial value for search term | `"Keyword"` | None |
|
|
63
|
+
| `language` | Set language for the Compact View | `"en_US"`, `"nl_NL"`, `"de_DE"`, `"fr_FR"`, `"es_ES"`, | `"en_US"` |
|
|
64
|
+
| `mode` | Set the Compact View to allow multiple or single asset selection | `"SingleSelect"`, `"SingleSelectFile"`, `"MultiSelect"` | `"MultiSelect"` |
|
|
65
|
+
| `theme` | A `theme` object for customizing Compact View look and feel | Object (see below for recognized keys) | None |
|
|
66
|
+
| `assetTypes` | An array of strings for limiting allowed asset types | `AssetType[]` | `["image", "audio", "video", "document"]` |
|
|
67
|
+
| `hideExternalAccess` | If true, removes access to external DAM from assets and collections | `true`, `false` | `false` |
|
|
68
|
+
| `hideLimitedUse ` | If true, limited assets are hidden | `true`, `false` | `false` |
|
|
69
|
+
| `selectedAssets` | An array of asset ids. When mode is different than `MultiSelect`, the last id in the array will be selected | `["id1", "id2", "id3"]` | `[]` |
|
|
70
|
+
| `modalStyles` | An object with css properties for modal wrapper using strings as keys and values `{ [key: string]: string }` | `{"width": "100%"}` | None |
|
|
71
|
+
| `assetFieldSelection` | A multiline string containing desired asset fields | `string` | None |
|
|
72
|
+
| `assetFilter` | Set predefined filters for the Compact View | `AssetFilterJson` | None |
|
|
73
|
+
|
|
74
|
+
```ts
|
|
75
|
+
type File = {
|
|
76
|
+
url: string;
|
|
77
|
+
width?: number;
|
|
78
|
+
height?: number;
|
|
79
|
+
fileSize?: number;
|
|
80
|
+
};
|
|
81
|
+
|
|
82
|
+
type AssetFilterJson = {
|
|
83
|
+
assetType_in?: AssetType[]; //predefined asset types
|
|
84
|
+
collectionId?: string; //predefined collection id
|
|
85
|
+
metapropertyOptionId_in?: string[]; //predefined metaproperty IDs
|
|
86
|
+
searchTerm?: string; //predefined search term
|
|
87
|
+
tagNames_in?: string[]; //predefined tags
|
|
88
|
+
isLimitedUse?: boolean; //whether or not this asset is marked as Limited Use
|
|
89
|
+
showToolbar?: boolean; //show toolbar for predefined filters (false by default)
|
|
90
|
+
};
|
|
91
|
+
|
|
92
|
+
type AssetType = 'AUDIO' | 'DOCUMENT' | 'IMAGE' | 'VIDEO' | 'ARCHIVE';
|
|
93
|
+
|
|
94
|
+
type theme = {
|
|
95
|
+
colorPrimary?: CSSColor;
|
|
96
|
+
colorButtonPrimary?: CSSColor;
|
|
97
|
+
colorButtonPrimaryLabel?: CSSColor;
|
|
98
|
+
colorButtonPrimaryActive?: CSSColor;
|
|
99
|
+
colorButtonPrimaryHover?: CSSColor;
|
|
100
|
+
colorButtonPrimaryHoverLabel?: CSSColor;
|
|
101
|
+
};
|
|
102
|
+
```
|
package/components.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import React from "react";
|
|
3
|
+
import { BrowserClient } from "@sentry/browser";
|
|
3
4
|
interface MetapropertyOptionType {
|
|
4
5
|
id: string;
|
|
5
6
|
label: string;
|
|
@@ -171,8 +172,9 @@ declare function NoResults(props: Props$6): JSX.Element;
|
|
|
171
172
|
interface Props$7 {
|
|
172
173
|
error: Error;
|
|
173
174
|
onRetry: () => void;
|
|
175
|
+
sentryClient?: BrowserClient;
|
|
174
176
|
}
|
|
175
|
-
declare function Oops({ error, onRetry }: Props$7): JSX.Element;
|
|
177
|
+
declare function Oops({ error, onRetry, sentryClient }: Props$7): JSX.Element;
|
|
176
178
|
interface ShadowRootProps {
|
|
177
179
|
children: React.ReactNode;
|
|
178
180
|
isContainerMode?: boolean;
|