/*! For license information please see splitview-stories-splitview-stories.bee5bb9b.iframe.bundle.js.LICENSE.txt */
(globalThis.webpackChunk_spectrum_css_preview=globalThis.webpackChunk_spectrum_css_preview||[]).push([[1862],{"../components/splitview/stories/splitview.stories.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Horizontal:()=>Horizontal,HorizontalCollapsedLeft:()=>HorizontalCollapsedLeft,HorizontalCollapsedRight:()=>HorizontalCollapsedRight,HorizontallyFocused:()=>HorizontallyFocused,HorizontallyResizable:()=>HorizontallyResizable,Vertical:()=>Vertical,VerticalCollapsedBottom:()=>VerticalCollapsedBottom,VerticalCollapsedTop:()=>VerticalCollapsedTop,VerticallyResizable:()=>VerticallyResizable,__namedExportsOrder:()=>__namedExportsOrder,default:()=>splitview_stories});var dist=__webpack_require__("../node_modules/@storybook/testing-library/dist/index.mjs"),lit=__webpack_require__("../node_modules/lit/index.js"),class_map=__webpack_require__("../node_modules/lit/directives/class-map.js"),when=__webpack_require__("../node_modules/lit-html/directives/when.js"),injectStylesIntoLinkTag=__webpack_require__("../node_modules/style-loader/dist/runtime/injectStylesIntoLinkTag.js"),injectStylesIntoLinkTag_default=__webpack_require__.n(injectStylesIntoLinkTag),insertBySelector=__webpack_require__("../node_modules/style-loader/dist/runtime/insertBySelector.js"),insertBySelector_default=__webpack_require__.n(insertBySelector),splitview=__webpack_require__("../node_modules/file-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[10].use[2]!../components/splitview/index.css"),splitview_default=__webpack_require__.n(splitview),options={attributes:{"data-source":"processed"}};options.insert=insertBySelector_default().bind(null,"head");injectStylesIntoLinkTag_default()(splitview_default(),options);const Template=({rootClass="spectrum-SplitView",customClasses=[],orientation="horizontal",isResizable=!1,isCollapsible=!1,collapsePosition,panelLabels=[],panelStyles=[],componentHeight="200px"})=>{const collapsibleClassName=isCollapsible&&(void 0!==collapsePosition&&"left"===collapsePosition||"top"===collapsePosition)?"start":isCollapsible&&(void 0!==collapsePosition&&"right"===collapsePosition||"bottom"===collapsePosition)?"end":"";return lit.qy`
		<div
			style="height: ${componentHeight};"
			class=${(0,class_map.H)({[rootClass]:!0,[`${rootClass}--${orientation}`]:orientation,...customClasses.reduce(((a,c)=>({...a,[c]:!0})),{})})}
		>
			<div class="spectrum-SplitView-pane" style="${panelStyles[0]}">
				${panelLabels[0]}
			</div>
			<div
				class=${(0,class_map.H)({[`${rootClass}-splitter`]:!0,"is-draggable":isResizable,[`is-collapsed-${collapsibleClassName}`]:isCollapsible})}
				tabindex="0"
				data-testid="splitter"
			>
				${(0,when.z)(isResizable,(()=>lit.qy`<div class="spectrum-SplitView-gripper"></div>`))}
			</div>
			<div class="spectrum-SplitView-pane" style="${panelStyles[1]}">
				${panelLabels[1]}
			</div>
		</div>
	`},splitview_stories={title:"Components/Split view",description:"The Splitview component is...",component:"Splitview",argTypes:{orientation:{name:"Orientation",type:{name:"string"},table:{type:{summary:"string"},category:"Component",disable:!0}},isResizable:{name:"Resizable",type:"boolean",table:{type:{summary:"boolean"},category:"Component",disable:!0},control:"boolean"},isCollapsible:{name:"Collapsible",type:"boolean",table:{type:{summary:"boolean"},category:"Component",disable:!0}},collapsePosition:{name:"Collapse position",type:"string",table:{type:{summary:"string"},category:"Component",disable:!0},control:"select",options:["left","right","top","bottom"],if:{arg:"isCollapsible",truthy:!0}},panelLabels:{name:"Panel labels",type:"string",table:{disable:!0}},panelStyles:{name:"Panel labels",type:"string",table:{disable:!0}},componentHeight:{name:"Component height",table:{disable:!0}}},args:{rootClass:"spectrum-SplitView",isResizable:!1,componentHeight:"200px"},parameters:{actions:{handles:[]},status:{type:"migrated"}}},Horizontal=Template.bind({});Horizontal.args={orientation:"horizontal",isResizable:!1,isCollapsible:!1,panelLabels:["Left","Right"],panelStyles:["width: 304px;","flex: 1;"]};const HorizontallyResizable=Template.bind({});HorizontallyResizable.args={orientation:"horizontal",isResizable:!0,isCollapsible:!1,panelLabels:["Left","Right"],panelStyles:["width: 304px;","flex: 1;"]};const HorizontallyFocused=Template.bind({});HorizontallyFocused.play=async({canvasElement})=>{const canvas=(0,dist.ux)(canvasElement);await canvas.getByTestId("splitter").focus()},HorizontallyFocused.args={orientation:"horizontal",isResizable:!0,isCollapsible:!1,panelLabels:["Left","Right"],panelStyles:["width: 304px;","flex: 1;"]};const HorizontalCollapsedLeft=Template.bind({});HorizontalCollapsedLeft.args={orientation:"horizontal",isResizable:!0,isCollapsible:!0,collapsePosition:"left",panelLabels:["Left","Right"],panelStyles:["width: 0;","flex: 1;"]};const HorizontalCollapsedRight=Template.bind({});HorizontalCollapsedRight.args={orientation:"horizontal",isResizable:!0,isCollapsible:!0,collapsePosition:"right",panelLabels:["Left","Right"],panelStyles:["flex: 1;","width: 0;"]};const Vertical=Template.bind({});Vertical.args={orientation:"vertical",isResizable:!1,isCollapsible:!1,panelLabels:["Top","Bottom"],panelStyles:["height: 50px;","flex: 1;"]};const VerticallyResizable=Template.bind({});VerticallyResizable.args={orientation:"vertical",isResizable:!0,isCollapsible:!1,panelLabels:["Top","Bottom"],panelStyles:["height: 50px;","flex: 1;"]};const VerticalCollapsedTop=Template.bind({});VerticalCollapsedTop.args={orientation:"vertical",isResizable:!0,isCollapsible:!0,collapsePosition:"top",panelLabels:["Top","Bottom"],panelStyles:["height: 0;","flex: 1;"]};const VerticalCollapsedBottom=Template.bind({});VerticalCollapsedBottom.args={orientation:"vertical",isResizable:!0,isCollapsible:!0,collapsePosition:"bottom",panelLabels:["Top","Bottom"],panelStyles:["flex: 1;","height: 0;"]};const __namedExportsOrder=["Horizontal","HorizontallyResizable","HorizontallyFocused","HorizontalCollapsedLeft","HorizontalCollapsedRight","Vertical","VerticallyResizable","VerticalCollapsedTop","VerticalCollapsedBottom"]},"../node_modules/file-loader/dist/cjs.js??ruleSet[1].rules[10].use[1]!../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[10].use[2]!../components/splitview/index.css":(module,__unused_webpack_exports,__webpack_require__)=>{module.exports=__webpack_require__.p+"assets/css/components/splitview/index.css"},"../node_modules/lit-html/directive.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{OA:()=>t,WL:()=>i,u$:()=>e});const t={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},e=t=>(...e)=>({_$litDirective$:t,values:e});class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}},"../node_modules/lit-html/directives/class-map.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{H:()=>e});var _lit_html_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../node_modules/lit-html/lit-html.js"),_directive_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../node_modules/lit-html/directive.js");const e=(0,_directive_js__WEBPACK_IMPORTED_MODULE_1__.u$)(class extends _directive_js__WEBPACK_IMPORTED_MODULE_1__.WL{constructor(t){if(super(t),t.type!==_directive_js__WEBPACK_IMPORTED_MODULE_1__.OA.ATTRIBUTE||"class"!==t.name||t.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)))}return _lit_html_js__WEBPACK_IMPORTED_MODULE_0__.c0}})},"../node_modules/lit/directives/class-map.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{H:()=>lit_html_directives_class_map_js__WEBPACK_IMPORTED_MODULE_0__.H});var lit_html_directives_class_map_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../node_modules/lit-html/directives/class-map.js")},"?d91c":()=>{}}]);
//# sourceMappingURL=splitview-stories-splitview-stories.bee5bb9b.iframe.bundle.js.map