/*! For license information please see contextualhelp-stories-contextualhelp-stories.cae34d68.iframe.bundle.js.LICENSE.txt */
(globalThis.webpackChunk_spectrum_css_preview=globalThis.webpackChunk_spectrum_css_preview||[]).push([[5900,948],{"../components/contextualhelp/stories/contextualhelp.stories.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Default:()=>Default,TopPopover:()=>TopPopover,WithLink:()=>WithLink,__namedExportsOrder:()=>__namedExportsOrder,default:()=>contextualhelp_stories});var lit=__webpack_require__("../node_modules/lit/index.js"),class_map=__webpack_require__("../node_modules/lit/directives/class-map.js"),if_defined=__webpack_require__("../node_modules/lit/directives/if-defined.js"),style_map=__webpack_require__("../node_modules/lit/directives/style-map.js"),template=__webpack_require__("../components/actionbutton/stories/template.js"),stories_template=__webpack_require__("../components/link/stories/template.js"),popover_stories_template=__webpack_require__("../components/popover/stories/template.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),contextualhelp=__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/contextualhelp/index.css"),contextualhelp_default=__webpack_require__.n(contextualhelp),options={attributes:{"data-source":"processed"}};options.insert=insertBySelector_default().bind(null,"head");injectStylesIntoLinkTag_default()(contextualhelp_default(),options);const Template=({rootClass="spectrum-ContextualHelp",id,iconName,title,body,link,popoverPlacement,customStyles={},customClasses=[],...globals})=>lit.qy`
		<div
			class=${(0,class_map.H)({[rootClass]:!0,...customClasses.reduce(((a,c)=>({...a,[c]:!0})),{})})}
			id=${(0,if_defined.J)(id)}
			style=${(0,if_defined.J)((0,style_map.W)(customStyles))}
		>
			${popoverPlacement.includes("top")?lit.qy`<div
						class="dummy-spacing"
						style="position: relative; height: 200px;"
				  ></div> `:""}
			${(0,template.B)({...globals,size:"xs",iconName,customClasses:[`${rootClass}-button`]})}
			${(0,popover_stories_template.B)({isOpen:!0,content:[title?lit.qy`<h2 class="${rootClass}-heading">${title}</h2>`:"",body?lit.qy`<p class="${rootClass}-body">${body}</p>`:"",link?(0,stories_template.B)({text:link.text,url:link.url,customClasses:[`${rootClass}-link`]}):""],position:popoverPlacement,customClasses:[`${rootClass}-popover`],customStyles:{top:"25px"}})}
		</div>
	`;var actionbutton_stories=__webpack_require__("../components/actionbutton/stories/actionbutton.stories.js");const contextualhelp_stories={title:"Components/Contextual help",description:"Contextual Help shows a user extra information in relation to another component or view.",component:"ContextualHelp",argTypes:{title:{name:"Title",type:{name:"string",required:!0},table:{type:{summary:"string"},category:"Content"}},body:{name:"Body",type:{name:"string",required:!0},table:{type:{summary:"string"},category:"Content"}},iconName:{name:"Icon",type:{name:"string",required:!0},defaultValue:"Info",table:{type:{summary:"string"},category:"Component",defaultValue:{summary:"Info"}},options:["Info","Help"],control:"select"},popoverPlacement:{name:"Popover Placement",type:{name:"string",required:!0},defaultValue:"bottom-start",table:{type:{summary:"string"},category:"Component",defaultValue:{summary:"Info"}},options:["top","top-left","top-right","top-start","top-end","bottom","bottom-left","bottom-right","bottom-start","bottom-end","left","left-top","left-bottom","start","start-top","start-bottom","right","right-top","right-bottom","end","end-top","end-bottom"],control:"select"},link:{table:{disable:!0}}},args:{rootClass:"spectrum-ContextualHelp",iconName:"Info",popoverPlacement:"bottom-start"},parameters:{actions:{handles:[...actionbutton_stories.default?.parameters?.actions?.handles??[]]},status:{type:"migrated"}}},Default=Template.bind({});Default.args={title:"Permission required",body:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."};const WithLink=Template.bind({});WithLink.args={title:"Permission required",body:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",link:{text:"Learn about permissions",url:"#"}};const TopPopover=Template.bind({});TopPopover.args={popoverPlacement:"top",customStyles:{"max-inline-size":"275px"},title:"Top popover example of text wrapping in the title",body:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."};const __namedExportsOrder=["Default","WithLink","TopPopover"]},"../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/contextualhelp/index.css":(module,__unused_webpack_exports,__webpack_require__)=>{module.exports=__webpack_require__.p+"assets/css/components/contextualhelp/index.css"},"../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/link/index.css":(module,__unused_webpack_exports,__webpack_require__)=>{module.exports=__webpack_require__.p+"assets/css/components/link/index.css"},"../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/popover/index.css":(module,__unused_webpack_exports,__webpack_require__)=>{module.exports=__webpack_require__.p+"assets/css/components/popover/index.css"},"../components/link/stories/template.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{B:()=>Template});var lit=__webpack_require__("../node_modules/lit/index.js"),class_map=__webpack_require__("../node_modules/lit/directives/class-map.js"),if_defined=__webpack_require__("../node_modules/lit/directives/if-defined.js"),capitalize=__webpack_require__("../node_modules/lodash-es/capitalize.js"),lowerCase=__webpack_require__("../node_modules/lodash-es/lowerCase.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),cjs_ruleSet_1_rules_10_use_2_components_link=__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/link/index.css"),link_default=__webpack_require__.n(cjs_ruleSet_1_rules_10_use_2_components_link),options={attributes:{"data-source":"processed"}};options.insert=insertBySelector_default().bind(null,"head");injectStylesIntoLinkTag_default()(link_default(),options);const Template=({rootClass="spectrum-Link",url="#",text,variant,staticColor,isQuiet=!1,id,customClasses=[]})=>lit.qy`
		<a
			class=${(0,class_map.H)({[rootClass]:!0,[`${rootClass}--quiet`]:isQuiet,[`${rootClass}--${variant}`]:void 0!==variant,[`${rootClass}--static${(0,capitalize.A)((0,lowerCase.A)(staticColor))}`]:void 0!==staticColor,...customClasses.reduce(((a,c)=>({...a,[c]:!0})),{})})}
			id=${(0,if_defined.J)(id)}
			href=${(0,if_defined.J)(url)}
		>
			${text}
		</a>
	`},"../components/popover/stories/template.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{B:()=>Template});var lit=__webpack_require__("../node_modules/lit/index.js"),class_map=__webpack_require__("../node_modules/lit/directives/class-map.js"),if_defined=__webpack_require__("../node_modules/lit/directives/if-defined.js"),style_map=__webpack_require__("../node_modules/lit/directives/style-map.js"),when=__webpack_require__("../node_modules/lit-html/directives/when.js"),external_STORYBOOK_MODULE_PREVIEW_API_=__webpack_require__("@storybook/preview-api"),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),popover=__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/popover/index.css"),popover_default=__webpack_require__.n(popover),options={attributes:{"data-source":"processed"}};options.insert=insertBySelector_default().bind(null,"head");injectStylesIntoLinkTag_default()(popover_default(),options);const Template=({rootClass="spectrum-Popover",size="m",isOpen=!1,withTip=!1,position="top",customClasses=[],id="popover-1",testId,triggerId="trigger",customStyles={"inset-inline-start":"0px","inset-block-start":"0px"},trigger,content=[],...globals})=>{const[,updateArgs]=(0,external_STORYBOOK_MODULE_PREVIEW_API_.useArgs)();if(0===content.length)return console.warn("Popover: No content provided."),lit.qy``;const{express}=globals;try{express?__webpack_require__.e(5886).then(__webpack_require__.bind(__webpack_require__,"../components/popover/themes/express.css")):__webpack_require__.e(4077).then(__webpack_require__.bind(__webpack_require__,"../components/popover/themes/spectrum.css"))}catch(e){console.warn(e)}const nestedPopover="popover-nested"===id||"popover-nested-2"===id;return lit.qy`
		${(0,when.z)("function"==typeof trigger,(()=>trigger({...globals,isSelected:isOpen,isOpen:nestedPopover??!0,onclick:()=>{!nestedPopover&&setTimeout((()=>{if(!trigger||!position)return[];const element=document.querySelector(`#${triggerId}`);if(!element)return[];const rect=element.getBoundingClientRect(),popover=document.querySelector(`#${id}`);if(!popover)return[];const transforms=[],additionalStyles={},triggerXCenter=(rect.left+rect.right)/2,triggerYCenter=(rect.top+rect.bottom)/2,popWidth=popover.offsetWidth??0,popHeight=popover.offsetHeight??0,textDir=getComputedStyle(document.querySelector("html")).direction;let x,y,xOffset="+ 0px",yOffset="+ 0px";(position.includes("top")||position.includes("bottom")&&!position.includes("-top")&&!position.includes("-bottom"))&&(x=triggerXCenter-(popWidth>0?popWidth/2:popWidth)),(position.includes("left")||position.includes("right"))&&(y=triggerYCenter-(popHeight>0?popHeight/2:popHeight)),position.includes("top")&&!position.includes("-top")?(y=rect.top-popHeight,yOffset=withTip?"- (var(--spectrum-popover-pointer-height) + var(--spectrum-popover-animation-distance) - 1px)":"- var(--spectrum-popover-animation-distance)"):position.includes("bottom")&&!position.includes("-bottom")?(y=rect.bottom,yOffset="+ (var(--spectrum-popover-animation-distance))"):position.includes("left")?"rtl"==textDir?(x=rect.right,xOffset=withTip?"+ 0px":"+ var(--spectrum-popover-animation-distance)"):(x=rect.left-popWidth,xOffset=withTip?"- ((var(--spectrum-popover-pointer-width) / 2) + var(--spectrum-popover-animation-distance) - 2px)":"- var(--spectrum-popover-animation-distance)"):position.includes("right")&&("rtl"==textDir?(x=rect.left-popWidth,xOffset=withTip?"- ((var(--spectrum-popover-pointer-width) / 2) + var(--spectrum-popover-animation-distance) - 2px)":"- var(--spectrum-popover-animation-distance)"):(x=rect.right,xOffset=withTip?"+ 0px":"+ var(--spectrum-popover-animation-distance)")),x&&transforms.push(`translateX(calc(var(--flow-direction) * calc(${parseInt(x,10)}px ${xOffset})))`),y&&transforms.push(`translateY(calc(${y}px ${yOffset}))`),"top-start"===position||"bottom-start"===position?additionalStyles["inset-inline-start"]="calc("+popWidth/2+"px - var(--spectrum-popover-pointer-edge-offset))":"top-end"===position||"bottom-end"===position?additionalStyles["inset-inline-start"]="calc(-1 *"+popWidth/2+"px + var(--spectrum-popover-pointer-edge-offset))":"left-top"===position||"right-top"===position?additionalStyles["inset-block-start"]="calc("+popHeight/2+"px - var(--spectrum-popover-pointer-edge-offset))":"left-bottom"!==position&&"right-bottom"!==position||(additionalStyles["inset-block-start"]="calc(-1 *"+popHeight/2+"px + var(--spectrum-popover-pointer-edge-offset))"),updateArgs({isOpen:!isOpen,customStyles:{...customStyles,transform:transforms.join(" "),...additionalStyles}})}),100)}})))}

		<div
			class=${(0,class_map.H)({[rootClass]:!0,"is-open":isOpen,[`${rootClass}--size${size?.toUpperCase()}`]:void 0!==size,[`${rootClass}--withTip`]:withTip,[`${rootClass}--${position}`]:void 0!==position,...customClasses.reduce(((a,c)=>({...a,[c]:!0})),{})})}
			style=${(0,if_defined.J)((0,style_map.W)(customStyles))}
			role="presentation"
			id=${(0,if_defined.J)(id)}
			data-testid=${(0,if_defined.J)(testId)}
		>
			${content.map((c=>"function"==typeof c?c({}):c))}
			${withTip?position&&["top","bottom"].some((e=>position.startsWith(e)))?lit.qy`<svg class="${rootClass}-tip" viewBox="0 -0.5 16 9" width="10"><path class="${rootClass}-tip-triangle" d="M-1,-1 8,8 17,-1"></svg>`:lit.qy`<svg class="${rootClass}-tip" viewBox="0 -0.5 9 16" width="10"><path class="${rootClass}-tip-triangle" d="M-1,-1 8,8 -1,17"></svg>`:""}
		</div>
	`}},"../node_modules/lit-html/directives/when.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";function n(n,r,t){return n?r(n):t?.(n)}__webpack_require__.d(__webpack_exports__,{z:()=>n})}}]);
//# sourceMappingURL=contextualhelp-stories-contextualhelp-stories.cae34d68.iframe.bundle.js.map