From 61c7cba6e70dc9fe15a58e54ab08537bafa65cd8 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Tue, 14 Nov 2023 13:24:42 +0000 Subject: [PATCH] deploy: cf853886e3dd862c4f906eea2aa5b1c9344a413f --- ...079.js => AlertBanner.stories-c8143fda.js} | 4 +- ...ap => AlertBanner.stories-c8143fda.js.map} | 2 +- assets/Avatar-a7db1e7d.js | 2 + assets/Avatar-a7db1e7d.js.map | 1 + assets/Avatar-d800c3b0.js | 2 - assets/Avatar-d800c3b0.js.map | 1 - ...82b51fa4.js => Avatar.stories-e74701d6.js} | 4 +- ....js.map => Avatar.stories-e74701d6.js.map} | 2 +- ...-ac37312e.js => Badge.stories-c71494be.js} | 4 +- ...e.js.map => Badge.stories-c71494be.js.map} | 2 +- assets/Button-7f35610f.js | 2 - assets/Button-7f35610f.js.map | 1 - assets/Button-e8871fcc.js | 2 + assets/Button-e8871fcc.js.map | 1 + assets/Button.stories-1170fc13.js | 92 ----------- assets/Button.stories-1170fc13.js.map | 1 - assets/Button.stories-f2741825.js | 92 +++++++++++ assets/Button.stories-f2741825.js.map | 1 + ...elog-06a4732d.js => Changelog-5f6071cd.js} | 4 +- ...4732d.js.map => Changelog-5f6071cd.js.map} | 2 +- ...ckbox-6475c31c.js => Checkbox-1dcf26ac.js} | 6 +- assets/Checkbox-1dcf26ac.js.map | 1 + assets/Checkbox-6475c31c.js.map | 1 - ...eaa4cd.js => Checkbox.stories-1fa490c7.js} | 4 +- ...s.map => Checkbox.stories-1fa490c7.js.map} | 2 +- ...a.js => CheckboxGroup.stories-3c15143a.js} | 4 +- ... => CheckboxGroup.stories-3c15143a.js.map} | 2 +- ...d3d0638e.js => Color-6VNJS4EI-dd3cddf6.js} | 4 +- ....js.map => Color-6VNJS4EI-dd3cddf6.js.map} | 2 +- ...deda6be.js => Counter.stories-6017e10b.js} | 4 +- ...js.map => Counter.stories-6017e10b.js.map} | 2 +- ...7eb8d9b.js => Divider.stories-4c659692.js} | 4 +- ...js.map => Divider.stories-4c659692.js.map} | 2 +- assets/DocsRenderer-3PUGWF3O-1e32b641.js | 2 - assets/DocsRenderer-3PUGWF3O-1e32b641.js.map | 1 - assets/DocsRenderer-3PUGWF3O-ed592b6a.js | 2 + assets/DocsRenderer-3PUGWF3O-ed592b6a.js.map | 1 + ...obalScrollAreaStyles-UY5SB7EJ-eeac077d.js} | 4 +- ...ScrollAreaStyles-UY5SB7EJ-eeac077d.js.map} | 2 +- ...ext-8f2a4044.js => HelperText-8712a80e.js} | 4 +- ...4044.js.map => HelperText-8712a80e.js.map} | 2 +- ...2519.js => HelperText.stories-5d390604.js} | 4 +- ...map => HelperText.stories-5d390604.js.map} | 2 +- ...ton-68129923.js => IconButton-5273973c.js} | 4 +- ...9923.js.map => IconButton-5273973c.js.map} | 2 +- assets/IconButton.stories-67b18d23.js | 11 ++ assets/IconButton.stories-67b18d23.js.map | 1 + assets/IconButton.stories-9f427e90.js | 11 -- assets/IconButton.stories-9f427e90.js.map | 1 - assets/InlineBanner.stories-a2340d5b.js | 18 --- assets/InlineBanner.stories-a2340d5b.js.map | 1 - assets/InlineBanner.stories-def7f2b4.js | 18 +++ assets/InlineBanner.stories-def7f2b4.js.map | 1 + ...9.js => InlineMessage.stories-9f3846fd.js} | 4 +- ... => InlineMessage.stories-9f3846fd.js.map} | 2 +- assets/InlineSearchInput.stories-13a2c923.js | 14 -- assets/InlineSearchInput.stories-a4c17f8b.js | 14 ++ ...InlineSearchInput.stories-a4c17f8b.js.map} | 2 +- .../{Label-2c0343ac.js => Label-de32c370.js} | 4 +- ...-2c0343ac.js.map => Label-de32c370.js.map} | 2 +- ...-ad162e40.js => Label.stories-c65a084c.js} | 4 +- ...0.js.map => Label.stories-c65a084c.js.map} | 2 +- ...4b270b1f.js => Loader.stories-721fb7e4.js} | 4 +- ....js.map => Loader.stories-721fb7e4.js.map} | 2 +- assets/Popover.stories-02ca375d.js | 27 ---- assets/Popover.stories-02ca375d.js.map | 1 - assets/Popover.stories-6516a9df.js | 27 ++++ assets/Popover.stories-6516a9df.js.map | 1 + assets/RadioButton-bf900ef8.js | 2 + assets/RadioButton-bf900ef8.js.map | 1 + assets/RadioButton-e608255a.js | 2 - assets/RadioButton-e608255a.js.map | 1 - ...259.js => RadioButton.stories-9113edf2.js} | 4 +- ...ap => RadioButton.stories-9113edf2.js.map} | 2 +- ...s => RadioButtonGroup.stories-cca91806.js} | 4 +- ... RadioButtonGroup.stories-cca91806.js.map} | 2 +- ...{ReadMe-a61a2121.js => ReadMe-08bf53e1.js} | 4 +- ...a61a2121.js.map => ReadMe-08bf53e1.js.map} | 2 +- ...ut-a0ef2324.js => SearchInput-8175b432.js} | 4 +- ...324.js.map => SearchInput-8175b432.js.map} | 2 +- ...7f4.js => SearchInput.stories-3577abea.js} | 6 +- ...ap => SearchInput.stories-3577abea.js.map} | 2 +- assets/Select.stories-35d055da.js | 28 ++++ assets/Select.stories-35d055da.js.map | 1 + assets/Select.stories-43e46510.js | 28 ---- assets/Select.stories-43e46510.js.map | 1 - ...64.js => SocialButton.stories-f98ef09b.js} | 10 +- ...p => SocialButton.stories-f98ef09b.js.map} | 2 +- ...18f24.js => StatusDot.stories-cfde1c05.js} | 4 +- ....map => StatusDot.stories-cfde1c05.js.map} | 2 +- ...es-ce6c6c70.js => Tag.stories-2a7e286c.js} | 4 +- ...c70.js.map => Tag.stories-2a7e286c.js.map} | 2 +- ...etDocs-2d6334a9.js => TetDocs-30a5e954.js} | 4 +- ...d6334a9.js.map => TetDocs-30a5e954.js.map} | 2 +- assets/TextInput-50aded28.js | 2 - assets/TextInput-50aded28.js.map | 1 - assets/TextInput-62ca473d.js | 2 + assets/TextInput-62ca473d.js.map | 1 + ...694b0.js => TextInput.stories-d09a297b.js} | 4 +- ....map => TextInput.stories-d09a297b.js.map} | 2 +- assets/Toast.stories-8653611e.js.map | 1 - ...-8653611e.js => Toast.stories-88dfddcd.js} | 12 +- assets/Toast.stories-88dfddcd.js.map | 1 + ...90.js => WithTooltip-J57HCPYA-515eea59.js} | 4 +- assets/WithTooltip-J57HCPYA-515eea59.js.map | 1 + assets/WithTooltip-J57HCPYA-e8be5090.js.map | 1 - ...d92ab14f.js => chunk-S4VUQJ4A-35dd2fba.js} | 4 +- ....js.map => chunk-S4VUQJ4A-35dd2fba.js.map} | 2 +- ...c434.js => formatter-SWP5E3XI-114e8845.js} | 4 +- ...map => formatter-SWP5E3XI-114e8845.js.map} | 2 +- assets/iframe-38b13a5f.js | 2 + ...ba63edfe.js.map => iframe-38b13a5f.js.map} | 2 +- assets/iframe-ba63edfe.js | 2 - .../{index-784e0643.js => index-c462af29.js} | 4 +- ...-784e0643.js.map => index-c462af29.js.map} | 2 +- .../{index-f4cf0e9a.js => index-fb670bae.js} | 12 +- ...-f4cf0e9a.js.map => index-fb670bae.js.map} | 2 +- assets/preview-8c1f357e.js | 2 - assets/preview-e09e5203.js | 2 + ...c1f357e.js.map => preview-e09e5203.js.map} | 2 +- ...syntaxhighlighter-PONEFOSF-66c08094.js.map | 1 - ...=> syntaxhighlighter-PONEFOSF-c8eff46a.js} | 4 +- ...syntaxhighlighter-PONEFOSF-c8eff46a.js.map | 1 + assets/useLoading-c162a1b9.js | 2 - assets/useLoading-c162a1b9.js.map | 1 - assets/useTextInput-ba9dcb24.js | 2 + assets/useTextInput-ba9dcb24.js.map | 1 + assets/useTextInput-f0614a1e.js | 2 - assets/useTextInput-f0614a1e.js.map | 1 - iframe.html | 2 +- index.json | 2 +- project.json | 2 +- src/components/Avatar/Avatar.styles.d.ts | 12 +- src/components/Button/Button.styles.d.ts | 144 +++++++++++++++++- .../Button/stylesBuilder/stylesBuilder.d.ts | 2 + src/components/Checkbox/Checkbox.styles.d.ts | 1 + .../InlineBanner/InlineBanner.styles.d.ts | 9 +- .../RadioButton/RadioButton.styles.d.ts | 1 + .../SearchInput/SearchInput.stories.d.ts | 2 +- src/components/Select/Select.styles.d.ts | 2 + .../SocialButton/SocialButton.styles.d.ts | 1 + .../stylesBuilder/stylesBuilder.d.ts | 1 + .../TextInput/TextInput.styles.d.ts | 8 +- src/components/TextInput/useTextInput.d.ts | 110 ++++++------- src/components/Toast/Toast.styles.d.ts | 13 +- .../ButtonDocs/LoadingButton.d.ts | 2 - stories.json | 2 +- 147 files changed, 581 insertions(+), 414 deletions(-) rename assets/{AlertBanner.stories-25941079.js => AlertBanner.stories-c8143fda.js} (92%) rename assets/{AlertBanner.stories-25941079.js.map => AlertBanner.stories-c8143fda.js.map} (99%) create mode 100644 assets/Avatar-a7db1e7d.js create mode 100644 assets/Avatar-a7db1e7d.js.map delete mode 100644 assets/Avatar-d800c3b0.js delete mode 100644 assets/Avatar-d800c3b0.js.map rename assets/{Avatar.stories-82b51fa4.js => Avatar.stories-e74701d6.js} (92%) rename assets/{Avatar.stories-82b51fa4.js.map => Avatar.stories-e74701d6.js.map} (98%) rename assets/{Badge.stories-ac37312e.js => Badge.stories-c71494be.js} (98%) rename assets/{Badge.stories-ac37312e.js.map => Badge.stories-c71494be.js.map} (99%) delete mode 100644 assets/Button-7f35610f.js delete mode 100644 assets/Button-7f35610f.js.map create mode 100644 assets/Button-e8871fcc.js create mode 100644 assets/Button-e8871fcc.js.map delete mode 100644 assets/Button.stories-1170fc13.js delete mode 100644 assets/Button.stories-1170fc13.js.map create mode 100644 assets/Button.stories-f2741825.js create mode 100644 assets/Button.stories-f2741825.js.map rename assets/{Changelog-06a4732d.js => Changelog-5f6071cd.js} (96%) rename assets/{Changelog-06a4732d.js.map => Changelog-5f6071cd.js.map} (99%) rename assets/{Checkbox-6475c31c.js => Checkbox-1dcf26ac.js} (71%) create mode 100644 assets/Checkbox-1dcf26ac.js.map delete mode 100644 assets/Checkbox-6475c31c.js.map rename assets/{Checkbox.stories-8eeaa4cd.js => Checkbox.stories-1fa490c7.js} (94%) rename assets/{Checkbox.stories-8eeaa4cd.js.map => Checkbox.stories-1fa490c7.js.map} (98%) rename assets/{CheckboxGroup.stories-459ff2da.js => CheckboxGroup.stories-3c15143a.js} (88%) rename assets/{CheckboxGroup.stories-459ff2da.js.map => CheckboxGroup.stories-3c15143a.js.map} (99%) rename assets/{Color-6VNJS4EI-d3d0638e.js => Color-6VNJS4EI-dd3cddf6.js} (99%) rename assets/{Color-6VNJS4EI-d3d0638e.js.map => Color-6VNJS4EI-dd3cddf6.js.map} (99%) rename assets/{Counter.stories-5deda6be.js => Counter.stories-6017e10b.js} (97%) rename assets/{Counter.stories-5deda6be.js.map => Counter.stories-6017e10b.js.map} (99%) rename assets/{Divider.stories-27eb8d9b.js => Divider.stories-4c659692.js} (88%) rename assets/{Divider.stories-27eb8d9b.js.map => Divider.stories-4c659692.js.map} (97%) delete mode 100644 assets/DocsRenderer-3PUGWF3O-1e32b641.js delete mode 100644 assets/DocsRenderer-3PUGWF3O-1e32b641.js.map create mode 100644 assets/DocsRenderer-3PUGWF3O-ed592b6a.js create mode 100644 assets/DocsRenderer-3PUGWF3O-ed592b6a.js.map rename assets/{GlobalScrollAreaStyles-UY5SB7EJ-b058c1e9.js => GlobalScrollAreaStyles-UY5SB7EJ-eeac077d.js} (98%) rename assets/{GlobalScrollAreaStyles-UY5SB7EJ-b058c1e9.js.map => GlobalScrollAreaStyles-UY5SB7EJ-eeac077d.js.map} (99%) rename assets/{HelperText-8f2a4044.js => HelperText-8712a80e.js} (94%) rename assets/{HelperText-8f2a4044.js.map => HelperText-8712a80e.js.map} (98%) rename assets/{HelperText.stories-7b4e2519.js => HelperText.stories-5d390604.js} (84%) rename assets/{HelperText.stories-7b4e2519.js.map => HelperText.stories-5d390604.js.map} (95%) rename assets/{IconButton-68129923.js => IconButton-5273973c.js} (99%) rename assets/{IconButton-68129923.js.map => IconButton-5273973c.js.map} (98%) create mode 100644 assets/IconButton.stories-67b18d23.js create mode 100644 assets/IconButton.stories-67b18d23.js.map delete mode 100644 assets/IconButton.stories-9f427e90.js delete mode 100644 assets/IconButton.stories-9f427e90.js.map delete mode 100644 assets/InlineBanner.stories-a2340d5b.js delete mode 100644 assets/InlineBanner.stories-a2340d5b.js.map create mode 100644 assets/InlineBanner.stories-def7f2b4.js create mode 100644 assets/InlineBanner.stories-def7f2b4.js.map rename assets/{InlineMessage.stories-91b2ce79.js => InlineMessage.stories-9f3846fd.js} (96%) rename assets/{InlineMessage.stories-91b2ce79.js.map => InlineMessage.stories-9f3846fd.js.map} (99%) delete mode 100644 assets/InlineSearchInput.stories-13a2c923.js create mode 100644 assets/InlineSearchInput.stories-a4c17f8b.js rename assets/{InlineSearchInput.stories-13a2c923.js.map => InlineSearchInput.stories-a4c17f8b.js.map} (52%) rename assets/{Label-2c0343ac.js => Label-de32c370.js} (90%) rename assets/{Label-2c0343ac.js.map => Label-de32c370.js.map} (98%) rename assets/{Label.stories-ad162e40.js => Label.stories-c65a084c.js} (85%) rename assets/{Label.stories-ad162e40.js.map => Label.stories-c65a084c.js.map} (50%) rename assets/{Loader.stories-4b270b1f.js => Loader.stories-721fb7e4.js} (93%) rename assets/{Loader.stories-4b270b1f.js.map => Loader.stories-721fb7e4.js.map} (98%) delete mode 100644 assets/Popover.stories-02ca375d.js delete mode 100644 assets/Popover.stories-02ca375d.js.map create mode 100644 assets/Popover.stories-6516a9df.js create mode 100644 assets/Popover.stories-6516a9df.js.map create mode 100644 assets/RadioButton-bf900ef8.js create mode 100644 assets/RadioButton-bf900ef8.js.map delete mode 100644 assets/RadioButton-e608255a.js delete mode 100644 assets/RadioButton-e608255a.js.map rename assets/{RadioButton.stories-4e16f259.js => RadioButton.stories-9113edf2.js} (94%) rename assets/{RadioButton.stories-4e16f259.js.map => RadioButton.stories-9113edf2.js.map} (98%) rename assets/{RadioButtonGroup.stories-9f2dac87.js => RadioButtonGroup.stories-cca91806.js} (90%) rename assets/{RadioButtonGroup.stories-9f2dac87.js.map => RadioButtonGroup.stories-cca91806.js.map} (99%) rename assets/{ReadMe-a61a2121.js => ReadMe-08bf53e1.js} (97%) rename assets/{ReadMe-a61a2121.js.map => ReadMe-08bf53e1.js.map} (99%) rename assets/{SearchInput-a0ef2324.js => SearchInput-8175b432.js} (87%) rename assets/{SearchInput-a0ef2324.js.map => SearchInput-8175b432.js.map} (94%) rename assets/{SearchInput.stories-fa52e7f4.js => SearchInput.stories-3577abea.js} (82%) rename assets/{SearchInput.stories-fa52e7f4.js.map => SearchInput.stories-3577abea.js.map} (97%) create mode 100644 assets/Select.stories-35d055da.js create mode 100644 assets/Select.stories-35d055da.js.map delete mode 100644 assets/Select.stories-43e46510.js delete mode 100644 assets/Select.stories-43e46510.js.map rename assets/{SocialButton.stories-6521f464.js => SocialButton.stories-f98ef09b.js} (76%) rename assets/{SocialButton.stories-6521f464.js.map => SocialButton.stories-f98ef09b.js.map} (61%) rename assets/{StatusDot.stories-bea18f24.js => StatusDot.stories-cfde1c05.js} (93%) rename assets/{StatusDot.stories-bea18f24.js.map => StatusDot.stories-cfde1c05.js.map} (99%) rename assets/{Tag.stories-ce6c6c70.js => Tag.stories-2a7e286c.js} (91%) rename assets/{Tag.stories-ce6c6c70.js.map => Tag.stories-2a7e286c.js.map} (99%) rename assets/{TetDocs-2d6334a9.js => TetDocs-30a5e954.js} (99%) rename assets/{TetDocs-2d6334a9.js.map => TetDocs-30a5e954.js.map} (99%) delete mode 100644 assets/TextInput-50aded28.js delete mode 100644 assets/TextInput-50aded28.js.map create mode 100644 assets/TextInput-62ca473d.js create mode 100644 assets/TextInput-62ca473d.js.map rename assets/{TextInput.stories-7a3694b0.js => TextInput.stories-d09a297b.js} (92%) rename assets/{TextInput.stories-7a3694b0.js.map => TextInput.stories-d09a297b.js.map} (84%) delete mode 100644 assets/Toast.stories-8653611e.js.map rename assets/{Toast.stories-8653611e.js => Toast.stories-88dfddcd.js} (67%) create mode 100644 assets/Toast.stories-88dfddcd.js.map rename assets/{WithTooltip-J57HCPYA-e8be5090.js => WithTooltip-J57HCPYA-515eea59.js} (52%) create mode 100644 assets/WithTooltip-J57HCPYA-515eea59.js.map delete mode 100644 assets/WithTooltip-J57HCPYA-e8be5090.js.map rename assets/{chunk-S4VUQJ4A-d92ab14f.js => chunk-S4VUQJ4A-35dd2fba.js} (77%) rename assets/{chunk-S4VUQJ4A-d92ab14f.js.map => chunk-S4VUQJ4A-35dd2fba.js.map} (98%) rename assets/{formatter-SWP5E3XI-215fc434.js => formatter-SWP5E3XI-114e8845.js} (99%) rename assets/{formatter-SWP5E3XI-215fc434.js.map => formatter-SWP5E3XI-114e8845.js.map} (99%) create mode 100644 assets/iframe-38b13a5f.js rename assets/{iframe-ba63edfe.js.map => iframe-38b13a5f.js.map} (98%) delete mode 100644 assets/iframe-ba63edfe.js rename assets/{index-784e0643.js => index-c462af29.js} (97%) rename assets/{index-784e0643.js.map => index-c462af29.js.map} (99%) rename assets/{index-f4cf0e9a.js => index-fb670bae.js} (99%) rename assets/{index-f4cf0e9a.js.map => index-fb670bae.js.map} (99%) delete mode 100644 assets/preview-8c1f357e.js create mode 100644 assets/preview-e09e5203.js rename assets/{preview-8c1f357e.js.map => preview-e09e5203.js.map} (94%) delete mode 100644 assets/syntaxhighlighter-PONEFOSF-66c08094.js.map rename assets/{syntaxhighlighter-PONEFOSF-66c08094.js => syntaxhighlighter-PONEFOSF-c8eff46a.js} (53%) create mode 100644 assets/syntaxhighlighter-PONEFOSF-c8eff46a.js.map delete mode 100644 assets/useLoading-c162a1b9.js delete mode 100644 assets/useLoading-c162a1b9.js.map create mode 100644 assets/useTextInput-ba9dcb24.js create mode 100644 assets/useTextInput-ba9dcb24.js.map delete mode 100644 assets/useTextInput-f0614a1e.js delete mode 100644 assets/useTextInput-f0614a1e.js.map create mode 100644 src/components/Select/Select.styles.d.ts delete mode 100644 src/docs-components/ButtonDocs/LoadingButton.d.ts diff --git a/assets/AlertBanner.stories-25941079.js b/assets/AlertBanner.stories-c8143fda.js similarity index 92% rename from assets/AlertBanner.stories-25941079.js rename to assets/AlertBanner.stories-c8143fda.js index b366ddd1..27643711 100644 --- a/assets/AlertBanner.stories-25941079.js +++ b/assets/AlertBanner.stories-c8143fda.js @@ -1,4 +1,4 @@ -import{j as e}from"./jsx-runtime-ffb262ed.js";import{a as g}from"./chunk-AY7I2SME-5eb1ab46.js";import{R as N}from"./tetrisly-icons.es-3ae3ef26.js";import{r as y}from"./index-76fb7be0.js";import{m as V,l as q,T as H}from"./TetDocs-2d6334a9.js";import{B as C}from"./Button-7f35610f.js";import{I as M}from"./IconButton-68129923.js";import{u as T}from"./useAction-275346b1.js";import{t as r}from"./TetrislyProvider-e15ac01a.js";import{S as x}from"./SectionHeader-25e04435.js";import"./_commonjsHelpers-de833af9.js";import"./index-f4cf0e9a.js";import"./iframe-ba63edfe.js";import"../sb-preview/runtime.js";import"./index-ffc7e5ff.js";import"./index-d37d4223.js";import"./index-356e4a49.js";import"./index-784e0643.js";const D={p:"$space-component-padding-medium",pl:"$space-component-padding-2xLarge",display:"flex",alignItems:"center",text:"$typo-body-medium",intent:{none:{backgroundColor:"$color-background-neutral-strong",color:"$color-content-primary-inverted"},success:{backgroundColor:"$color-background-positive-strong",color:"$color-content-primary-inverted"},warning:{backgroundColor:"$color-background-warning-strong",color:"$color-content-primary"},negative:{backgroundColor:"$color-background-negative-strong",color:"$color-content-primary-inverted"}},innerElements:{iconContainer:{mr:"$space-component-gap-small"},actionContainer:{display:"flex",alignItems:"center",justifyContent:"center",gap:"$space-component-gap-small",ml:"$space-component-gap-large"},closeButton:{ml:"auto"}}},R=n=>({none:"20-info-fill",success:"20-check-circle-fill",warning:"20-warning-fill",negative:"20-alert-fill"})[n],W=(n,o)=>{const{intent:s,innerElements:{iconContainer:v,actionContainer:i,closeButton:f},...t}=V({defaultConfig:D,custom:o}),c={appearance:n==="warning"?"reverseInverted":"inverted"},l={appearance:n==="warning"?"primary":"inverted"};return{container:{...s[n],...t},iconContainer:v,actionContainer:i,actionProps:c,closeButtonProps:l,closeButton:f}},a=({text:n,intent:o="none",custom:s,action:v,onCloseClick:i,...f})=>{const t=y.useMemo(()=>W(o,s),[o,s]),[c,l]=T(v),S=y.useMemo(()=>R(o),[o]);return e.jsxs(r.div,{...t.container,"data-testid":"alert-banner",...f,children:[e.jsx(r.span,{...t.iconContainer,"data-testid":"alert-banner-iconContainer",children:e.jsx(N,{name:S})}),n,c&&e.jsxs(r.div,{...t.actionContainer,"data-testid":"alert-banner-actionContainer",children:[e.jsx(C,{variant:"bare",...t.actionProps,...c}),l&&e.jsxs(e.Fragment,{children:[e.jsx(r.div,{children:"·"}),e.jsx(C,{variant:"bare",...t.actionProps,...l})]})]}),!!i&&e.jsx(M,{size:"small",variant:"ghost",intent:"none",icon:"20-close",onClick:i,...t.closeButton,...t.closeButtonProps,"data-testid":"alert-banner-closeButton"})]})};try{a.displayName="AlertBanner",a.__docgenInfo={description:"",displayName:"AlertBanner",props:{text:{defaultValue:null,description:"",name:"text",required:!0,type:{name:"string"}},intent:{defaultValue:{value:"none"},description:"",name:"intent",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"warning"'},{value:'"negative"'},{value:'"none"'}]}},action:{defaultValue:null,description:"",name:"action",required:!1,type:{name:"ActionProp"}},onCloseClick:{defaultValue:null,description:"",name:"onCloseClick",required:!1,type:{name:"((e: MouseEvent) => void)"}},custom:{defaultValue:null,description:"",name:"custom",required:!1,type:{name:"AlertBannerConfig"}}}}}catch{}const z=["none","success","warning","negative"],F=()=>e.jsx(e.Fragment,{children:z.map(n=>e.jsxs(r.section,{children:[e.jsxs(x,{px:{md:"$dimension-1000",_:"$dimension-500"},py:"$dimension-500",variant:"H1",children:["Intent: ",q.capitalize(n)]}),e.jsxs(r.div,{px:{md:"$dimension-1000",_:"$dimension-500"},children:[e.jsx(x,{py:"$dimension-500",variant:"H2",children:"Action: No"}),e.jsx(a,{text:"Alert text",intent:n})]}),e.jsxs(r.div,{px:{md:"$dimension-1000",_:"$dimension-500"},children:[e.jsx(x,{py:"$dimension-500",variant:"H2",children:"Action: Yes"}),e.jsx(a,{text:"Alert text",intent:n,my:"$dimension-500",action:[{label:"Click me",onClick:g("onClick")},{label:"Or click me",onClick:g("onClick")}]})]})]},n))}),ce={title:"AlertBanner",component:a,tags:["autodocs"],args:{text:"Alert text",action:[{label:"Action",onClick:g("onClick")},{label:"Action",onClick:g("onClick")}]},argTypes:{intent:{options:["none","success","warning","negative"],defaultValue:"none",control:{type:"radio"}}},parameters:{docs:{description:{component:"Prominent element used to display important messages or notifications to users. Alert Banners can convey various levels of urgency, such as success, warning, or error. They are designed to capture the user's attention and provide a clear and concise message."},page:()=>e.jsx(H,{docs:"https://docs.tetrisly.com/components/list/alertbanner",children:e.jsx(F,{})})}}},m={},d={args:{intent:"success"}},p={args:{intent:"warning"}},u={args:{intent:"negative"}};var $,j,h;m.parameters={...m.parameters,docs:{...($=m.parameters)==null?void 0:$.docs,source:{originalSource:"{}",...(h=(j=m.parameters)==null?void 0:j.docs)==null?void 0:h.source}}};var k,b,A;d.parameters={...d.parameters,docs:{...(k=d.parameters)==null?void 0:k.docs,source:{originalSource:`{ +import{j as e}from"./jsx-runtime-ffb262ed.js";import{a as g}from"./chunk-AY7I2SME-5eb1ab46.js";import{R as N}from"./tetrisly-icons.es-3ae3ef26.js";import{r as y}from"./index-76fb7be0.js";import{m as V,l as q,T as H}from"./TetDocs-30a5e954.js";import{B as C}from"./Button-e8871fcc.js";import{I as M}from"./IconButton-5273973c.js";import{u as T}from"./useAction-275346b1.js";import{t as r}from"./TetrislyProvider-e15ac01a.js";import{S as x}from"./SectionHeader-25e04435.js";import"./_commonjsHelpers-de833af9.js";import"./index-fb670bae.js";import"./iframe-38b13a5f.js";import"../sb-preview/runtime.js";import"./index-ffc7e5ff.js";import"./index-d37d4223.js";import"./index-356e4a49.js";import"./index-c462af29.js";const D={p:"$space-component-padding-medium",pl:"$space-component-padding-2xLarge",display:"flex",alignItems:"center",text:"$typo-body-medium",intent:{none:{backgroundColor:"$color-background-neutral-strong",color:"$color-content-primary-inverted"},success:{backgroundColor:"$color-background-positive-strong",color:"$color-content-primary-inverted"},warning:{backgroundColor:"$color-background-warning-strong",color:"$color-content-primary"},negative:{backgroundColor:"$color-background-negative-strong",color:"$color-content-primary-inverted"}},innerElements:{iconContainer:{mr:"$space-component-gap-small"},actionContainer:{display:"flex",alignItems:"center",justifyContent:"center",gap:"$space-component-gap-small",ml:"$space-component-gap-large"},closeButton:{ml:"auto"}}},R=n=>({none:"20-info-fill",success:"20-check-circle-fill",warning:"20-warning-fill",negative:"20-alert-fill"})[n],W=(n,o)=>{const{intent:s,innerElements:{iconContainer:v,actionContainer:i,closeButton:f},...t}=V({defaultConfig:D,custom:o}),c={appearance:n==="warning"?"reverseInverted":"inverted"},l={appearance:n==="warning"?"primary":"inverted"};return{container:{...s[n],...t},iconContainer:v,actionContainer:i,actionProps:c,closeButtonProps:l,closeButton:f}},a=({text:n,intent:o="none",custom:s,action:v,onCloseClick:i,...f})=>{const t=y.useMemo(()=>W(o,s),[o,s]),[c,l]=T(v),S=y.useMemo(()=>R(o),[o]);return e.jsxs(r.div,{...t.container,"data-testid":"alert-banner",...f,children:[e.jsx(r.span,{...t.iconContainer,"data-testid":"alert-banner-iconContainer",children:e.jsx(N,{name:S})}),n,c&&e.jsxs(r.div,{...t.actionContainer,"data-testid":"alert-banner-actionContainer",children:[e.jsx(C,{variant:"bare",...t.actionProps,...c}),l&&e.jsxs(e.Fragment,{children:[e.jsx(r.div,{children:"·"}),e.jsx(C,{variant:"bare",...t.actionProps,...l})]})]}),!!i&&e.jsx(M,{size:"small",variant:"ghost",intent:"none",icon:"20-close",onClick:i,...t.closeButton,...t.closeButtonProps,"data-testid":"alert-banner-closeButton"})]})};try{a.displayName="AlertBanner",a.__docgenInfo={description:"",displayName:"AlertBanner",props:{text:{defaultValue:null,description:"",name:"text",required:!0,type:{name:"string"}},intent:{defaultValue:{value:"none"},description:"",name:"intent",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"warning"'},{value:'"negative"'},{value:'"none"'}]}},action:{defaultValue:null,description:"",name:"action",required:!1,type:{name:"ActionProp"}},onCloseClick:{defaultValue:null,description:"",name:"onCloseClick",required:!1,type:{name:"((e: MouseEvent) => void)"}},custom:{defaultValue:null,description:"",name:"custom",required:!1,type:{name:"AlertBannerConfig"}}}}}catch{}const z=["none","success","warning","negative"],F=()=>e.jsx(e.Fragment,{children:z.map(n=>e.jsxs(r.section,{children:[e.jsxs(x,{px:{md:"$dimension-1000",_:"$dimension-500"},py:"$dimension-500",variant:"H1",children:["Intent: ",q.capitalize(n)]}),e.jsxs(r.div,{px:{md:"$dimension-1000",_:"$dimension-500"},children:[e.jsx(x,{py:"$dimension-500",variant:"H2",children:"Action: No"}),e.jsx(a,{text:"Alert text",intent:n})]}),e.jsxs(r.div,{px:{md:"$dimension-1000",_:"$dimension-500"},children:[e.jsx(x,{py:"$dimension-500",variant:"H2",children:"Action: Yes"}),e.jsx(a,{text:"Alert text",intent:n,my:"$dimension-500",action:[{label:"Click me",onClick:g("onClick")},{label:"Or click me",onClick:g("onClick")}]})]})]},n))}),ce={title:"AlertBanner",component:a,tags:["autodocs"],args:{text:"Alert text",action:[{label:"Action",onClick:g("onClick")},{label:"Action",onClick:g("onClick")}]},argTypes:{intent:{options:["none","success","warning","negative"],defaultValue:"none",control:{type:"radio"}}},parameters:{docs:{description:{component:"Prominent element used to display important messages or notifications to users. Alert Banners can convey various levels of urgency, such as success, warning, or error. They are designed to capture the user's attention and provide a clear and concise message."},page:()=>e.jsx(H,{docs:"https://docs.tetrisly.com/components/list/alertbanner",children:e.jsx(F,{})})}}},m={},d={args:{intent:"success"}},p={args:{intent:"warning"}},u={args:{intent:"negative"}};var $,j,h;m.parameters={...m.parameters,docs:{...($=m.parameters)==null?void 0:$.docs,source:{originalSource:"{}",...(h=(j=m.parameters)==null?void 0:j.docs)==null?void 0:h.source}}};var k,b,A;d.parameters={...d.parameters,docs:{...(k=d.parameters)==null?void 0:k.docs,source:{originalSource:`{ args: { intent: 'success' } @@ -11,4 +11,4 @@ import{j as e}from"./jsx-runtime-ffb262ed.js";import{a as g}from"./chunk-AY7I2SM intent: 'negative' } }`,...(I=(P=u.parameters)==null?void 0:P.docs)==null?void 0:I.source}}};const le=["Default","Positive","Warning","Negative"];export{m as Default,u as Negative,d as Positive,p as Warning,le as __namedExportsOrder,ce as default}; -//# sourceMappingURL=AlertBanner.stories-25941079.js.map +//# sourceMappingURL=AlertBanner.stories-c8143fda.js.map diff --git a/assets/AlertBanner.stories-25941079.js.map b/assets/AlertBanner.stories-c8143fda.js.map similarity index 99% rename from assets/AlertBanner.stories-25941079.js.map rename to assets/AlertBanner.stories-c8143fda.js.map index 204dc1b0..ff8bd50c 100644 --- a/assets/AlertBanner.stories-25941079.js.map +++ b/assets/AlertBanner.stories-c8143fda.js.map @@ -1 +1 @@ -{"version":3,"file":"AlertBanner.stories-25941079.js","sources":["../../src/components/AlertBanner/AlertBanner.styles.ts","../../src/components/AlertBanner/stylesBuilder/stylesBuilder.ts","../../src/components/AlertBanner/AlertBanner.tsx","../../src/docs-components/AlertBannerDocs.tsx"],"sourcesContent":["import { AlertBannerIntent } from './types/AlertBannerIntent.type';\n\nimport { BaseProps } from '@/types/BaseProps';\nimport { IconName } from '@/utility-types/IconName';\n\nexport type AlertBannerConfig = {\n intent?: Partial>;\n innerElements?: {\n iconContainer?: BaseProps;\n actionContainer?: BaseProps;\n closeButton?: BaseProps;\n };\n} & BaseProps;\n\nexport const defaultConfig = {\n p: '$space-component-padding-medium',\n pl: '$space-component-padding-2xLarge',\n display: 'flex',\n alignItems: 'center',\n text: '$typo-body-medium',\n intent: {\n none: {\n backgroundColor: '$color-background-neutral-strong',\n color: '$color-content-primary-inverted',\n },\n success: {\n backgroundColor: '$color-background-positive-strong',\n color: '$color-content-primary-inverted',\n },\n warning: {\n backgroundColor: '$color-background-warning-strong',\n color: '$color-content-primary',\n },\n negative: {\n backgroundColor: '$color-background-negative-strong',\n color: '$color-content-primary-inverted',\n },\n },\n innerElements: {\n iconContainer: {\n mr: '$space-component-gap-small',\n },\n actionContainer: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: '$space-component-gap-small',\n ml: '$space-component-gap-large',\n },\n closeButton: {\n ml: 'auto',\n },\n },\n} satisfies AlertBannerConfig;\n\nexport const resolveIconName = (intent: AlertBannerIntent) => {\n const iconConfig = {\n none: '20-info-fill',\n success: '20-check-circle-fill',\n warning: '20-warning-fill',\n negative: '20-alert-fill',\n } satisfies Record>;\n\n return iconConfig[intent];\n};\n","import { AlertBannerProps } from '../AlertBanner.props';\nimport { defaultConfig } from '../AlertBanner.styles';\nimport { AlertBannerIntent } from '../types';\n\nimport { BareButtonProps } from '@/components/Button/Button.props';\nimport { GhostIconButtonProps } from '@/components/IconButton/IconButton.props';\nimport { mergeConfigWithCustom } from '@/services';\nimport { BaseProps } from '@/types/BaseProps';\n\ntype AlertBannerStylesBuilder = {\n container: BaseProps;\n iconContainer: BaseProps;\n actionContainer: BaseProps;\n closeButton: BaseProps;\n actionProps: Partial;\n closeButtonProps: Partial;\n};\n\nexport const stylesBuilder = (\n intent: AlertBannerIntent,\n custom: AlertBannerProps['custom'],\n): AlertBannerStylesBuilder => {\n const {\n intent: intentStyles,\n innerElements: { iconContainer, actionContainer, closeButton },\n ...restStyles\n } = mergeConfigWithCustom({ defaultConfig, custom });\n\n const actionProps = {\n appearance: intent === 'warning' ? 'reverseInverted' : 'inverted',\n } as const;\n\n const closeButtonProps = {\n appearance: intent === 'warning' ? 'primary' : 'inverted',\n } as const;\n\n return {\n container: {\n ...intentStyles[intent],\n ...restStyles,\n },\n iconContainer,\n actionContainer,\n actionProps,\n closeButtonProps,\n closeButton,\n };\n};\n","import { Icon } from '@virtuslab/tetrisly-icons';\nimport { FC, useMemo } from 'react';\n\nimport { AlertBannerProps } from './AlertBanner.props';\nimport { resolveIconName } from './AlertBanner.styles';\nimport { stylesBuilder } from './stylesBuilder';\nimport { Button } from '../Button';\nimport { IconButton } from '../IconButton';\n\nimport { useAction } from '@/hooks';\nimport { tet } from '@/tetrisly';\nimport { MarginProps } from '@/types';\n\nexport const AlertBanner: FC = ({\n text,\n intent = 'none',\n custom,\n action,\n onCloseClick,\n ...restProps\n}) => {\n const styles = useMemo(() => stylesBuilder(intent, custom), [intent, custom]);\n\n const [firstAction, secondAction] = useAction(action);\n\n const iconName = useMemo(() => resolveIconName(intent), [intent]);\n\n return (\n \n \n \n \n {text}\n {firstAction && (\n \n