gradio/templates/frontend/assets/TabItem.svelte_svelte_type_style_lang.40c372e9.js.map

{"version":3,"file":"TabItem.svelte_svelte_type_style_lang.40c372e9.js","sources":["../../../../ui/packages/tabs/src/Tabs.svelte"],"sourcesContent":["<script context=\"module\">\n\texport const TABS = {};\n</script>\n\n<script lang=\"ts\">\n\timport { setContext, createEventDispatcher, tick } from \"svelte\";\n\timport { writable } from \"svelte/store\";\n\timport type { SelectData } from \"@gradio/utils\";\n\n\tinterface Tab {\n\t\tname: string;\n\t\tid: object;\n\t}\n\n\texport let visible: boolean = true;\n\texport let elem_id: string = \"id\";\n\texport let elem_classes: Array<string> = [];\n\texport let selected: number | string | object;\n\n\tlet tabs: Array<Tab> = [];\n\n\tconst selected_tab = writable<false | object | number | string>(false);\n\tconst selected_tab_index = writable<number>(0);\n\tconst dispatch = createEventDispatcher<{\n\t\tchange: undefined;\n\t\tselect: SelectData;\n\t}>();\n\n\tsetContext(TABS, {\n\t\tregister_tab: (tab: Tab) => {\n\t\t\ttabs.push({ name: tab.name, id: tab.id });\n\t\t\tselected_tab.update((current) => current ?? tab.id);\n\t\t\ttabs = tabs;\n\t\t\treturn tabs.length - 1;\n\t\t},\n\t\tunregister_tab: (tab: Tab) => {\n\t\t\tconst i = tabs.findIndex((t) => t.id === tab.id);\n\t\t\ttabs.splice(i, 1);\n\t\t\tselected_tab.update((current) =>\n\t\t\t\tcurrent === tab.id ? tabs[i]?.id || tabs[tabs.length - 1]?.id : current\n\t\t\t);\n\t\t},\n\t\tselected_tab,\n\t\tselected_tab_index\n\t});\n\n\tfunction change_tab(id: object | string | number) {\n\t\tselected = id;\n\t\t$selected_tab = id;\n\t\t$selected_tab_index = tabs.findIndex((t) => t.id === id);\n\t\tdispatch(\"change\");\n\t}\n\n\t$: selected !== null && change_tab(selected);\n</script>\n\n<div class=\"tabs {elem_classes.join(' ')}\" class:hide={!visible} id={elem_id}>\n\t<div class=\"tab-nav scroll-hide\">\n\t\t{#each tabs as t, i (t.id)}\n\t\t\t{#if t.id === $selected_tab}\n\t\t\t\t<button class=\"selected\">\n\t\t\t\t\t{t.name}\n\t\t\t\t</button>\n\t\t\t{:else}\n\t\t\t\t<button\n\t\t\t\t\ton:click={() => {\n\t\t\t\t\t\tchange_tab(t.id);\n\t\t\t\t\t\tdispatch(\"select\", { value: t.name, index: i });\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{t.name}\n\t\t\t\t</button>\n\t\t\t{/if}\n\t\t{/each}\n\t</div>\n\t<slot />\n</div>\n\n<style>\n\t.tabs {\n\t\tdisplay: flex;\n\t\tposition: relative;\n\t\tflex-direction: column;\n\t}\n\n\t.hide {\n\t\tdisplay: none;\n\t}\n\n\t.tab-nav {\n\t\tdisplay: flex;\n\t\tposition: relative;\n\t\tflex-wrap: wrap;\n\t\tborder-bottom: 1px solid var(--border-color-primary);\n\t\twhite-space: nowrap;\n\t}\n\n\tbutton {\n\t\tmargin-bottom: -1px;\n\t\tborder: 1px solid transparent;\n\t\tborder-color: transparent;\n\t\tborder-bottom: none;\n\t\tborder-top-right-radius: var(--container-radius);\n\t\tborder-top-left-radius: var(--container-radius);\n\t\tpadding: var(--size-1) var(--size-4);\n\t\tcolor: var(--body-text-color-subdued);\n\t\tfont-weight: var(--section-header-text-weight);\n\t\tfont-size: var(--section-header-text-size);\n\t}\n\n\tbutton:hover {\n\t\tcolor: var(--body-text-color);\n\t}\n\t.selected {\n\t\tborder-color: var(--border-color-primary);\n\t\tbackground: var(--background-fill-primary);\n\t\tcolor: var(--body-text-color);\n\t}\n\n\t.bar {\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\tbottom: -2px;\n\t\tleft: 0;\n\t\tz-index: 999;\n\t\tbackground: var(--background-fill-primary);\n\t\twidth: 100%;\n\t\theight: 2px;\n\t\tcontent: \"\";\n\t}\n</style>\n"],"names":[],"mappings":"iTAsEM,MAAE,mIANJ,0EAME,MAAE,gEATF,MAAE,iGADJ,2CACE,MAAE,+EAFA,OAAE,KAAO,yRADR,gBAAc,MAAE,mBAArB,+PAFc,KAAa,KAAK,GAAG,8BAA8B,kBAAb,cAAxD,SACC,iGACQ,sIAFS,KAAa,KAAK,GAAG,0DAA8B,uBAAb,mHAvD1C,4DAaF,UAAmB,OACnB,UAAkB,SAClB,sBACA,cAEP,UAEE,GAAe,EAA2C,EAAK,0BAC/D,GAAqB,EAAiB,CAAC,2BACvC,GAAW,IAKjB,EAAW,GACV,aAAe,GACd,GAAK,MAAO,KAAM,EAAI,KAAM,GAAI,EAAI,KACpC,EAAa,OAAQ,GAAY,GAAW,EAAI,EAAE,SAE3C,EAAK,OAAS,GAEtB,eAAiB,SACV,GAAI,EAAK,UAAW,GAAM,EAAE,KAAO,EAAI,EAAE,EAC/C,EAAK,OAAO,EAAG,CAAC,EAChB,EAAa,OAAQ,GACpB,IAAY,EAAI,GAAK,EAAK,IAAI,IAAM,EAAK,EAAK,OAAS,IAAI,GAAK,CAAO,GAGzE,eACA,kCAGmB,OACnB,EAAW,CAAE,MACb,EAAgB,SAChB,EAAsB,EAAK,UAAW,GAAM,EAAE,KAAO,CAAE,KACvD,EAAS,QAAQ,kBAgBb,EAAW,EAAE,EAAE,EACf,EAAS,UAAY,MAAO,EAAE,KAAM,MAAO,uOAd7C,IAAa,MAAQ,EAAW,CAAQ"}