@carbon-labs/react-animated-header 0.21.0 → 0.23.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/es/__stories__/AnimatedHeader.stories.d.ts +0 -332
- package/es/components/AnimatedHeader/AnimatedHeader.js +19 -20
- package/es/components/TasksController/TasksController.js +7 -8
- package/es/components/Tiles/AIPromptTile/AIPromptTile.js +12 -13
- package/es/components/Tiles/GlassTile/GlassTile.js +14 -15
- package/es/components/Tiles/GlassTile/GlassTileBody.js +9 -10
- package/es/components/WorkspaceSelector/WorkspaceSelector.js +5 -6
- package/lib/__stories__/AnimatedHeader.stories.d.ts +0 -332
- package/lib/components/AnimatedHeader/AnimatedHeader.js +20 -21
- package/lib/components/TasksController/TasksController.js +7 -8
- package/lib/components/Tiles/AIPromptTile/AIPromptTile.js +12 -13
- package/lib/components/Tiles/GlassTile/GlassTile.js +14 -15
- package/lib/components/Tiles/GlassTile/GlassTileBody.js +9 -10
- package/lib/components/WorkspaceSelector/WorkspaceSelector.js +5 -6
- package/package.json +3 -3
- package/scss/AnimatedHeader/animated-header.scss +14 -56
- package/es/node_modules/@carbon/icons-react/es/Icon.js +0 -71
- package/es/node_modules/@carbon/icons-react/es/generated/bucket-3.js +0 -3181
- package/es/node_modules/@carbon/icons-react/es/iconPropTypes-4cbeb95d.js +0 -14
- package/es/node_modules/@carbon/icons-react/node_modules/@carbon/icon-helpers/es/index.js +0 -125
- package/lib/node_modules/@carbon/icons-react/es/Icon.js +0 -75
- package/lib/node_modules/@carbon/icons-react/es/generated/bucket-3.js +0 -3307
- package/lib/node_modules/@carbon/icons-react/es/iconPropTypes-4cbeb95d.js +0 -16
- package/lib/node_modules/@carbon/icons-react/node_modules/@carbon/icon-helpers/es/index.js +0 -128
|
@@ -8247,8 +8247,6 @@ export declare const ThemeG10: {
|
|
|
8247
8247
|
5: string;
|
|
8248
8248
|
6: string;
|
|
8249
8249
|
7: string;
|
|
8250
|
-
8: string;
|
|
8251
|
-
9: string;
|
|
8252
8250
|
};
|
|
8253
8251
|
};
|
|
8254
8252
|
options: number[];
|
|
@@ -8828,170 +8826,6 @@ export declare const ThemeG10: {
|
|
|
8828
8826
|
customContent: import("react/jsx-runtime").JSX.Element;
|
|
8829
8827
|
}[];
|
|
8830
8828
|
};
|
|
8831
|
-
8: {
|
|
8832
|
-
id: number;
|
|
8833
|
-
label: string;
|
|
8834
|
-
tiles: ({
|
|
8835
|
-
id: string;
|
|
8836
|
-
href: string;
|
|
8837
|
-
title: string;
|
|
8838
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8839
|
-
subtitle?: undefined;
|
|
8840
|
-
} | {
|
|
8841
|
-
id: string;
|
|
8842
|
-
href: string;
|
|
8843
|
-
title: string;
|
|
8844
|
-
subtitle: string;
|
|
8845
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8846
|
-
})[];
|
|
8847
|
-
} | {
|
|
8848
|
-
id: number;
|
|
8849
|
-
label: string;
|
|
8850
|
-
tiles: ({
|
|
8851
|
-
id: string;
|
|
8852
|
-
href: string;
|
|
8853
|
-
title: string;
|
|
8854
|
-
subtitle: string;
|
|
8855
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8856
|
-
secondaryIcon?: undefined;
|
|
8857
|
-
} | {
|
|
8858
|
-
id: string;
|
|
8859
|
-
href: string;
|
|
8860
|
-
title: string;
|
|
8861
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8862
|
-
secondaryIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8863
|
-
subtitle?: undefined;
|
|
8864
|
-
})[];
|
|
8865
|
-
} | {
|
|
8866
|
-
id: number;
|
|
8867
|
-
label: string;
|
|
8868
|
-
tiles: ({
|
|
8869
|
-
id: string;
|
|
8870
|
-
href: string;
|
|
8871
|
-
title: string;
|
|
8872
|
-
subtitle: string;
|
|
8873
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8874
|
-
isLoading: boolean;
|
|
8875
|
-
isDisabled?: undefined;
|
|
8876
|
-
secondaryIcon?: undefined;
|
|
8877
|
-
} | {
|
|
8878
|
-
id: string;
|
|
8879
|
-
title: string;
|
|
8880
|
-
subtitle: string;
|
|
8881
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8882
|
-
href?: undefined;
|
|
8883
|
-
isLoading?: undefined;
|
|
8884
|
-
isDisabled?: undefined;
|
|
8885
|
-
secondaryIcon?: undefined;
|
|
8886
|
-
} | {
|
|
8887
|
-
id: string;
|
|
8888
|
-
href: string;
|
|
8889
|
-
title: string;
|
|
8890
|
-
subtitle: string;
|
|
8891
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8892
|
-
isDisabled: boolean;
|
|
8893
|
-
isLoading?: undefined;
|
|
8894
|
-
secondaryIcon?: undefined;
|
|
8895
|
-
} | {
|
|
8896
|
-
id: string;
|
|
8897
|
-
href: string;
|
|
8898
|
-
title: string;
|
|
8899
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8900
|
-
secondaryIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8901
|
-
subtitle?: undefined;
|
|
8902
|
-
isLoading?: undefined;
|
|
8903
|
-
isDisabled?: undefined;
|
|
8904
|
-
})[];
|
|
8905
|
-
} | {
|
|
8906
|
-
id: number;
|
|
8907
|
-
label: string;
|
|
8908
|
-
tiles: {
|
|
8909
|
-
id: string;
|
|
8910
|
-
customContent: import("react/jsx-runtime").JSX.Element;
|
|
8911
|
-
}[];
|
|
8912
|
-
};
|
|
8913
|
-
9: {
|
|
8914
|
-
id: number;
|
|
8915
|
-
label: string;
|
|
8916
|
-
tiles: ({
|
|
8917
|
-
id: string;
|
|
8918
|
-
href: string;
|
|
8919
|
-
title: string;
|
|
8920
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8921
|
-
subtitle?: undefined;
|
|
8922
|
-
} | {
|
|
8923
|
-
id: string;
|
|
8924
|
-
href: string;
|
|
8925
|
-
title: string;
|
|
8926
|
-
subtitle: string;
|
|
8927
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8928
|
-
})[];
|
|
8929
|
-
} | {
|
|
8930
|
-
id: number;
|
|
8931
|
-
label: string;
|
|
8932
|
-
tiles: ({
|
|
8933
|
-
id: string;
|
|
8934
|
-
href: string;
|
|
8935
|
-
title: string;
|
|
8936
|
-
subtitle: string;
|
|
8937
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8938
|
-
secondaryIcon?: undefined;
|
|
8939
|
-
} | {
|
|
8940
|
-
id: string;
|
|
8941
|
-
href: string;
|
|
8942
|
-
title: string;
|
|
8943
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8944
|
-
secondaryIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8945
|
-
subtitle?: undefined;
|
|
8946
|
-
})[];
|
|
8947
|
-
} | {
|
|
8948
|
-
id: number;
|
|
8949
|
-
label: string;
|
|
8950
|
-
tiles: ({
|
|
8951
|
-
id: string;
|
|
8952
|
-
href: string;
|
|
8953
|
-
title: string;
|
|
8954
|
-
subtitle: string;
|
|
8955
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8956
|
-
isLoading: boolean;
|
|
8957
|
-
isDisabled?: undefined;
|
|
8958
|
-
secondaryIcon?: undefined;
|
|
8959
|
-
} | {
|
|
8960
|
-
id: string;
|
|
8961
|
-
title: string;
|
|
8962
|
-
subtitle: string;
|
|
8963
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8964
|
-
href?: undefined;
|
|
8965
|
-
isLoading?: undefined;
|
|
8966
|
-
isDisabled?: undefined;
|
|
8967
|
-
secondaryIcon?: undefined;
|
|
8968
|
-
} | {
|
|
8969
|
-
id: string;
|
|
8970
|
-
href: string;
|
|
8971
|
-
title: string;
|
|
8972
|
-
subtitle: string;
|
|
8973
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8974
|
-
isDisabled: boolean;
|
|
8975
|
-
isLoading?: undefined;
|
|
8976
|
-
secondaryIcon?: undefined;
|
|
8977
|
-
} | {
|
|
8978
|
-
id: string;
|
|
8979
|
-
href: string;
|
|
8980
|
-
title: string;
|
|
8981
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8982
|
-
secondaryIcon: import("@carbon/icons-react").CarbonIconType;
|
|
8983
|
-
subtitle?: undefined;
|
|
8984
|
-
isLoading?: undefined;
|
|
8985
|
-
isDisabled?: undefined;
|
|
8986
|
-
})[];
|
|
8987
|
-
} | {
|
|
8988
|
-
id: number;
|
|
8989
|
-
label: string;
|
|
8990
|
-
tiles: {
|
|
8991
|
-
id: string;
|
|
8992
|
-
customContent: import("react/jsx-runtime").JSX.Element;
|
|
8993
|
-
}[];
|
|
8994
|
-
};
|
|
8995
8829
|
};
|
|
8996
8830
|
};
|
|
8997
8831
|
tasksControllerConfig: {
|
|
@@ -17588,8 +17422,6 @@ export declare const ThemeG100: {
|
|
|
17588
17422
|
5: string;
|
|
17589
17423
|
6: string;
|
|
17590
17424
|
7: string;
|
|
17591
|
-
8: string;
|
|
17592
|
-
9: string;
|
|
17593
17425
|
};
|
|
17594
17426
|
};
|
|
17595
17427
|
options: number[];
|
|
@@ -18169,170 +18001,6 @@ export declare const ThemeG100: {
|
|
|
18169
18001
|
customContent: import("react/jsx-runtime").JSX.Element;
|
|
18170
18002
|
}[];
|
|
18171
18003
|
};
|
|
18172
|
-
8: {
|
|
18173
|
-
id: number;
|
|
18174
|
-
label: string;
|
|
18175
|
-
tiles: ({
|
|
18176
|
-
id: string;
|
|
18177
|
-
href: string;
|
|
18178
|
-
title: string;
|
|
18179
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18180
|
-
subtitle?: undefined;
|
|
18181
|
-
} | {
|
|
18182
|
-
id: string;
|
|
18183
|
-
href: string;
|
|
18184
|
-
title: string;
|
|
18185
|
-
subtitle: string;
|
|
18186
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18187
|
-
})[];
|
|
18188
|
-
} | {
|
|
18189
|
-
id: number;
|
|
18190
|
-
label: string;
|
|
18191
|
-
tiles: ({
|
|
18192
|
-
id: string;
|
|
18193
|
-
href: string;
|
|
18194
|
-
title: string;
|
|
18195
|
-
subtitle: string;
|
|
18196
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18197
|
-
secondaryIcon?: undefined;
|
|
18198
|
-
} | {
|
|
18199
|
-
id: string;
|
|
18200
|
-
href: string;
|
|
18201
|
-
title: string;
|
|
18202
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18203
|
-
secondaryIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18204
|
-
subtitle?: undefined;
|
|
18205
|
-
})[];
|
|
18206
|
-
} | {
|
|
18207
|
-
id: number;
|
|
18208
|
-
label: string;
|
|
18209
|
-
tiles: ({
|
|
18210
|
-
id: string;
|
|
18211
|
-
href: string;
|
|
18212
|
-
title: string;
|
|
18213
|
-
subtitle: string;
|
|
18214
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18215
|
-
isLoading: boolean;
|
|
18216
|
-
isDisabled?: undefined;
|
|
18217
|
-
secondaryIcon?: undefined;
|
|
18218
|
-
} | {
|
|
18219
|
-
id: string;
|
|
18220
|
-
title: string;
|
|
18221
|
-
subtitle: string;
|
|
18222
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18223
|
-
href?: undefined;
|
|
18224
|
-
isLoading?: undefined;
|
|
18225
|
-
isDisabled?: undefined;
|
|
18226
|
-
secondaryIcon?: undefined;
|
|
18227
|
-
} | {
|
|
18228
|
-
id: string;
|
|
18229
|
-
href: string;
|
|
18230
|
-
title: string;
|
|
18231
|
-
subtitle: string;
|
|
18232
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18233
|
-
isDisabled: boolean;
|
|
18234
|
-
isLoading?: undefined;
|
|
18235
|
-
secondaryIcon?: undefined;
|
|
18236
|
-
} | {
|
|
18237
|
-
id: string;
|
|
18238
|
-
href: string;
|
|
18239
|
-
title: string;
|
|
18240
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18241
|
-
secondaryIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18242
|
-
subtitle?: undefined;
|
|
18243
|
-
isLoading?: undefined;
|
|
18244
|
-
isDisabled?: undefined;
|
|
18245
|
-
})[];
|
|
18246
|
-
} | {
|
|
18247
|
-
id: number;
|
|
18248
|
-
label: string;
|
|
18249
|
-
tiles: {
|
|
18250
|
-
id: string;
|
|
18251
|
-
customContent: import("react/jsx-runtime").JSX.Element;
|
|
18252
|
-
}[];
|
|
18253
|
-
};
|
|
18254
|
-
9: {
|
|
18255
|
-
id: number;
|
|
18256
|
-
label: string;
|
|
18257
|
-
tiles: ({
|
|
18258
|
-
id: string;
|
|
18259
|
-
href: string;
|
|
18260
|
-
title: string;
|
|
18261
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18262
|
-
subtitle?: undefined;
|
|
18263
|
-
} | {
|
|
18264
|
-
id: string;
|
|
18265
|
-
href: string;
|
|
18266
|
-
title: string;
|
|
18267
|
-
subtitle: string;
|
|
18268
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18269
|
-
})[];
|
|
18270
|
-
} | {
|
|
18271
|
-
id: number;
|
|
18272
|
-
label: string;
|
|
18273
|
-
tiles: ({
|
|
18274
|
-
id: string;
|
|
18275
|
-
href: string;
|
|
18276
|
-
title: string;
|
|
18277
|
-
subtitle: string;
|
|
18278
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18279
|
-
secondaryIcon?: undefined;
|
|
18280
|
-
} | {
|
|
18281
|
-
id: string;
|
|
18282
|
-
href: string;
|
|
18283
|
-
title: string;
|
|
18284
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18285
|
-
secondaryIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18286
|
-
subtitle?: undefined;
|
|
18287
|
-
})[];
|
|
18288
|
-
} | {
|
|
18289
|
-
id: number;
|
|
18290
|
-
label: string;
|
|
18291
|
-
tiles: ({
|
|
18292
|
-
id: string;
|
|
18293
|
-
href: string;
|
|
18294
|
-
title: string;
|
|
18295
|
-
subtitle: string;
|
|
18296
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18297
|
-
isLoading: boolean;
|
|
18298
|
-
isDisabled?: undefined;
|
|
18299
|
-
secondaryIcon?: undefined;
|
|
18300
|
-
} | {
|
|
18301
|
-
id: string;
|
|
18302
|
-
title: string;
|
|
18303
|
-
subtitle: string;
|
|
18304
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18305
|
-
href?: undefined;
|
|
18306
|
-
isLoading?: undefined;
|
|
18307
|
-
isDisabled?: undefined;
|
|
18308
|
-
secondaryIcon?: undefined;
|
|
18309
|
-
} | {
|
|
18310
|
-
id: string;
|
|
18311
|
-
href: string;
|
|
18312
|
-
title: string;
|
|
18313
|
-
subtitle: string;
|
|
18314
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18315
|
-
isDisabled: boolean;
|
|
18316
|
-
isLoading?: undefined;
|
|
18317
|
-
secondaryIcon?: undefined;
|
|
18318
|
-
} | {
|
|
18319
|
-
id: string;
|
|
18320
|
-
href: string;
|
|
18321
|
-
title: string;
|
|
18322
|
-
mainIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18323
|
-
secondaryIcon: import("@carbon/icons-react").CarbonIconType;
|
|
18324
|
-
subtitle?: undefined;
|
|
18325
|
-
isLoading?: undefined;
|
|
18326
|
-
isDisabled?: undefined;
|
|
18327
|
-
})[];
|
|
18328
|
-
} | {
|
|
18329
|
-
id: number;
|
|
18330
|
-
label: string;
|
|
18331
|
-
tiles: {
|
|
18332
|
-
id: string;
|
|
18333
|
-
customContent: import("react/jsx-runtime").JSX.Element;
|
|
18334
|
-
}[];
|
|
18335
|
-
};
|
|
18336
18004
|
};
|
|
18337
18005
|
};
|
|
18338
18006
|
tasksControllerConfig: {
|
|
@@ -8,35 +8,34 @@
|
|
|
8
8
|
import PropTypes from 'prop-types';
|
|
9
9
|
import React, { useRef, useState, useEffect } from 'react';
|
|
10
10
|
import { Grid, Column, Tooltip, Button } from '@carbon/react';
|
|
11
|
+
import { ChevronUp, ChevronDown } from '@carbon/icons-react';
|
|
11
12
|
import lottie from '../../_virtual/lottie.js';
|
|
12
13
|
import { usePrefix } from '../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
|
|
13
14
|
import '@carbon/react/icons';
|
|
14
15
|
import { BaseTile } from '../Tiles/BaseTile/BaseTile.js';
|
|
15
16
|
import TasksController from '../TasksController/TasksController.js';
|
|
16
17
|
import WorkspaceSelector from '../WorkspaceSelector/WorkspaceSelector.js';
|
|
17
|
-
import { ChevronUp, ChevronDown } from '../../node_modules/@carbon/icons-react/es/generated/bucket-3.js';
|
|
18
18
|
|
|
19
19
|
/** Animated Header */
|
|
20
20
|
|
|
21
|
-
const AnimatedHeader =
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
} = _ref;
|
|
21
|
+
const AnimatedHeader = ({
|
|
22
|
+
allTileGroups,
|
|
23
|
+
selectedTileGroup,
|
|
24
|
+
setSelectedTileGroup,
|
|
25
|
+
description,
|
|
26
|
+
headerAnimation,
|
|
27
|
+
headerStatic,
|
|
28
|
+
productName = '[Product name]',
|
|
29
|
+
userName,
|
|
30
|
+
welcomeText,
|
|
31
|
+
tasksControllerConfig,
|
|
32
|
+
workspaceSelectorConfig,
|
|
33
|
+
isLoading,
|
|
34
|
+
disabledTaskLabel,
|
|
35
|
+
expandButtonLabel = 'Expand',
|
|
36
|
+
collapseButtonLabel = 'Collapse',
|
|
37
|
+
tileClickHandler
|
|
38
|
+
}) => {
|
|
40
39
|
const prefix = usePrefix();
|
|
41
40
|
const blockClass = `${prefix}--animated-header`;
|
|
42
41
|
const animationContainer = useRef(null);
|
|
@@ -10,14 +10,13 @@ import { SkeletonPlaceholder, Button, Dropdown } from '@carbon/react';
|
|
|
10
10
|
import React, { useMemo } from 'react';
|
|
11
11
|
import { usePrefix } from '../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
|
|
12
12
|
|
|
13
|
-
const TasksController =
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
} = _ref;
|
|
13
|
+
const TasksController = ({
|
|
14
|
+
tasksControllerConfig,
|
|
15
|
+
isLoading,
|
|
16
|
+
allTileGroups,
|
|
17
|
+
selectedTileGroup,
|
|
18
|
+
setSelectedTileGroup
|
|
19
|
+
}) => {
|
|
21
20
|
const {
|
|
22
21
|
className: buttonCustomClass,
|
|
23
22
|
...buttonOverrideProps
|
|
@@ -14,19 +14,18 @@ var _AILabel, _Send;
|
|
|
14
14
|
|
|
15
15
|
/** Primary UI component for user interaction */
|
|
16
16
|
|
|
17
|
-
const AIPromptTile =
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
} = _ref;
|
|
17
|
+
const AIPromptTile = ({
|
|
18
|
+
href,
|
|
19
|
+
id,
|
|
20
|
+
mainIcon: MainIcon,
|
|
21
|
+
open,
|
|
22
|
+
productName,
|
|
23
|
+
title,
|
|
24
|
+
isLoading,
|
|
25
|
+
isDisabled,
|
|
26
|
+
disabledTaskLabel,
|
|
27
|
+
onClick
|
|
28
|
+
}) => {
|
|
30
29
|
const prefix = usePrefix();
|
|
31
30
|
const blockClass = `${prefix}--animated-header__ai-prompt-tile`;
|
|
32
31
|
const collapsed = `${blockClass}--collapsed`;
|
|
@@ -12,21 +12,20 @@ import { GlassTileBody } from './GlassTileBody.js';
|
|
|
12
12
|
|
|
13
13
|
/** Primary UI component for user interaction */
|
|
14
14
|
|
|
15
|
-
const GlassTile =
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
} = _ref;
|
|
15
|
+
const GlassTile = ({
|
|
16
|
+
href,
|
|
17
|
+
id,
|
|
18
|
+
mainIcon,
|
|
19
|
+
open,
|
|
20
|
+
secondaryIcon,
|
|
21
|
+
subtitle,
|
|
22
|
+
title,
|
|
23
|
+
customContent,
|
|
24
|
+
isLoading,
|
|
25
|
+
isDisabled,
|
|
26
|
+
disabledTaskLabel,
|
|
27
|
+
onClick: glassTileClickHandler
|
|
28
|
+
}) => {
|
|
30
29
|
const prefix = usePrefix();
|
|
31
30
|
const blockClass = `${prefix}--animated-header__glass-tile`;
|
|
32
31
|
const body = /*#__PURE__*/React.createElement(GlassTileBody, {
|
|
@@ -9,16 +9,15 @@ import React from 'react';
|
|
|
9
9
|
import { usePrefix } from '../../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
|
|
10
10
|
import { SkeletonPlaceholder } from '@carbon/react';
|
|
11
11
|
|
|
12
|
-
const GlassTileBody =
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
} = _ref;
|
|
12
|
+
const GlassTileBody = ({
|
|
13
|
+
mainIcon: MainIcon,
|
|
14
|
+
open,
|
|
15
|
+
secondaryIcon: SecondaryIcon,
|
|
16
|
+
subtitle,
|
|
17
|
+
title,
|
|
18
|
+
customContent,
|
|
19
|
+
isLoading
|
|
20
|
+
}) => {
|
|
22
21
|
const prefix = usePrefix();
|
|
23
22
|
const blockClass = `${prefix}--animated-header__glass-tile`;
|
|
24
23
|
const collapsed = `${blockClass}--collapsed`;
|
|
@@ -9,12 +9,11 @@ import { SkeletonPlaceholder, Dropdown } from '@carbon/react';
|
|
|
9
9
|
import { usePrefix } from '../../node_modules/@carbon-labs/utilities/es/usePrefix.js';
|
|
10
10
|
import React, { useMemo } from 'react';
|
|
11
11
|
|
|
12
|
-
const WorkspaceSelector =
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
} = _ref;
|
|
12
|
+
const WorkspaceSelector = ({
|
|
13
|
+
workspaceSelectorConfig,
|
|
14
|
+
userName,
|
|
15
|
+
isLoading
|
|
16
|
+
}) => {
|
|
18
17
|
const {
|
|
19
18
|
className: dropdownCustomClass,
|
|
20
19
|
onChange: dropdownCustomOnChange,
|