@watermarkinsights/ripple 3.24.0 → 3.24.1

package/dist/ripple/p-0b21e936.system.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["colors","salmon","cyan","forest","sleet","midnight","lavender","periwinkle","gray","allChartsDetails","exports","doughnut","size","thickness","padding","category","doughnut0","doughnut1","doughnut2","doughnut2plus","doughnut3","bar","bar1","bar2","bar3","bar4","bar5","bar6","bar7","showValue","valueFormat","textHiddenMessage","intl","formatMessage","id","defaultMessage","description","seeDetailsMessage","abbrNumber","num","Math","round","amountToPercent","val","total","asInt","amountToDegree","toFixed","number","parseFloat","floor","polarToCartesian","half","radius","startAngle","endAngle","x","cos","PI","y","sin","undefined","x2","y2","x1","y1","getArc","largeArcFlag","chartSize","z","concat","scale","inMin","inMax","outMin","outMax","scaled","minSpacing","width","getMaxTicks","getInterval","largest","maxticks","minimum","magnitude","pow","log10","residual","interval","handleSliceKeyDown","ev","this","popoverEl","open","key","popoverBtn","querySelector","click","handleSliceClick","s","isTabbing","coords","clientX","clientY","openPopover","call","handleSliceFocus","getPosition","target","handleChartKeydown","preventDefault","focusPrevious","focusNext","exitChart","userIsNavigating","title","text","popoverTitle","popoverText","buttonText","sliceRef","window","setTimeout","_this","debouncedClosePopover_1","debounce","__awaiter","document","addEventListener","scrollableParent","findParentWithScrollbar","el","activeEl","checkForActiveElInShadow","activeElement","index","sliceEls","indexOf","length","focusSlice","componentWrapperEl","tabIndex","focusable","map","p","focus","getDetails","chartType","slicesDetails","acc","children","Array","from","reduce","slice","parseInt","getAttribute","forEach","c","i","amount","perc","colorIndex","notStartedColor","color","sliceDetails","legend","offset","uid","inSmallCluster","push","sortSlicesDetails","sortedSlicesDetails","__spreadArray","sort","a","b","idx","prev","next","prevPerc","nextPerc","isInSmallCluster","isSmall","prevIsSmall","nextIsSmall","lessThanOnePerc","getPathData","activeAngle","largeArcFlagOuter","largeArcFlagInner","chartDetails","innerRadius","outerRadius","isHybridDoughnut","outerSeparatorOffset","innerSeparatorOffset","outerCoords","innerCoords","moveTo","arc1","line","arc2","renderInstructionsText","chartInstructions","h","renderFilter","stdDeviation","result","operator","in2","in","renderDoughnut","outerSize","class","height","renderPath","transform","renderDoughnutText","fill","d","onClick","onFocus","onKeyDown","role","arcMiddle","_a","renderStackedBar","isHybridBar","drawAxis","tempValueFormat","renderBarText","renderStackedBarSegment","renderCompletionMessage","isLastSlice","style","backgroundColor","renderSimpleBar","labelWidth","getComputedStyle","getPropertyValue","chartPadding","componentWidth","getBoundingClientRect","chartWidth","numTicks","lastTickVal","extraTicks","setProperty","showBarLegend","rows","renderSimpleBarLegend","renderSimpleBarItem","ticks","tickVal","showGrid","show","hidden","chartMaxVal","currentChartType","cssWidth","amt","displayValue","renderLegend","showLegend","hasCluster","isBar","cur","mode","renderLegendItem","renderHiddenValuesMessage","legendItem","completionMessage"],"sources":["src/components/charts/chartFunctions.tsx"],"sourcesContent":["import { h } from \"@stencil/core\";\r\nimport { checkForActiveElInShadow, debounce, findParentWithScrollbar, getPosition, intl } from \"../../global/functions\";\r\nimport { LegendItem, ChartType, ChartDetails, SliceDetails, SliceElement } from \"../../global/interfaces\";\r\n\r\nconst colors = {\r\n  salmon: \"#ff5f4e\",\r\n  cyan: \"#19a1a9\",\r\n  forest: \"#088000\",\r\n  sleet: \"#7f97ad\",\r\n  midnight: \"#2e1b46\",\r\n  lavender: \"#8b86ca\",\r\n  periwinkle: \"#575195\",\r\n  gray: \"#6b6b6b\",\r\n};\r\n\r\nexport const allChartsDetails: { [Key in ChartType]: ChartDetails } = {\r\n  // for progress monitor\r\n  doughnut: {\r\n    size: 155,\r\n    colors: [colors.forest, colors.gray],\r\n    thickness: 0.73,\r\n    padding: 25,\r\n    category: \"doughnut\",\r\n  },\r\n  // deprecated hybrid chart type, should use Progress Indicator's \"doughnut\" instead\r\n  doughnut0: {\r\n    size: 155,\r\n    colors: [colors.forest, colors.gray],\r\n    thickness: 0.73,\r\n    padding: 25,\r\n    category: \"doughnut\",\r\n  },\r\n  doughnut1: {\r\n    size: 130,\r\n    colors: [colors.lavender, colors.midnight, colors.gray],\r\n    thickness: 0.5,\r\n    padding: 90,\r\n    category: \"doughnut\",\r\n  },\r\n  doughnut2: {\r\n    size: 130,\r\n    colors: [colors.cyan, colors.salmon, colors.gray],\r\n    thickness: 0.5,\r\n    padding: 90,\r\n    category: \"doughnut\",\r\n  },\r\n  // an internal type only for use when doughnut 2 is populated with 4 slices\r\n  // in this case, the first slice is colored purple\r\n  doughnut2plus: {\r\n    size: 130,\r\n    colors: [colors.periwinkle, colors.cyan, colors.salmon, colors.gray],\r\n    thickness: 0.5,\r\n    padding: 90,\r\n    category: \"doughnut\",\r\n  },\r\n  doughnut3: {\r\n    size: 130,\r\n    colors: [colors.lavender, colors.midnight, \"#0089e4\", colors.forest, \"#ea8500\", \"#d54f41\", \"#146ca9\"],\r\n    thickness: 0.5,\r\n    padding: 90,\r\n    category: \"doughnut\",\r\n  },\r\n  // for progress monitor\r\n  bar: {\r\n    size: 350,\r\n    colors: [colors.forest, colors.gray],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  // deprecated hybrid chart type, should use Progress Indicator's \"bar\" instead\r\n  bar1: {\r\n    size: 350,\r\n    colors: [colors.forest, colors.gray],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar2: {\r\n    size: 400,\r\n    colors: [colors.gray, colors.periwinkle, colors.cyan, colors.salmon],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar3: {\r\n    size: 300,\r\n    colors: [\"#0d696e\", colors.cyan, \"#8e4129\", colors.salmon],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar4: {\r\n    size: 400,\r\n    colors: [colors.salmon, colors.cyan, colors.periwinkle],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar5: {\r\n    size: 400,\r\n    colors: [\r\n      colors.gray, // this is only used if prop notStartedColor is set\r\n      colors.lavender,\r\n      colors.midnight,\r\n      \"#0089e4\",\r\n      colors.forest,\r\n      \"#ea8500\",\r\n      \"#d54f41\",\r\n      \"#146ca9\",\r\n    ],\r\n    padding: 0,\r\n    category: \"stackedBar\",\r\n  },\r\n  bar6: {\r\n    size: 400,\r\n    colors: [colors.lavender],\r\n    padding: 0,\r\n    category: \"simpleBar\",\r\n  },\r\n  bar7: {\r\n    size: 400,\r\n    colors: [colors.periwinkle, colors.cyan, colors.salmon, colors.gray],\r\n    padding: 0,\r\n    category: \"simpleBar\",\r\n  },\r\n};\r\n\r\nfunction showValue(valueFormat: string): string {\r\n  return valueFormat === \"percentage\" || valueFormat === \"amount\" ? \"show-values\" : \"\";\r\n}\r\n\r\nexport const textHiddenMessage = intl.formatMessage({\r\n  id: \"chart.hiddenValues\",\r\n  defaultMessage: \"Values are not shown when too close to each other.\",\r\n  description: \"Text displayed when a chart has some values hidden\",\r\n});\r\n\r\nexport const seeDetailsMessage = intl.formatMessage({\r\n  id: \"chart.clickToSeeDetails\",\r\n  defaultMessage: \"Click or use arrow keys to see details.\",\r\n  description: \"Text displayed, guiding user to interact to see more details.\",\r\n});\r\n\r\nfunction abbrNumber(num: number) {\r\n  return num > 999 ? Math.round(num / 100) / 10 + \"K\" : num;\r\n}\r\n\r\nexport function amountToPercent(val: number, total: number, asInt: boolean) {\r\n  return asInt ? Math.round((val * 100) / total) : Math.round((val * 10000) / total) / 100; // with 2 decimals\r\n}\r\n\r\nexport function amountToDegree(val: number, total: number) {\r\n  // In a circle of {total}, determine degrees of slice {val}\r\n  return (val * 360) / total;\r\n}\r\n\r\nexport function toFixed(number: number) {\r\n  return parseFloat((Math.floor(number * 100) / 100).toFixed(2));\r\n}\r\n\r\nexport function polarToCartesian(half: number, radius: number, startAngle: number, endAngle?: number) {\r\n  var x = toFixed(half + half * radius * Math.cos((Math.PI * startAngle) / 180));\r\n  var y = toFixed(half + half * radius * Math.sin((Math.PI * startAngle) / 180));\r\n  if (endAngle !== undefined) {\r\n    // if a 2nd angle value was passed, return 2 pairs of coords\r\n    var x2 = toFixed(half + half * radius * Math.cos((Math.PI * endAngle) / 180));\r\n    var y2 = toFixed(half + half * radius * Math.sin((Math.PI * endAngle) / 180));\r\n    return { x1: x, y1: y, x2, y2 };\r\n  }\r\n  return { x, y };\r\n}\r\n\r\nfunction getArc(radius: number, largeArcFlag: string, x: number, y: number, chartSize: number) {\r\n  var z = toFixed((chartSize / 2) * radius);\r\n  return `A ${z}, ${z} 0 ${largeArcFlag} ${toFixed(x)}, ${toFixed(y)}`;\r\n}\r\n\r\nfunction scale(val: number, inMin: number, inMax: number, outMin: number, outMax: number) {\r\n  let scaled = ((val - inMin) * (outMax - outMin)) / (inMax - inMin) + outMin;\r\n  // clip the values so that whatever is passed in the output is never smaller than outMin or greater than outMax\r\n  return scaled < outMin ? outMin : scaled > outMax ? outMax : scaled;\r\n}\r\n\r\nfunction minSpacing(width: number) {\r\n  // minimum spacing between 2 ticks, in px\r\n  return scale(width, 300, 900, 70, 150);\r\n}\r\n\r\nfunction getMaxTicks(width: number) {\r\n  return Math.round(width / minSpacing(width));\r\n}\r\n\r\nfunction getInterval(largest: number, maxticks: number) {\r\n  const minimum = largest / maxticks;\r\n  const magnitude = 10 ** Math.floor(Math.log10(minimum));\r\n  const residual = minimum / magnitude;\r\n  let interval;\r\n  if (residual > 5) {\r\n    interval = 10 * magnitude;\r\n  } else if (residual > 3) {\r\n    interval = 5 * magnitude;\r\n  } else if (residual > 2) {\r\n    interval = 3 * magnitude;\r\n  } else if (residual > 1.5) {\r\n    interval = 2 * magnitude;\r\n  } else if (residual > 1) {\r\n    interval = 1.5 * magnitude;\r\n  } else {\r\n    interval = magnitude;\r\n  }\r\n  return interval;\r\n}\r\n\r\nfunction handleSliceKeyDown(this: any, ev: KeyboardEvent) {\r\n  if (this.popoverEl && this.popoverEl.open && ev.key === \"Enter\") {\r\n    const popoverBtn = this.popoverEl.querySelector(\"button\");\r\n    popoverBtn && popoverBtn.click();\r\n  }\r\n}\r\n\r\nexport function handleSliceClick(this: any, ev: MouseEvent, s: SliceDetails) {\r\n  if (this.popoverEl && !this.isTabbing) {\r\n    s.coords = { x: ev.clientX, y: ev.clientY };\r\n    openPopover.call(this, s);\r\n  }\r\n}\r\n\r\nfunction handleSliceFocus(this: any, ev: FocusEvent, s: SliceDetails) {\r\n  if (this.popoverEl && this.isTabbing) {\r\n    s.coords = getPosition(ev.target as HTMLElement);\r\n    openPopover.call(this, s);\r\n  }\r\n}\r\n\r\nexport function handleChartKeydown(this: any, ev: KeyboardEvent) {\r\n  switch (ev.key) {\r\n    // arrow up / left\r\n    case \"ArrowUp\":\r\n    case \"ArrowLeft\":\r\n      ev.preventDefault();\r\n      this.isTabbing = true; // shd already be true. just in case user clicked on chart then pressed an arrow key\r\n      focusPrevious.call(this);\r\n      break;\r\n    // arrow right / down\r\n    case \"ArrowRight\":\r\n    case \"ArrowDown\":\r\n      ev.preventDefault();\r\n      this.isTabbing = true; // shd already be true. just in case user clicked on chart then pressed an arrow key\r\n      focusNext.call(this);\r\n      break;\r\n    // tab\r\n    case \"Tab\":\r\n      exitChart.call(this);\r\n      break;\r\n    case \"Escape\":\r\n      this.popoverEl!.open = false;\r\n      this.userIsNavigating = false;\r\n      break;\r\n  }\r\n}\r\n\r\nexport function openPopover(this: any, s: SliceDetails) {\r\n  if (!!this.popoverEl && !!s.title && !!s.text) {\r\n    this.popoverEl.popoverTitle = s.title;\r\n    this.popoverEl.popoverText = s.text;\r\n    this.popoverEl.buttonText = s.buttonText;\r\n    this.popoverEl.coords = s.coords;\r\n    this.popoverEl.sliceRef = s.sliceRef;\r\n    window.setTimeout(() => {\r\n      if (this.popoverEl) {\r\n        this.popoverEl.open = true;\r\n      }\r\n    }, 30);\r\n\r\n    const debouncedClosePopover = debounce(async () => {\r\n      this.popoverEl!.open = false;\r\n    }, 10);\r\n\r\n    // set up event listeners for scrolling\r\n    // to close popover on page scroll\r\n    document.addEventListener(\"scroll\", () => {\r\n      debouncedClosePopover();\r\n    });\r\n\r\n    // ... and on parent scroll\r\n    const scrollableParent = findParentWithScrollbar(this.el as HTMLElement);\r\n    if (!!scrollableParent) {\r\n      scrollableParent.addEventListener(\"scroll\", () => {\r\n        debouncedClosePopover();\r\n      });\r\n    }\r\n  }\r\n}\r\n\r\nfunction focusNext(this: any) {\r\n  const activeEl = checkForActiveElInShadow(document.activeElement as HTMLElement);\r\n  const index =\r\n    // if the active el is not in the array the first element gets focused\r\n    (this.sliceEls!.indexOf(activeEl as HTMLElement) + 1) % this.sliceEls!.length;\r\n  focusSlice.call(this, index);\r\n}\r\n\r\nfunction focusPrevious(this: any) {\r\n  if (this.sliceEls) {\r\n    const activeEl = checkForActiveElInShadow(document.activeElement as HTMLElement);\r\n    let index = this.sliceEls.indexOf(activeEl as SliceElement);\r\n\r\n    if (index === -1) {\r\n      // not in the array : focus the first slice\r\n      index = 0;\r\n    } else if (index === 0) {\r\n      // first slice : focus the last slice\r\n      index = this.sliceEls.length - 1;\r\n    } else {\r\n      // anything else: focus previous\r\n      index -= 1;\r\n    }\r\n    focusSlice.call(this, index);\r\n  }\r\n}\r\n\r\nfunction focusSlice(this: any, index: number) {\r\n  if (this.sliceEls && this.el) {\r\n    this.userIsNavigating = true;\r\n    if (this.popoverEl) {\r\n      this.popoverEl.open = false;\r\n    }\r\n    // set tabindex of the wrapper to -1 while slices are being focused, to allow for shft-tabbing out of the component directly\r\n    this.componentWrapperEl.tabIndex = -1;\r\n    // @ts-ignore\r\n    this.el.focusable = false; // for Edge\r\n    this.sliceEls.map((p: SliceElement) => {\r\n      p.tabIndex = -1;\r\n      // @ts-ignore\r\n      p.focusable = false; // for Edge\r\n    });\r\n    this.sliceEls[index].tabIndex = 0;\r\n    // @ts-ignore\r\n    this.sliceEls[index].focusable = true; // for Edge\r\n    this.sliceEls[index].focus();\r\n    window.setTimeout(() => {\r\n      if (this.popoverEl) {\r\n        this.popoverEl.open = true;\r\n      }\r\n    }, 10);\r\n  }\r\n}\r\n\r\nexport function exitChart(this: any) {\r\n  this.sliceEls &&\r\n    this.sliceEls.map((p: SliceElement) => {\r\n      p.tabIndex = -1;\r\n      // @ts-ignore\r\n      p.focusable = false; // for Edge\r\n    });\r\n  this.userIsNavigating = false;\r\n  // delay so that we can tab out of component before chart becomes focusable again\r\n  // and in case user was still pressing an arrow key when they pressed tab\r\n  window.setTimeout(() => {\r\n    this.componentWrapperEl.tabIndex = 0;\r\n    // @ts-ignore\r\n    this.el.focusable = true; // for Edge\r\n    if (this.popoverEl) {\r\n      this.popoverEl.open = false;\r\n    }\r\n  }, 100);\r\n}\r\n\r\nexport async function getDetails(this: any, chartType: ChartType) {\r\n  this.slicesDetails = [];\r\n  let acc = 0;\r\n  const children = Array.from(this.el.children) as Array<HTMLWmChartSliceElement>;\r\n\r\n  this.total = children.reduce(\r\n    (total: number, slice: SliceElement) => (total += parseInt(slice.getAttribute(\"amount\") || \"0\")),\r\n    0\r\n  );\r\n\r\n  children.forEach((c: Element, i: number) => {\r\n    const amount = parseInt(c.getAttribute(\"amount\") || \"0\");\r\n    const perc = amountToPercent(amount, this.total, true);\r\n\r\n    let colorIndex = i;\r\n\r\n    // for bar5, first color should be skipped unless notStartedColor is set to true\r\n    if (chartType === \"bar5\") {\r\n      colorIndex = this.notStartedColor ? i : i + 1;\r\n    }\r\n\r\n    // bars in bar6 are all the same color\r\n    if (chartType === \"bar6\") {\r\n      colorIndex = 0;\r\n    }\r\n\r\n    const color = allChartsDetails[chartType].colors[colorIndex];\r\n\r\n    const sliceDetails: SliceDetails = {\r\n      amount: amount,\r\n      perc: perc,\r\n      legend: c.getAttribute(\"legend\"),\r\n      color: color || colors.gray,\r\n      offset: acc,\r\n      id: `${this.uid}-${i + 1}`,\r\n      title: c.getAttribute(\"popover-title\"),\r\n      text: c.getAttribute(\"popover-text\"),\r\n      buttonText: c.getAttribute(\"popover-button-text\"),\r\n      sliceRef: c,\r\n      inSmallCluster: false,\r\n    };\r\n    acc += amount;\r\n    this.slicesDetails.push(sliceDetails);\r\n  });\r\n}\r\n\r\nfunction sortSlicesDetails(slicesDetails: SliceDetails[], total: number): SliceDetails[] {\r\n  // sort slices by decreasing amount\r\n  let sortedSlicesDetails = [...slicesDetails].sort((a: SliceDetails, b: SliceDetails) =>\r\n    a.amount === b.amount ? 0 : a.amount > b.amount ? -1 : 1\r\n  );\r\n\r\n  let acc = 0;\r\n\r\n  sortedSlicesDetails.forEach((s: SliceDetails, idx: number) => {\r\n    const prev = sortedSlicesDetails[idx === 0 ? sortedSlicesDetails.length - 1 : idx - 1];\r\n    const next = sortedSlicesDetails[idx === sortedSlicesDetails.length - 1 ? 0 : idx + 1];\r\n    const prevPerc = amountToPercent(prev.amount, total, true);\r\n    const nextPerc = amountToPercent(next.amount, total, true);\r\n\r\n    s.offset = acc;\r\n    acc += s.amount;\r\n    s.inSmallCluster = isInSmallCluster(prevPerc, s.perc, s.amount, nextPerc);\r\n  });\r\n  return sortedSlicesDetails;\r\n}\r\n\r\nfunction isInSmallCluster(prevPerc: number, perc: number, amount: number, nextPerc: number): boolean {\r\n  // determine whether the slice is in a cluster of small values\r\n  // to avoid percentage text overlap for small values\r\n  const isSmall = perc < 4;\r\n  const prevIsSmall = prevPerc < 5;\r\n  const nextIsSmall = nextPerc < 5;\r\n  let inSmallCluster = isSmall && (prevIsSmall || nextIsSmall);\r\n\r\n  // because <1% slice percentage text has an additional character\r\n  // the inSmallCluster threshold needs to be widened for that slice only\r\n  const lessThanOnePerc = perc === 0 && amount > 0;\r\n  if (lessThanOnePerc && (nextPerc < 8 || prevPerc < 8)) {\r\n    inSmallCluster = true;\r\n  }\r\n\r\n  return inSmallCluster;\r\n}\r\n\r\nfunction getPathData(this: any, amount: number, offset: number, chartType: ChartType) {\r\n  const startAngle = amountToDegree(offset, this.total) - 90; // start at noon, not at 3 o'clock\r\n  const activeAngle = (amount / this.total) * 360;\r\n  let endAngle = startAngle + activeAngle;\r\n  const largeArcFlagOuter = activeAngle > 180 ? \"1 1\" : \"0 1\";\r\n  const largeArcFlagInner = activeAngle > 180 ? \"1 0\" : \"0 0\";\r\n  const half = this.chartDetails.size / 2;\r\n  const innerRadius = this.chartDetails.thickness!;\r\n  const outerRadius = 1;\r\n\r\n  const isHybridDoughnut = chartType === \"doughnut0\" || chartType === \"doughnut\";\r\n  const outerSeparatorOffset = 1.5;\r\n  const innerSeparatorOffset = isHybridDoughnut ? 2.25 : 3;\r\n\r\n  if (activeAngle === 360) {\r\n    // fix to avoid bad svg shape when the path goes all around (100%)\r\n    endAngle -= 0.01;\r\n  }\r\n\r\n  const outerCoords = polarToCartesian(\r\n    half,\r\n    outerRadius,\r\n    startAngle + outerSeparatorOffset, // Addition for slice separator\r\n    endAngle\r\n  );\r\n  const innerCoords = polarToCartesian(\r\n    half,\r\n    innerRadius,\r\n    startAngle + innerSeparatorOffset, // Addition for slice separator\r\n    endAngle\r\n  );\r\n\r\n  const moveTo = `M ${outerCoords.x1}, ${outerCoords.y1} `;\r\n  const arc1 = getArc(outerRadius, largeArcFlagOuter, outerCoords.x2!, outerCoords.y2!, this.chartDetails.size);\r\n  const line = ` L ${innerCoords.x2}, ${innerCoords.y2} `;\r\n  const arc2 = getArc(innerRadius, largeArcFlagInner, innerCoords.x1!, innerCoords.y1!, this.chartDetails.size);\r\n\r\n  return moveTo + arc1 + line + arc2 + \" z\";\r\n}\r\n\r\nexport function renderInstructionsText() {\r\n  const chartInstructions = intl.formatMessage({\r\n    id: \"chart.instructions\",\r\n    defaultMessage: \"Use arrow keys to browse elements, press Tab to exit.\",\r\n    description: \"For screen readers only, instructions on how to interact with the chart component\",\r\n  });\r\n\r\n  return <div id=\"chart-instructions\">{chartInstructions}</div>;\r\n}\r\n\r\nfunction renderFilter() {\r\n  return (\r\n    <defs>\r\n      <filter id=\"wmHoverDropShadow\">\r\n        <feGaussianBlur stdDeviation=\"3\"></feGaussianBlur>\r\n        <feOffset result=\"offsetblur\"></feOffset>\r\n        <feFlood flood-color=\"#333\"></feFlood>\r\n        <feComposite operator=\"in\" in2=\"offsetblur\"></feComposite>\r\n        <feMerge>\r\n          <feMergeNode></feMergeNode>\r\n          <feMergeNode in=\"SourceGraphic\"></feMergeNode>\r\n        </feMerge>\r\n      </filter>\r\n    </defs>\r\n  );\r\n}\r\n\r\nexport function renderDoughnut(this: any, chartType: ChartType) {\r\n  const outerSize = this.chartDetails.size + this.chartDetails.padding;\r\n  const isHybridDoughnut = chartType === \"doughnut0\" || chartType === \"doughnut\";\r\n  // no sorting in progress indicators\r\n  let slicesDetails = isHybridDoughnut ? this.slicesDetails : sortSlicesDetails(this.slicesDetails, this.total);\r\n\r\n  return (\r\n    <div class=\"chart-wrapper doughnut-wrapper\">\r\n      <svg width={outerSize + \"px\"} height={outerSize + \"px\"} id={`graphic-${this.uid}`} class=\"doughnut-svg\">\r\n        {renderFilter()}\r\n        {slicesDetails.map((s: SliceDetails) => renderPath.call(this, s, chartType))}\r\n        {isHybridDoughnut ? (\r\n          <text\r\n            class=\"value\"\r\n            x=\"50%\"\r\n            y=\"50%\"\r\n            font-size=\"1.5rem\"\r\n            font-weight=\"500\"\r\n            text-anchor=\"middle\"\r\n            dominant-baseline=\"middle\"\r\n          >\r\n            {amountToPercent(slicesDetails[0].amount, this.total, true) + \"%\"}\r\n          </text>\r\n        ) : (\r\n          <g\r\n            transform={`translate(${this.chartDetails.padding / 2}, ${this.chartDetails.padding / 2})`}\r\n            text-anchor=\"middle\"\r\n            dominant-baseline=\"middle\"\r\n          >\r\n            {slicesDetails.map((s: SliceDetails) =>\r\n              s.amount > 0 && !s.inSmallCluster ? renderDoughnutText.call(this, s) : \"\"\r\n            )}\r\n          </g>\r\n        )}\r\n      </svg>\r\n    </div>\r\n  );\r\n}\r\n\r\nfunction renderPath(this: any, s: SliceDetails, chartType: ChartType) {\r\n  return (\r\n    <g transform={`translate(${this.chartDetails.padding / 2}, ${this.chartDetails.padding / 2})`}>\r\n      <path\r\n        id={s.id}\r\n        class=\"segment doughnut-segment\"\r\n        fill={s.amount ? s.color : \"transparent\"}\r\n        d={getPathData.call(this, s.amount, s.offset, chartType)}\r\n        onClick={(ev) => handleSliceClick.call(this, ev, s)}\r\n        onFocus={(ev) => handleSliceFocus.call(this, ev, s)}\r\n        onKeyDown={(ev) => handleSliceKeyDown.call(this, ev)}\r\n        role=\"img\"\r\n        aria-label={s.legend}\r\n      ></path>\r\n    </g>\r\n  );\r\n}\r\n\r\nfunction renderDoughnutText(this: any, s: SliceDetails) {\r\n  const arcMiddle = amountToDegree(s.offset + s.amount / 2, this.total);\r\n  let { x, y } = polarToCartesian(this.chartDetails.size / 2, 1.4, arcMiddle - 90);\r\n  return (\r\n    <text class=\"value\" x={x + \"px\"} y={y + \"px\"}>\r\n      {`${s.perc > 0 ? s.perc : \"<1\"}%`}\r\n    </text>\r\n  );\r\n}\r\n\r\nexport function renderStackedBar(this: any, chartType: ChartType) {\r\n  const isHybridBar = chartType === \"bar1\" || chartType === \"bar\";\r\n  return (\r\n    <div class=\"chart-wrapper bar-wrapper\">\r\n      {isHybridBar ? (\r\n        <div class=\"single-perc\">{amountToPercent(this.slicesDetails[0].amount, this.total, true) + \"%\"}</div>\r\n      ) : (\r\n        \"\"\r\n      )}\r\n      {this.chartType === \"bar3\" && this.drawAxis()}\r\n      <div class={`inner-stacked-bar-wrapper ${showValue(this.tempValueFormat)}`}>\r\n        {!isHybridBar ? (\r\n          <div class=\"values\">\r\n            {this.slicesDetails.map((s: SliceDetails, idx: number) => this.renderBarText(s, idx))}\r\n          </div>\r\n        ) : (\r\n          \"\"\r\n        )}\r\n        <div class=\"stacked-bar-segments-wrapper\">\r\n          {this.slicesDetails.map((s: SliceDetails, idx: number) => renderStackedBarSegment.call(this, s, idx))}\r\n        </div>\r\n        {isHybridBar ? renderCompletionMessage.call(this) : \"\"}\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n\r\nfunction renderStackedBarSegment(this: any, s: SliceDetails, idx: number) {\r\n  const isLastSlice = idx !== this.slicesDetails.length - 1;\r\n  const width = `calc(${amountToPercent(s.amount, this.total, false)}%${isLastSlice ? \" - 2px\" : \"\"})`;\r\n\r\n  return (\r\n    <div\r\n      class={`segment stacked-bar-segment ${amountToPercent(s.amount, this.total, false) === 0 ? \"zero\" : \"\"}`}\r\n      style={{\r\n        backgroundColor: s.color,\r\n        width: width,\r\n      }}\r\n      onClick={(ev) => handleSliceClick.call(this, ev, s)}\r\n      onFocus={(ev) => handleSliceFocus.call(this, ev, s)}\r\n      onKeyDown={(ev) => handleSliceKeyDown.call(this, ev)}\r\n    >\r\n      <span class=\"sr-only\">{s.legend}</span>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport function renderSimpleBar(this: any, chartType: ChartType) {\r\n  // find largest number and get interval, numTicks, chartMaxVal for all.\r\n  const largest = this.slicesDetails\r\n    .map((s: SliceDetails) => s.amount)\r\n    .reduce((a: number, b: number) => {\r\n      return a > b ? a : b;\r\n    });\r\n  const labelWidth = parseInt(getComputedStyle(this.el).getPropertyValue(\"--labelWidth\"), 10);\r\n  const chartPadding = 48; \r\n  const componentWidth = this.el.getBoundingClientRect().width;\r\n  const chartWidth = componentWidth - labelWidth - chartPadding;\r\n  let numTicks = getMaxTicks(chartWidth);\r\n  let interval = getInterval(largest, numTicks);\r\n  // after the algorithm finds an interval, remove extra ticks so that the greater number is always between the last tick and the one before that\r\n  const lastTickVal = numTicks * interval;\r\n  const extraTicks = Math.floor((lastTickVal - largest) / interval);\r\n  numTicks -= extraTicks;\r\n\r\n  this.el.style.setProperty(\"--backgroundSize\", 100 / numTicks + \"%\");\r\n  this.el.style.setProperty(\"--labelWidth\", this.labelWidth);\r\n\r\n  if (chartType === \"bar7\" && !this.showBarLegend) {\r\n    this.el.style.setProperty(\"--labelWidth\", \"0px\");\r\n  }\r\n\r\n  // we have to prep the data here rather than iterate directly in the return statement\r\n  // because CSS grid needs a flat structure, and return functions must\r\n  // have a single parent element\r\n  const rows: HTMLElement[] = [];\r\n  this.slicesDetails.forEach((s: SliceDetails) => {\r\n    s.legend && rows.push(renderSimpleBarLegend(s.legend, this.showBarLegend, chartType));\r\n    rows.push(renderSimpleBarItem.call(this, s, interval, numTicks, largest));\r\n  });\r\n\r\n  const ticks = [];\r\n  for (let i = 1; i <= numTicks; i++) {\r\n    const tickVal: number | string = abbrNumber(i * interval);\r\n    ticks.push(\r\n      <div class=\"tick\">\r\n        <span>{tickVal}</span>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  const showGrid = chartType === \"bar6\" && this.showGrid && this.el.getBoundingClientRect().width > 300;\r\n\r\n  return (\r\n    <div class=\"chart-wrapper simple-bar-wrapper\">\r\n      <div class={`chart ${showValue(this.tempValueFormat)}`}>\r\n        {showGrid && <div class=\"gridlines\"></div>}\r\n        <div class=\"rows\">{rows}</div>\r\n      </div>\r\n      {showGrid && (\r\n        <div class=\"x-axis\" aria-hidden=\"true\">\r\n          <div class=\"zero\">\r\n            <span>0</span>\r\n          </div>\r\n          {ticks}\r\n        </div>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n\r\nfunction renderSimpleBarLegend(legend: string, show: boolean, chartType: ChartType): HTMLLabelElement {\r\n  // not sure how to collapse the left column to 0 width with CSS grid. text should still be available to SR.\r\n  const hidden = chartType === \"bar7\" && !show ? \" hidden\" : \"\";\r\n  return <label class={`label${hidden}`}>{legend}</label>;\r\n}\r\n\r\nfunction renderSimpleBarItem(\r\n  this: any,\r\n  s: SliceDetails,\r\n  interval: number,\r\n  ticks: number,\r\n  largest: number\r\n): HTMLDivElement {\r\n  const chartMaxVal = this.currentChartType === \"bar6\" ? interval * ticks : largest;\r\n  const width = amountToPercent(s.amount, chartMaxVal, false);\r\n  const cssWidth: string = width ? width + \"%\" : \"1px\";\r\n  const amt = abbrNumber(s.amount);\r\n  let displayValue = this.tempValueFormat === \"amount\" ? amt : \"\";\r\n  if (this.currentChartType === \"bar6\" && this.tempValueFormat === \"percentage\") {\r\n    displayValue = s.amount + \"%\";\r\n  } else if (this.currentChartType === \"bar7\" && this.tempValueFormat === \"percentage\") {\r\n    displayValue = amountToPercent(s.amount, this.total, true) + \"%\";\r\n  }\r\n\r\n  return (\r\n    <div\r\n      class={\"bar segment\"}\r\n      style={{\r\n        backgroundColor: s.color,\r\n        width: cssWidth,\r\n      }}\r\n      onClick={(ev) => handleSliceClick.call(this, ev, s)}\r\n      onFocus={(ev) => handleSliceFocus.call(this, ev, s)}\r\n      onKeyDown={(ev) => handleSliceKeyDown.call(this, ev)}\r\n    >\r\n      <div class=\"value\">{displayValue}</div>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport function renderLegend(this: any, chartType: ChartType) {\r\n  // legend is hidden for bar1 and bar6 types regardless of showLegend value\r\n  if (this.showLegend) {\r\n    const hasCluster =\r\n      !this.chartDetails.isBar &&\r\n      this.slicesDetails.reduce(\r\n        (hasCluster: boolean, cur: SliceDetails) => (hasCluster = cur.inSmallCluster ? true : hasCluster),\r\n        false\r\n      );\r\n    return (\r\n      <div class=\"legend-wrapper\">\r\n        <div class={`legend ${chartType} ${this.mode === \"bar\" ? \"--top\" : \"--bottom\"}`} aria-hidden=\"true\">\r\n          {this.total > 0\r\n            ? this.slicesDetails.map((s: SliceDetails) => {\r\n                // when both legend and amount are omitted, the legend is not shown for that particular option (it's been deactivated by the user)\r\n                if (!!s.amount || !!s.legend) {\r\n                  return renderLegendItem({ key: s.legend!, color: s.color });\r\n                }\r\n              })\r\n            : \"\"}\r\n        </div>\r\n        {hasCluster && renderHiddenValuesMessage()}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\nexport function renderLegendItem(legendItem: LegendItem) {\r\n  return (\r\n    <div class=\"legend-item\">\r\n      <div class=\"legend-color\" style={{ backgroundColor: legendItem.color }}></div>\r\n      <div class=\"legend-text\">{legendItem.key}</div>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport function renderCompletionMessage(this: any) {\r\n  if (this.completionMessage) {\r\n    return <div class=\"completion-message\">{this.completionMessage}</div>;\r\n  }\r\n}\r\n\r\nexport function renderHiddenValuesMessage() {\r\n  return (\r\n    <div class=\"hidden-values-warning\">\r\n      {textHiddenMessage}\r\n      <br />\r\n      {seeDetailsMessage}\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":"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"}

package/dist/ripple/p-0d7bccf7.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["TagInputRow","componentDidUpdate","this","wmTagInputRowUpdated","emit"],"sources":["./src/components/wm-tag-input/wm-tag-input-row/wm-tag-input-row.tsx"],"sourcesContent":["import { Component, Element, Event, EventEmitter, Prop } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-tag-input-row\",\n})\nexport class TagInputRow {\n  @Element() el!: HTMLWmTagInputRowElement;\n\n  @Prop({ attribute: \"col1\" }) col1?: string;\n  @Prop({ attribute: \"col2\" }) col2?: string;\n  @Prop({ attribute: \"col3\" }) col3?: string;\n  @Prop({ attribute: \"col4\" }) col4?: string;\n  @Prop() locked: boolean = false;\n\n  @Event() wmTagInputRowUpdated!: EventEmitter<void>;\n\n  componentDidUpdate() {\n    this.wmTagInputRowUpdated.emit();\n  }\n}\n"],"mappings":"wDAKaA,EAAW,M,gLAOI,K,CAI1BC,qBACEC,KAAKC,qBAAqBC,M"}
+{"version":3,"names":["TagInputRow","componentDidUpdate","this","wmTagInputRowUpdated","emit"],"sources":["./src/components/wm-tag-input/wm-tag-input-row/wm-tag-input-row.tsx"],"sourcesContent":["import { Component, Element, Event, EventEmitter, Prop } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"wm-tag-input-row\",\r\n})\r\nexport class TagInputRow {\r\n  @Element() el!: HTMLWmTagInputRowElement;\r\n\r\n  @Prop({ attribute: \"col1\" }) col1?: string;\r\n  @Prop({ attribute: \"col2\" }) col2?: string;\r\n  @Prop({ attribute: \"col3\" }) col3?: string;\r\n  @Prop({ attribute: \"col4\" }) col4?: string;\r\n  @Prop() locked: boolean = false;\r\n\r\n  @Event() wmTagInputRowUpdated!: EventEmitter<void>;\r\n\r\n  componentDidUpdate() {\r\n    this.wmTagInputRowUpdated.emit();\r\n  }\r\n}\r\n"],"mappings":"wDAKaA,EAAW,M,gLAOI,K,CAI1BC,qBACEC,KAAKC,qBAAqBC,M"}

package/dist/ripple/{p-98a9eb8c.entry.js → p-136460c0.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as s,h as e,H as i,g as r}from"./p-1c23de4a.js";import{i as o}from"./p-9fd3badc.js";const n=':host,wm-search{width:100%;font-size:0.875rem}:host *,wm-search *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .wm-search-wrapper,wm-search .wm-search-wrapper{border-radius:3px;position:relative;border:1px solid rgba(35, 35, 35, 0.6);display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center}:host .wm-search-wrapper .search-icon,wm-search .wm-search-wrapper .search-icon{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:1.0625rem;position:absolute;left:0.4375rem}:host .wm-search-wrapper input,wm-search .wm-search-wrapper input{border:none;height:40px;padding:0 1.75rem;background:transparent;overflow:visible;width:100%;-ms-flex:1;flex:1;font-family:inherit}:host .wm-search-wrapper input:focus,wm-search .wm-search-wrapper input:focus{outline:none}:host .wm-search-wrapper.focus,wm-search .wm-search-wrapper.focus{-webkit-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;border-color:#20cbd4;border-radius:3px}:host .find,wm-search .find{min-height:3rem}:host .find input,wm-search .find input{padding:16px 8px 16px 28px}:host .find .wm-find-elements,wm-search .find .wm-find-elements{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start;padding-right:16px}:host .find .wm-find-elements wm-button+wm-button,wm-search .find .wm-find-elements wm-button+wm-button{margin-left:0.25rem}:host .find .wm-find-elements .results,wm-search .find .wm-find-elements .results{margin-right:0.5rem;font-style:italic}:host .sr-only,wm-search .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .show-for-tabbers,wm-search .show-for-tabbers{all:unset;color:#575195;text-decoration:none;font-weight:500;font-size:0.875rem;margin:10px 0}:host .show-for-tabbers:hover,wm-search .show-for-tabbers:hover{background:-webkit-gradient(linear, left top, left bottom, from(#575195), to(#575195)) no-repeat;background:linear-gradient(#575195, #575195) no-repeat;background-size:100% 1px;background-position:0 1.2em;padding-bottom:0.2em}:host .show-for-tabbers:focus,wm-search .show-for-tabbers:focus{outline:none;background:-webkit-gradient(linear, left top, right top, color-stop(66%, #3862e9), color-stop(0, transparent)) repeat-x;background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1.2em;padding-bottom:0.2em}';const a=class{constructor(e){t(this,e);this.wmSearchBrowseResults=s(this,"wmSearchBrowseResults",7);this.wmBrowseSearchResults=s(this,"wmBrowseSearchResults",7);this.wmSearchValueChanged=s(this,"wmSearchValueChanged",7);this.wrapperEl=null;this.linkEl=null;this.searchType="basic";this.disabled=false;this.placeholder="";this.label="";this.numResults=0;this.value="";this.isTabbing=false;this.highlightedId="";this.highlightedName=null;this.highlightedNum=0;this.previousBlurredValue="";this.parentModal=undefined;this.announcement=""}get resultCount(){let t="";const s=o.formatMessage({id:"search.resultsFound",defaultMessage:"{numResults, plural, =0 {No results} one {1 result} other {# results}} found"},{numResults:this.numResults});const e=o.formatMessage({id:"search.xOfYResults",defaultMessage:"{numResults, plural, =0 {No results found} other {{current} of {numResults} results}}"},{numResults:this.numResults,current:this.highlightedNum});if(this.searchType==="basic"){t=s}else if(this.searchType==="find"){t=e}return t}toggleTabbingOn(){this.isTabbing=true;this.linkEl&&this.linkEl.classList.remove("sr-only");this.linkEl&&this.linkEl.classList.add("show-for-tabbers")}toggleTabbingOff(){this.isTabbing=false;this.linkEl&&this.linkEl.classList.add("sr-only");this.linkEl&&this.linkEl.classList.remove("show-for-tabbers")}componentWillLoad(){if(this.placeholder===""){console.error("You must set the placeholder property for the wm-search component.")}if(this.label===""){console.error("You must set the label property for the wm-search component.")}this.hookToModal()}hookToModal(){let t=this.el;while(!!t){if(t.tagName==="WM-MODAL"){this.parentModal=t}t=t.parentElement}if(this.parentModal){const t=["wmCloseTriggered","wmPrimaryTriggered","wmSecondaryTriggered"];t.map((t=>{this.parentModal.addEventListener(t,(()=>{this.updateValue("")}))}))}}async updateValue(t){this.value=t;this.resetHighlightCountToStart();if(this.value){this.announceChanges()}}resetHighlightCountToStart(){if(this.searchType==="find"){this.highlightedNum=this.numResults?1:0}}announce(t){if(this.resultsLiveRegion.textContent===t){t+=" "}this.announcement=t}announceChanges(){window.requestAnimationFrame((()=>{let t=this.resultCount;if(this.searchType==="find"&&this.highlightedName){t+=`, ${this.highlightedName}`}this.announce(t)}))}changeHighlightedNum(t){if(this.numResults){if(t<1){this.highlightedNum=this.numResults}else if(t>this.numResults){this.highlightedNum=1}else{this.highlightedNum=t}this.wmSearchBrowseResults.emit({position:this.highlightedNum});this.wmBrowseSearchResults.emit({position:this.highlightedNum});this.announceChanges()}}addFocusStyle(){if(this.wrapperEl){this.wrapperEl.classList.add("focus")}}removeFocusStyle(){if(this.wrapperEl){this.wrapperEl.classList.remove("focus")}}handleBlur(){this.removeFocusStyle();if(this.previousBlurredValue!==this.value){this.wmSearchValueChanged.emit({value:this.value})}this.previousBlurredValue=this.value}renderResultsAndBrowseButtons(){return e("div",{class:"wm-find-elements"},e("div",{id:"results-display",class:"results"},this.resultCount),e("div",{class:"wm-button-collection"},e("wm-button",{"button-type":"icononly",icon:"f05d",tooltip:o.formatMessage({id:"global.previous",description:"button text",defaultMessage:"previous"}),"tooltip-position":"bottom",onClick:()=>this.changeHighlightedNum(this.highlightedNum-1),disabled:this.disabled||this.numResults<2,"label-for-identical-buttons":o.formatMessage({id:"search.previousResult",defaultMessage:"Press to hear previous matching result"})}),e("wm-button",{"button-type":"icononly",icon:"f045",tooltip:o.formatMessage({id:"global.next",description:"button text",defaultMessage:"next"}),"tooltip-position":"bottom",onClick:()=>this.changeHighlightedNum(this.highlightedNum+1),disabled:this.disabled||this.numResults<2,"label-for-identical-buttons":o.formatMessage({id:"search.nextResult",defaultMessage:"Press to hear next matching result"})})))}renderJumpToLink(){if(this.numResults&&this.highlightedId){return e("a",{ref:t=>this.linkEl=t,href:`#${this.highlightedId}`,class:"sr-only"},o.formatMessage({id:"search.jumpToResult",defaultMessage:"Jump to search result in list"}))}else{return null}}render(){return e(i,null,e("div",{id:"wm-search-wrapper",class:`wm-search-wrapper ${this.searchType}`,ref:t=>this.wrapperEl=t},e("input",{disabled:this.disabled,id:"wm-search-input",placeholder:this.placeholder,"aria-label":`${this.label?this.label+". ":""}${o.formatMessage({id:"search.typeToFilterResults",defaultMessage:"Type to filter the results"})}`,onInput:t=>this.updateValue(t.target.value),onFocus:()=>this.addFocusStyle(),onBlur:()=>this.handleBlur(),"aria-autocomplete":"none",autocomplete:"off",value:this.value}),e("span",{class:"mdi search-icon"},String.fromCodePoint(parseInt(`0xf349`))),this.searchType==="find"&&this.renderResultsAndBrowseButtons(),e("div",{id:"wm-search-live",class:"sr-only","aria-live":"polite","aria-atomic":"true",ref:t=>this.resultsLiveRegion=t},this.announcement)),this.searchType==="find"&&this.renderJumpToLink())}static get delegatesFocus(){return true}get el(){return r(this)}static get watchers(){return{numResults:["resetHighlightCountToStart"]}}};a.style=n;export{a as wm_search};
-//# sourceMappingURL=p-98a9eb8c.entry.js.map
+import{r as t,c as e,h as s,H as i,g as r}from"./p-1c23de4a.js";import{i as o}from"./p-edfba0e1.js";const n=':host,wm-search{width:100%;font-size:0.875rem}:host *,wm-search *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .wm-search-wrapper,wm-search .wm-search-wrapper{border-radius:3px;position:relative;border:1px solid rgba(35, 35, 35, 0.6);display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center}:host .wm-search-wrapper .search-icon,wm-search .wm-search-wrapper .search-icon{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:1.0625rem;position:absolute;left:0.4375rem}:host .wm-search-wrapper input,wm-search .wm-search-wrapper input{border:none;height:40px;padding:0 1.75rem;background:transparent;overflow:visible;width:100%;-ms-flex:1;flex:1;font-family:inherit}:host .wm-search-wrapper input:focus,wm-search .wm-search-wrapper input:focus{outline:none}:host .wm-search-wrapper.focus,wm-search .wm-search-wrapper.focus{-webkit-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;border-color:#20cbd4;border-radius:3px}:host .find,wm-search .find{min-height:3rem}:host .find input,wm-search .find input{padding:16px 8px 16px 28px}:host .find .wm-find-elements,wm-search .find .wm-find-elements{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start;padding-right:16px}:host .find .wm-find-elements wm-button+wm-button,wm-search .find .wm-find-elements wm-button+wm-button{margin-left:0.25rem}:host .find .wm-find-elements .results,wm-search .find .wm-find-elements .results{margin-right:0.5rem;font-style:italic}:host .sr-only,wm-search .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .show-for-tabbers,wm-search .show-for-tabbers{all:unset;color:#575195;text-decoration:none;font-weight:500;font-size:0.875rem;margin:10px 0}:host .show-for-tabbers:hover,wm-search .show-for-tabbers:hover{background:-webkit-gradient(linear, left top, left bottom, from(#575195), to(#575195)) no-repeat;background:linear-gradient(#575195, #575195) no-repeat;background-size:100% 1px;background-position:0 1.2em;padding-bottom:0.2em}:host .show-for-tabbers:focus,wm-search .show-for-tabbers:focus{outline:none;background:-webkit-gradient(linear, left top, right top, color-stop(66%, #3862e9), color-stop(0, transparent)) repeat-x;background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1.2em;padding-bottom:0.2em}';const a=class{constructor(s){t(this,s);this.wmSearchBrowseResults=e(this,"wmSearchBrowseResults",7);this.wmBrowseSearchResults=e(this,"wmBrowseSearchResults",7);this.wmSearchValueChanged=e(this,"wmSearchValueChanged",7);this.wrapperEl=null;this.linkEl=null;this.searchType="basic";this.disabled=false;this.placeholder="";this.label="";this.numResults=0;this.value="";this.isTabbing=false;this.highlightedId="";this.highlightedName=null;this.highlightedNum=0;this.previousBlurredValue="";this.parentModal=undefined;this.announcement=""}get resultCount(){let t="";const e=o.formatMessage({id:"search.resultsFound",defaultMessage:"{numResults, plural, =0 {No results} one {1 result} other {# results}} found"},{numResults:this.numResults});const s=o.formatMessage({id:"search.xOfYResults",defaultMessage:"{numResults, plural, =0 {No results found} other {{current} of {numResults} results}}"},{numResults:this.numResults,current:this.highlightedNum});if(this.searchType==="basic"){t=e}else if(this.searchType==="find"){t=s}return t}toggleTabbingOn(){this.isTabbing=true;this.linkEl&&this.linkEl.classList.remove("sr-only");this.linkEl&&this.linkEl.classList.add("show-for-tabbers")}toggleTabbingOff(){this.isTabbing=false;this.linkEl&&this.linkEl.classList.add("sr-only");this.linkEl&&this.linkEl.classList.remove("show-for-tabbers")}componentWillLoad(){if(this.placeholder===""){console.error("You must set the placeholder property for the wm-search component.")}if(this.label===""){console.error("You must set the label property for the wm-search component.")}this.hookToModal()}hookToModal(){let t=this.el;while(!!t){if(t.tagName==="WM-MODAL"){this.parentModal=t}t=t.parentElement}if(this.parentModal){const t=["wmCloseTriggered","wmPrimaryTriggered","wmSecondaryTriggered"];t.map((t=>{this.parentModal.addEventListener(t,(()=>{this.updateValue("")}))}))}}async updateValue(t){this.value=t;this.resetHighlightCountToStart();if(this.value){this.announceChanges()}}resetHighlightCountToStart(){if(this.searchType==="find"){this.highlightedNum=this.numResults?1:0}}announce(t){if(this.resultsLiveRegion.textContent===t){t+=" "}this.announcement=t}announceChanges(){window.requestAnimationFrame((()=>{let t=this.resultCount;if(this.searchType==="find"&&this.highlightedName){t+=`, ${this.highlightedName}`}this.announce(t)}))}changeHighlightedNum(t){if(this.numResults){if(t<1){this.highlightedNum=this.numResults}else if(t>this.numResults){this.highlightedNum=1}else{this.highlightedNum=t}this.wmSearchBrowseResults.emit({position:this.highlightedNum});this.wmBrowseSearchResults.emit({position:this.highlightedNum});this.announceChanges()}}addFocusStyle(){if(this.wrapperEl){this.wrapperEl.classList.add("focus")}}removeFocusStyle(){if(this.wrapperEl){this.wrapperEl.classList.remove("focus")}}handleBlur(){this.removeFocusStyle();if(this.previousBlurredValue!==this.value){this.wmSearchValueChanged.emit({value:this.value})}this.previousBlurredValue=this.value}renderResultsAndBrowseButtons(){return s("div",{class:"wm-find-elements"},s("div",{id:"results-display",class:"results"},this.resultCount),s("div",{class:"wm-button-collection"},s("wm-button",{"button-type":"icononly",icon:"f05d",tooltip:o.formatMessage({id:"global.previous",description:"button text",defaultMessage:"previous"}),"tooltip-position":"bottom",onClick:()=>this.changeHighlightedNum(this.highlightedNum-1),disabled:this.disabled||this.numResults<2,"label-for-identical-buttons":o.formatMessage({id:"search.previousResult",defaultMessage:"Press to hear previous matching result"})}),s("wm-button",{"button-type":"icononly",icon:"f045",tooltip:o.formatMessage({id:"global.next",description:"button text",defaultMessage:"next"}),"tooltip-position":"bottom",onClick:()=>this.changeHighlightedNum(this.highlightedNum+1),disabled:this.disabled||this.numResults<2,"label-for-identical-buttons":o.formatMessage({id:"search.nextResult",defaultMessage:"Press to hear next matching result"})})))}renderJumpToLink(){if(this.numResults&&this.highlightedId){return s("a",{ref:t=>this.linkEl=t,href:`#${this.highlightedId}`,class:"sr-only"},o.formatMessage({id:"search.jumpToResult",defaultMessage:"Jump to search result in list"}))}else{return null}}render(){return s(i,null,s("div",{id:"wm-search-wrapper",class:`wm-search-wrapper ${this.searchType}`,ref:t=>this.wrapperEl=t},s("input",{disabled:this.disabled,id:"wm-search-input",placeholder:this.placeholder,"aria-label":`${this.label?this.label+". ":""}${o.formatMessage({id:"search.typeToFilterResults",defaultMessage:"Type to filter the results"})}`,onInput:t=>this.updateValue(t.target.value),onFocus:()=>this.addFocusStyle(),onBlur:()=>this.handleBlur(),"aria-autocomplete":"none",autocomplete:"off",value:this.value}),s("span",{class:"mdi search-icon"},String.fromCodePoint(parseInt(`0xf349`))),this.searchType==="find"&&this.renderResultsAndBrowseButtons(),s("div",{id:"wm-search-live",class:"sr-only","aria-live":"polite","aria-atomic":"true",ref:t=>this.resultsLiveRegion=t},this.announcement)),this.searchType==="find"&&this.renderJumpToLink())}static get delegatesFocus(){return true}get el(){return r(this)}static get watchers(){return{numResults:["resetHighlightCountToStart"]}}};a.style=n;export{a as wm_search};
+//# sourceMappingURL=p-136460c0.entry.js.map

package/dist/ripple/p-136460c0.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["wmSearchCss","Search","this","wrapperEl","linkEl","resultCount","message","basicMessage","intl","formatMessage","id","defaultMessage","numResults","findMessage","current","highlightedNum","searchType","toggleTabbingOn","isTabbing","classList","remove","add","toggleTabbingOff","componentWillLoad","placeholder","console","error","label","hookToModal","el","tagName","parentModal","parentElement","events","map","event","addEventListener","updateValue","async","value","resetHighlightCountToStart","announceChanges","announce","resultsLiveRegion","textContent","announcement","window","requestAnimationFrame","messageToAnnounce","highlightedName","changeHighlightedNum","newNum","wmSearchBrowseResults","emit","position","wmBrowseSearchResults","addFocusStyle","removeFocusStyle","handleBlur","previousBlurredValue","wmSearchValueChanged","renderResultsAndBrowseButtons","h","class","icon","tooltip","description","onClick","disabled","renderJumpToLink","highlightedId","ref","href","render","Host","onInput","ev","target","onFocus","onBlur","autocomplete","String","fromCodePoint","parseInt"],"sources":["./src/components/wm-search/wm-search.scss?tag=wm-search&encapsulation=shadow","./src/components/wm-search/wm-search.tsx"],"sourcesContent":[":host,\r\nwm-search {\r\n  * {\r\n    box-sizing: border-box;\r\n  }\r\n  width: 100%;\r\n  font-size: rem-calc(14);\r\n\r\n  .wm-search-wrapper {\r\n    border-radius: 3px;\r\n    position: relative;\r\n    border: 1px solid rgba(35, 35, 35, 0.6);\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n\r\n    .search-icon {\r\n      @include mdi-icon;\r\n      font-size: rem-calc(17);\r\n      position: absolute;\r\n      left: rem-calc(7);\r\n    }\r\n\r\n    input {\r\n      border: none;\r\n      height: 40px;\r\n      padding: rem-calc(0 28);\r\n      background: transparent;\r\n      overflow: visible;\r\n      width: 100%;\r\n      flex: 1;\r\n      font-family: inherit;\r\n\r\n      &:focus {\r\n        outline: none;\r\n      }\r\n    }\r\n\r\n    &.focus {\r\n      box-shadow: 0 0 0 1px #20cbd4;\r\n      border-color: $border-focus-color;\r\n      border-radius: 3px;\r\n    }\r\n  }\r\n\r\n  .find {\r\n    min-height: 3rem;\r\n\r\n    input {\r\n      padding: 16px 8px 16px 28px;\r\n    }\r\n\r\n    .wm-find-elements {\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: flex-start;\r\n      padding-right: 16px;\r\n      wm-button + wm-button {\r\n        margin-left: rem-calc(4);\r\n      }\r\n\r\n      .results {\r\n        margin-right: rem-calc(8);\r\n        font-style: italic;\r\n      }\r\n    }\r\n  }\r\n\r\n  .sr-only {\r\n    @include srOnly;\r\n  }\r\n\r\n  .show-for-tabbers {\r\n    all: unset;\r\n    color: #575195;\r\n    text-decoration: none;\r\n    font-weight: 500;\r\n    font-size: rem-calc(14);\r\n    margin: 10px 0;\r\n\r\n    &:hover {\r\n      background: linear-gradient(#575195, #575195) no-repeat;\r\n      background-size: 100% 1px;\r\n      background-position: 0 1.2em;\r\n      padding-bottom: 0.2em;\r\n    }\r\n\r\n    &:focus {\r\n      outline: none;\r\n      background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;\r\n      background-size: 6px 3px;\r\n      background-position: 0 1.2em;\r\n      padding-bottom: 0.2em;\r\n    }\r\n  }\r\n}\r\n","import { h, Component, Element, Prop, Watch, Host, Method, Listen, State, Event, EventEmitter } from \"@stencil/core\";\r\nimport { intl } from \"../../global/functions\";\r\n\r\n@Component({\r\n  tag: \"wm-search\",\r\n  styleUrl: \"wm-search.scss\",\r\n  shadow: { delegatesFocus: true },\r\n})\r\nexport class Search {\r\n  @Element() el!: HTMLWmSearchElement;\r\n  @Prop({ mutable: true }) searchType: \"basic\" | \"find\" = \"basic\";\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n\r\n  /**\r\n   * Props required for both variants.\r\n   */\r\n  @Prop() placeholder: string = \"\";\r\n  @Prop() label: string = \"\";\r\n  @Prop({ mutable: true }) numResults: number = 0;\r\n\r\n  /**\r\n   * This exposes the input's value on the host component so that the app can access it.\r\n   */\r\n  @Prop({ mutable: true, reflect: true }) value: string = \"\";\r\n\r\n  /**\r\n   * If the user is tabbing, the search and find variant will display a link to jump to a search result.\r\n   */\r\n  @State() isTabbing: boolean = false;\r\n\r\n  /**\r\n   * Prop specifically for the search and find variant. The id points to the id of the option currently highlighted,\r\n   * so that tabbing and screen reader users can jump to this option rather than tab through the list to find it.\r\n   */\r\n  @Prop() highlightedId: string = \"\";\r\n  @Prop() highlightedName: string | null = null;\r\n\r\n  /**\r\n   * Indicates which of the search results is currently highlighted. It will be displayed as \"[highlightedNum] of [numResults]\" next to the input in the search and find variant.\r\n   * This number updates as the user browses using the buttons.\r\n   */\r\n  @State() highlightedNum: number = 0;\r\n\r\n  @State() previousBlurredValue: string = \"\";\r\n  @State() parentModal?: HTMLWmModalElement;\r\n\r\n  /**\r\n   * Live region announcement\r\n   */\r\n  @State() announcement: string = \"\";\r\n\r\n  get resultCount(): string {\r\n    let message = \"\";\r\n    const basicMessage = intl.formatMessage(\r\n      {\r\n        id: \"search.resultsFound\",\r\n        defaultMessage: \"{numResults, plural, =0 {No results} one {1 result} other {# results}} found\",\r\n      },\r\n      { numResults: this.numResults }\r\n    );\r\n    const findMessage = intl.formatMessage(\r\n      {\r\n        id: \"search.xOfYResults\",\r\n        defaultMessage: \"{numResults, plural, =0 {No results found} other {{current} of {numResults} results}}\",\r\n      },\r\n      { numResults: this.numResults, current: this.highlightedNum }\r\n    );\r\n\r\n    if (this.searchType === \"basic\") {\r\n      message = basicMessage;\r\n    } else if (this.searchType === \"find\") {\r\n      message = findMessage;\r\n    }\r\n\r\n    return message;\r\n  }\r\n\r\n  /**\r\n   * Emitted when the buttons in the search-and-find variant are pressed.\r\n   */\r\n  @Event() wmSearchBrowseResults!: EventEmitter<{ position: number }>;\r\n  @Event() wmBrowseSearchResults!: EventEmitter<{ position: number }>; // deprecated in favor of wmSearchBrowseResults\r\n  @Event() wmSearchValueChanged!: EventEmitter<{ value: string }>;\r\n\r\n  /**\r\n   * Element refs\r\n   */\r\n  private resultsLiveRegion!: HTMLElement;\r\n  private wrapperEl: HTMLElement | null = null;\r\n  private linkEl: HTMLElement | null = null;\r\n\r\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\r\n  toggleTabbingOn() {\r\n    this.isTabbing = true;\r\n    this.linkEl && this.linkEl.classList.remove(\"sr-only\");\r\n    this.linkEl && this.linkEl.classList.add(\"show-for-tabbers\");\r\n  }\r\n\r\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\r\n  toggleTabbingOff() {\r\n    this.isTabbing = false;\r\n    this.linkEl && this.linkEl.classList.add(\"sr-only\");\r\n    this.linkEl && this.linkEl.classList.remove(\"show-for-tabbers\");\r\n  }\r\n\r\n  componentWillLoad() {\r\n    if (this.placeholder === \"\") {\r\n      console.error(\"You must set the placeholder property for the wm-search component.\");\r\n    }\r\n\r\n    if (this.label === \"\") {\r\n      console.error(\"You must set the label property for the wm-search component.\");\r\n    }\r\n    this.hookToModal();\r\n  }\r\n\r\n  hookToModal() {\r\n    // if the search is in a modal we want to clear the input when the modal closes\r\n    let el = this.el as any;\r\n    while (!!el) {\r\n      if (el.tagName === \"WM-MODAL\") {\r\n        this.parentModal = el as HTMLWmModalElement;\r\n      }\r\n      el = el.parentElement as HTMLElement;\r\n    }\r\n\r\n    if (this.parentModal) {\r\n      const events = [\"wmCloseTriggered\", \"wmPrimaryTriggered\", \"wmSecondaryTriggered\"];\r\n      events.map((event) => {\r\n        this.parentModal!.addEventListener(event, () => {\r\n          this.updateValue(\"\");\r\n        });\r\n      });\r\n    }\r\n  }\r\n\r\n  // this undocumented method is needed in hookToModal (needs to be exposed so we can set the callback func)\r\n  @Method()\r\n  async updateValue(value: string) {\r\n    this.value = value;\r\n\r\n    //For search-and-find, the results should always restart at \"[1 or 0] of ...\" after any new input.\r\n    //Reset the highlight count here just in case the new value doesn't end up changing the number of results.\r\n    this.resetHighlightCountToStart();\r\n\r\n    if (this.value) {\r\n      this.announceChanges();\r\n    }\r\n  }\r\n\r\n  @Watch(\"numResults\")\r\n  resetHighlightCountToStart(): void {\r\n    if (this.searchType === \"find\") {\r\n      this.highlightedNum = this.numResults ? 1 : 0;\r\n    }\r\n  }\r\n\r\n  announce(message: string) {\r\n    if (this.resultsLiveRegion!.textContent === message) {\r\n      message += \"\\u00A0\";\r\n    }\r\n    this.announcement = message;\r\n  }\r\n\r\n  announceChanges() {\r\n    window.requestAnimationFrame(() => {\r\n      // requestAnimationFrame to allow all changes to occur before announcing results\r\n      let messageToAnnounce = this.resultCount;\r\n\r\n      // if a result is found, also include it after the liveregion message\r\n      if (this.searchType === \"find\" && this.highlightedName) {\r\n        messageToAnnounce += `, ${this.highlightedName}`;\r\n      }\r\n\r\n      this.announce(messageToAnnounce);\r\n    });\r\n  }\r\n\r\n  changeHighlightedNum(newNum: number): void {\r\n    if (this.numResults) {\r\n      if (newNum < 1) {\r\n        // we were on the first item, going down: go to last item\r\n        this.highlightedNum = this.numResults;\r\n      } else if (newNum > this.numResults) {\r\n        // we were on the last item, going up: go to first item\r\n        this.highlightedNum = 1;\r\n      } else {\r\n        this.highlightedNum = newNum;\r\n      }\r\n\r\n      this.wmSearchBrowseResults.emit({ position: this.highlightedNum });\r\n      this.wmBrowseSearchResults.emit({ position: this.highlightedNum });\r\n      this.announceChanges();\r\n    }\r\n  }\r\n\r\n  addFocusStyle() {\r\n    if (this.wrapperEl) {\r\n      this.wrapperEl.classList.add(\"focus\");\r\n    }\r\n  }\r\n\r\n  removeFocusStyle() {\r\n    if (this.wrapperEl) {\r\n      this.wrapperEl.classList.remove(\"focus\");\r\n    }\r\n  }\r\n\r\n  handleBlur() {\r\n    this.removeFocusStyle();\r\n    if (this.previousBlurredValue !== this.value) {\r\n      this.wmSearchValueChanged.emit({ value: this.value });\r\n    }\r\n    this.previousBlurredValue = this.value;\r\n  }\r\n\r\n  /**\r\n   * Functions that return elements specifically for search-and-find.\r\n   */\r\n  renderResultsAndBrowseButtons(): HTMLDivElement {\r\n    return (\r\n      <div class=\"wm-find-elements\">\r\n        <div id=\"results-display\" class=\"results\">\r\n          {this.resultCount}\r\n        </div>\r\n        <div class=\"wm-button-collection\">\r\n          <wm-button\r\n            button-type=\"icononly\"\r\n            icon=\"f05d\"\r\n            tooltip={intl.formatMessage({\r\n              id: \"global.previous\",\r\n              description: \"button text\",\r\n              defaultMessage: \"previous\",\r\n            })}\r\n            tooltip-position=\"bottom\"\r\n            onClick={() => this.changeHighlightedNum(this.highlightedNum - 1)}\r\n            disabled={this.disabled || this.numResults < 2}\r\n            label-for-identical-buttons={intl.formatMessage({\r\n              id: \"search.previousResult\",\r\n              defaultMessage: \"Press to hear previous matching result\",\r\n            })}\r\n          />\r\n          <wm-button\r\n            button-type=\"icononly\"\r\n            icon=\"f045\"\r\n            tooltip={intl.formatMessage({\r\n              id: \"global.next\",\r\n              description: \"button text\",\r\n              defaultMessage: \"next\",\r\n            })}\r\n            tooltip-position=\"bottom\"\r\n            onClick={() => this.changeHighlightedNum(this.highlightedNum + 1)}\r\n            disabled={this.disabled || this.numResults < 2}\r\n            label-for-identical-buttons={intl.formatMessage({\r\n              id: \"search.nextResult\",\r\n              defaultMessage: \"Press to hear next matching result\",\r\n            })}\r\n          />\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  renderJumpToLink(): HTMLAnchorElement | null {\r\n    if (this.numResults && this.highlightedId) {\r\n      return (\r\n        <a ref={(el) => (this.linkEl = el as HTMLAnchorElement)} href={`#${this.highlightedId}`} class=\"sr-only\">\r\n          {intl.formatMessage({\r\n            id: \"search.jumpToResult\",\r\n            defaultMessage: \"Jump to search result in list\",\r\n          })}\r\n        </a>\r\n      );\r\n    } else {\r\n      return null;\r\n    }\r\n  }\r\n  /**\r\n   * End search and find render helpers\r\n   */\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <div\r\n          id=\"wm-search-wrapper\"\r\n          class={`wm-search-wrapper ${this.searchType}`}\r\n          ref={(el) => (this.wrapperEl = el as HTMLDivElement)}\r\n        >\r\n          <input\r\n            disabled={this.disabled}\r\n            id=\"wm-search-input\"\r\n            placeholder={this.placeholder}\r\n            aria-label={`${this.label ? this.label + \". \" : \"\"}${intl.formatMessage({\r\n              id: \"search.typeToFilterResults\",\r\n              defaultMessage: \"Type to filter the results\",\r\n            })}`}\r\n            onInput={(ev: Event) => this.updateValue((ev.target as HTMLInputElement).value)}\r\n            onFocus={() => this.addFocusStyle()}\r\n            onBlur={() => this.handleBlur()}\r\n            aria-autocomplete=\"none\"\r\n            autocomplete=\"off\"\r\n            value={this.value}\r\n          />\r\n          <span class=\"mdi search-icon\">{String.fromCodePoint(parseInt(`0xf349`))}</span>\r\n          {this.searchType === \"find\" && this.renderResultsAndBrowseButtons()}\r\n          <div\r\n            id=\"wm-search-live\"\r\n            class=\"sr-only\"\r\n            aria-live=\"polite\"\r\n            aria-atomic=\"true\"\r\n            ref={(el) => (this.resultsLiveRegion = el as HTMLElement)}\r\n          >\r\n            {this.announcement}\r\n          </div>\r\n        </div>\r\n        {this.searchType === \"find\" && this.renderJumpToLink()}\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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"}

package/dist/ripple/{p-695286e7.entry.js → p-1da75922.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as t,h as i,H as r,g as a}from"./p-1c23de4a.js";import{i as s,e as l,h as o,g as p}from"./p-9fd3badc.js";const n=':host,wm-datepicker{font-family:inherit}:host *,wm-datepicker *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .wrapper,wm-datepicker .wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}:host .wrapper .label,wm-datepicker .wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}:host .wrapper .label .required,wm-datepicker .wrapper .label .required{color:#c0392b}:host .wrapper.label-left,wm-datepicker .wrapper.label-left{-ms-flex-direction:row;flex-direction:row}:host .wrapper.label-left .label-wrapper,wm-datepicker .wrapper.label-left .label-wrapper{line-height:2.5rem}:host .wrapper.label-left .label-wrapper .label,wm-datepicker .wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}:host .wrapper.label-none label,wm-datepicker .wrapper.label-none label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .wrapper.invalid .label,wm-datepicker .wrapper.invalid .label{color:#c0392b}:host .wrapper.invalid .label:after,wm-datepicker .wrapper.invalid .label:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f026";margin-left:0.3125rem}[dir=RTL] :host .wrapper.invalid .label:after,[dir=RTL] wm-datepicker .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}:host .wrapper.rtl.label-left .label,wm-datepicker .wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}:host .wrapper,wm-datepicker .wrapper{position:relative}:host .wrapper .required,wm-datepicker .wrapper .required{color:#c4431c}:host .wrapper .inner-wrapper,wm-datepicker .wrapper .inner-wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.5rem;border:1px solid;border-color:rgba(35, 35, 35, 0.6);-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;max-width:236px;-ms-flex-pack:justify;justify-content:space-between;position:relative}:host .wrapper .inner-wrapper .date-input,wm-datepicker .wrapper .inner-wrapper .date-input{-moz-border-top-left-radius:3px;-webkit-border-top-left-radius:3px;border-top-left-radius:3px;-moz-border-bottom-left-radius:3px;-webkit-border-bottom-left-radius:3px;border-bottom-left-radius:3px;border:none;font-size:0.875rem;padding:0.625rem 0.9375rem 0.5rem;min-width:0;height:100%;-ms-flex:1;flex:1;margin:0}:host .wrapper .inner-wrapper .date-input:disabled,wm-datepicker .wrapper .inner-wrapper .date-input:disabled{background-color:#f0f0f0;color:#737373}:host .wrapper .inner-wrapper .date-input:focus,wm-datepicker .wrapper .inner-wrapper .date-input:focus{outline:none}:host .wrapper.invalid .inner-wrapper,wm-datepicker .wrapper.invalid .inner-wrapper{-webkit-box-shadow:0 0 0 1px #c0392b;-moz-box-shadow:0 0 0 1px #c0392b;box-shadow:0 0 0 1px #c0392b;border-color:#c0392b}:host .wrapper.invalid .error,wm-datepicker .wrapper.invalid .error{margin-top:4px;margin-bottom:4px;display:block;top:100%;left:0;font-style:italic;font-size:0.875rem;color:#c0392b}:host .wrapper.focus .inner-wrapper,wm-datepicker .wrapper.focus .inner-wrapper{-webkit-box-shadow:0 0 0 1px #20cbd4;-moz-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;outline:none;border-color:#20cbd4}:host .user-is-tabbing .toggle:focus:not(:active),wm-datepicker .user-is-tabbing .toggle:focus:not(:active){border:none;z-index:11}';const d=class{constructor(i){e(this,i);this.wmDatepickerNewValidValue=t(this,"wmDatepickerNewValidValue",7);this.lastCommittedValue=this.value;this.parsableEntry=/^(\d{1}|\d{2}|\d{4})[\-\.\/]\d{1,2}[\-\.\/](\d{1}|\d{2}|\d{4})$/;this.isoEntry=/^\d\d\d\d[-]\d\d[-]\d\d$/;this.eightDigitsEntry=/^\d{8}$/;this.dateFormats={US:s.formatMessage({id:"date.formatUS",defaultMessage:"mm/dd/yyyy"}),INT:s.formatMessage({id:"date.formatINT",defaultMessage:"dd/mm/yyyy"}),ISO:s.formatMessage({id:"date.formatISO",defaultMessage:"yyyy/mm/dd"})};this.value="";this.disabled=false;this.dateFormat="US";this.errorMessage="";this.labelPosition="top";this.label="";this.requiredField=false;this.requiredFieldMessage=undefined;this.preventValidation=undefined;this.displayError=""}handleTabbingOn(){this.dpWrapper&&this.dpWrapper.classList.add("user-is-tabbing")}handleTabbingOff(){this.dpWrapper&&this.dpWrapper.classList.remove("user-is-tabbing")}handleError(){if(this.errorMessage){this.generateError()}else{this.clearError();this.processInput()}}handleInput(e){this.value=e.target.value}handleBlur(e){const t=this.preventValidation&&l(e,this.preventValidation);if(!t){this.processInput()}this.dpWrapper.classList.remove("focus")}focusHandler(){this.dpWrapper.classList.add("focus")}handlePopupBlurred(e){if(e.detail.relatedTarget!==this.el){const t=new CustomEvent("blur");t.relatedTarget=e.detail.relatedTarget;this.el.dispatchEvent(t)}}getActiveElement(){return o(document.activeElement)}handleCellTriggered(e){let t=e.detail;let i=t.getAttribute("data-year")+"-"+t.getAttribute("data-month")+"-"+t.textContent;this.inputEl.value=this.reformatDate(this.dateFormat,i);this.processInput();const r=new CustomEvent("input");this.el.dispatchEvent(r)}processInput(e){const t=!e&&this.requiredField;let i=this.inputEl.value;if(this.eightDigitsEntry.test(this.inputEl.value)){this.inputEl.value=this.addSlashes(this.inputEl.value)}if(this.parsableEntry.test(this.inputEl.value)){i=this.reformatDate("ISO",this.inputEl.value);this.inputEl.value=this.reformatDate(this.dateFormat,i);if(this.isValidDate(i)){if(this.errorMessage){this.generateError()}else{this.clearError()}}else if(this.inputEl.value.length){this.generateError()}}else if(this.inputEl.value.length||t||this.errorMessage){this.generateError()}else if(!this.inputEl.value.length&&!t){this.clearError()}if(i!==this.lastCommittedValue){this.value=i;const e=new CustomEvent("change");this.el.dispatchEvent(e);this.lastCommittedValue=this.value}if(this.isValidDate(i)&&i!==this.lastValidValue){this.wmDatepickerNewValidValue.emit();this.lastValidValue=i}}reformatDate(e,t){if(!t){return""}else if(!this.parsableEntry.test(t)){return t}else{let i=t.replace(/[\-\.]/gi,"/").split("/");switch(e){case"US":case this.dateFormats["US"]:return i[1].padStart(2,"0")+"/"+i[2].padStart(2,"0")+"/"+i[0].padStart(4,"20");case"INT":case this.dateFormats["INT"]:return i[2].padStart(2,"0")+"/"+i[1].padStart(2,"0")+"/"+i[0].padStart(4,"20");case"ISO":case this.dateFormats["ISO"]:if(this.dateFormat==="US"||this.dateFormat===this.dateFormats["US"]){return i[2].padStart(4,"20")+"-"+i[0].padStart(2,"0")+"-"+i[1].padStart(2,"0")}else if(this.dateFormat==="INT"||this.dateFormat===this.dateFormats["INT"]){return i[2].padStart(4,"20")+"-"+i[1].padStart(2,"0")+"-"+i[0].padStart(2,"0")}else if(this.dateFormat==="ISO"||this.dateFormat===this.dateFormats["ISO"]){return i[0].padStart(4,"20")+"-"+i[1].padStart(2,"0")+"-"+i[2].padStart(2,"0")}default:return i.join("/")}}}isValidDate(e){if(!e||!this.isoEntry.test(e)){return false}else{let t=e.split("-");let i=parseInt(t[2],10);let r=parseInt(t[1],10);let a=parseInt(t[0],10);if(a<1e3||a>3e3||r==0||r>12)return false;let s=[31,28,31,30,31,30,31,31,30,31,30,31];if(a%400==0||a%100!=0&&a%4==0)s[1]=29;return i>0&&i<=s[r-1]}}generateError(){const e=this.requiredFieldMessage||s.formatMessage({id:"date.requiredDateError",defaultMessage:"A date is required."});const t=s.formatMessage({id:"date.invalidDate",defaultMessage:"Please enter a valid date in the format {dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}."},{dateFormat:this.dateFormat.toLowerCase()});if(this.errorMessage){this.displayError=this.errorMessage}else if(this.inputEl.value.length){this.displayError=t}else if(!this.inputEl.value.length&&this.requiredField){this.displayError=e}}clearError(){this.displayError=""}addSlashes(e){if(this.dateFormat==="ISO"||this.dateFormat===this.dateFormats["ISO"]){return e.substring(0,4)+"/"+e.substring(4,6)+"/"+e.substring(6)}else{return e.substring(0,2)+"/"+e.substring(2,4)+"/"+e.substring(4)}}componentWillLoad(){if(this.label===""){console.error("You must include a label prop for the datepicker input (for accessibility reasons), even if the label position is none.")}if(this.errorMessage){this.generateError()}this.uid=this.el.id?this.el.id:p();if(this.value&&this.isValidDate(this.value)){this.lastValidValue=this.value}}componentDidLoad(){this.inputEl.value=this.reformatDate(this.dateFormat,this.value);this.processInput(true)}render(){const e=s.formatMessage({id:"date.format",defaultMessage:"{dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}"},{dateFormat:this.dateFormat.toLowerCase()});return i(r,{id:this.uid,"aria-busy":"false",class:`${this.displayError?"invalid":""}`,invalid:this.displayError?"true":null},i("div",{ref:e=>this.dpWrapper=e,class:`wrapper label-${this.labelPosition} ${this.displayError?"invalid":""}`},i("div",{class:"label-wrapper"},this.labelPosition!=="none"&&i("label",{id:`datepickerLabel-${this.uid}`,htmlFor:`date-input-${this.uid}`,class:"label",title:`${this.label} (${e})`},this.label,this.requiredField&&i("span",{"aria-hidden":"true",class:"required"},"*"))),i("div",null,i("div",{class:"inner-wrapper"},i("input",{disabled:this.disabled,type:"text",id:`date-input-${this.uid}`,class:"date-input",name:"date",placeholder:e,onFocus:this.focusHandler.bind(this),onInput:e=>this.handleInput(e),onBlur:e=>this.handleBlur(e),ref:e=>this.inputEl=e,"aria-describedby":`error-${this.uid}`,"aria-controls":`popup-${this.uid}`,"aria-label":this.label,"aria-required":this.requiredField?"true":null}),i("priv-datepicker",{disabled:this.disabled,date:this.lastValidValue?new Date(this.lastValidValue):new Date,parentId:this.uid})),i("div",{id:`error-${this.uid}`,class:"error","aria-live":"assertive","aria-atomic":"true"},this.displayError))))}static get delegatesFocus(){return true}get el(){return a(this)}static get watchers(){return{errorMessage:["handleError"]}}};d.style=n;export{d as wm_datepicker};
-//# sourceMappingURL=p-695286e7.entry.js.map
+import{r as e,c as t,h as i,H as r,g as a}from"./p-1c23de4a.js";import{i as s,e as l,h as o,g as p}from"./p-edfba0e1.js";const n=':host,wm-datepicker{font-family:inherit}:host *,wm-datepicker *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .wrapper,wm-datepicker .wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}:host .wrapper .label,wm-datepicker .wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}:host .wrapper .label .required,wm-datepicker .wrapper .label .required{color:#c0392b}:host .wrapper.label-left,wm-datepicker .wrapper.label-left{-ms-flex-direction:row;flex-direction:row}:host .wrapper.label-left .label-wrapper,wm-datepicker .wrapper.label-left .label-wrapper{line-height:2.5rem}:host .wrapper.label-left .label-wrapper .label,wm-datepicker .wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}:host .wrapper.label-none label,wm-datepicker .wrapper.label-none label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .wrapper.invalid .label,wm-datepicker .wrapper.invalid .label{color:#c0392b}:host .wrapper.invalid .label:after,wm-datepicker .wrapper.invalid .label:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f026";margin-left:0.3125rem}[dir=RTL] :host .wrapper.invalid .label:after,[dir=RTL] wm-datepicker .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}:host .wrapper.rtl.label-left .label,wm-datepicker .wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}:host .wrapper,wm-datepicker .wrapper{position:relative}:host .wrapper .required,wm-datepicker .wrapper .required{color:#c4431c}:host .wrapper .inner-wrapper,wm-datepicker .wrapper .inner-wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.5rem;border:1px solid;border-color:rgba(35, 35, 35, 0.6);-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;max-width:236px;-ms-flex-pack:justify;justify-content:space-between;position:relative}:host .wrapper .inner-wrapper .date-input,wm-datepicker .wrapper .inner-wrapper .date-input{-moz-border-top-left-radius:3px;-webkit-border-top-left-radius:3px;border-top-left-radius:3px;-moz-border-bottom-left-radius:3px;-webkit-border-bottom-left-radius:3px;border-bottom-left-radius:3px;border:none;font-size:0.875rem;padding:0.625rem 0.9375rem 0.5rem;min-width:0;height:100%;-ms-flex:1;flex:1;margin:0}:host .wrapper .inner-wrapper .date-input:disabled,wm-datepicker .wrapper .inner-wrapper .date-input:disabled{background-color:#f0f0f0;color:#737373}:host .wrapper .inner-wrapper .date-input:focus,wm-datepicker .wrapper .inner-wrapper .date-input:focus{outline:none}:host .wrapper.invalid .inner-wrapper,wm-datepicker .wrapper.invalid .inner-wrapper{-webkit-box-shadow:0 0 0 1px #c0392b;-moz-box-shadow:0 0 0 1px #c0392b;box-shadow:0 0 0 1px #c0392b;border-color:#c0392b}:host .wrapper.invalid .error,wm-datepicker .wrapper.invalid .error{margin-top:4px;margin-bottom:4px;display:block;top:100%;left:0;font-style:italic;font-size:0.875rem;color:#c0392b}:host .wrapper.focus .inner-wrapper,wm-datepicker .wrapper.focus .inner-wrapper{-webkit-box-shadow:0 0 0 1px #20cbd4;-moz-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;outline:none;border-color:#20cbd4}:host .user-is-tabbing .toggle:focus:not(:active),wm-datepicker .user-is-tabbing .toggle:focus:not(:active){border:none;z-index:11}';const d=class{constructor(i){e(this,i);this.wmDatepickerNewValidValue=t(this,"wmDatepickerNewValidValue",7);this.lastCommittedValue=this.value;this.parsableEntry=/^(\d{1}|\d{2}|\d{4})[\-\.\/]\d{1,2}[\-\.\/](\d{1}|\d{2}|\d{4})$/;this.isoEntry=/^\d\d\d\d[-]\d\d[-]\d\d$/;this.eightDigitsEntry=/^\d{8}$/;this.dateFormats={US:s.formatMessage({id:"date.formatUS",defaultMessage:"mm/dd/yyyy"}),INT:s.formatMessage({id:"date.formatINT",defaultMessage:"dd/mm/yyyy"}),ISO:s.formatMessage({id:"date.formatISO",defaultMessage:"yyyy/mm/dd"})};this.value="";this.disabled=false;this.dateFormat="US";this.errorMessage="";this.labelPosition="top";this.label="";this.requiredField=false;this.requiredFieldMessage=undefined;this.preventValidation=undefined;this.displayError=""}handleTabbingOn(){this.dpWrapper&&this.dpWrapper.classList.add("user-is-tabbing")}handleTabbingOff(){this.dpWrapper&&this.dpWrapper.classList.remove("user-is-tabbing")}handleError(){if(this.errorMessage){this.generateError()}else{this.clearError();this.processInput()}}handleInput(e){this.value=e.target.value}handleBlur(e){const t=this.preventValidation&&l(e,this.preventValidation);if(!t){this.processInput()}this.dpWrapper.classList.remove("focus")}focusHandler(){this.dpWrapper.classList.add("focus")}handlePopupBlurred(e){if(e.detail.relatedTarget!==this.el){const t=new CustomEvent("blur");t.relatedTarget=e.detail.relatedTarget;this.el.dispatchEvent(t)}}getActiveElement(){return o(document.activeElement)}handleCellTriggered(e){let t=e.detail;let i=t.getAttribute("data-year")+"-"+t.getAttribute("data-month")+"-"+t.textContent;this.inputEl.value=this.reformatDate(this.dateFormat,i);this.processInput();const r=new CustomEvent("input");this.el.dispatchEvent(r)}processInput(e){const t=!e&&this.requiredField;let i=this.inputEl.value;if(this.eightDigitsEntry.test(this.inputEl.value)){this.inputEl.value=this.addSlashes(this.inputEl.value)}if(this.parsableEntry.test(this.inputEl.value)){i=this.reformatDate("ISO",this.inputEl.value);this.inputEl.value=this.reformatDate(this.dateFormat,i);if(this.isValidDate(i)){if(this.errorMessage){this.generateError()}else{this.clearError()}}else if(this.inputEl.value.length){this.generateError()}}else if(this.inputEl.value.length||t||this.errorMessage){this.generateError()}else if(!this.inputEl.value.length&&!t){this.clearError()}this.value=i;if(i!==this.lastCommittedValue){const e=new CustomEvent("change");this.el.dispatchEvent(e);this.lastCommittedValue=this.value}if(this.isValidDate(i)&&i!==this.lastValidValue){this.wmDatepickerNewValidValue.emit();this.lastValidValue=i}}reformatDate(e,t){if(!t){return""}else if(!this.parsableEntry.test(t)){return t}else{let i=t.replace(/[\-\.]/gi,"/").split("/");switch(e){case"US":case this.dateFormats["US"]:return i[1].padStart(2,"0")+"/"+i[2].padStart(2,"0")+"/"+i[0].padStart(4,"20");case"INT":case this.dateFormats["INT"]:return i[2].padStart(2,"0")+"/"+i[1].padStart(2,"0")+"/"+i[0].padStart(4,"20");case"ISO":case this.dateFormats["ISO"]:if(this.dateFormat==="US"||this.dateFormat===this.dateFormats["US"]){return i[2].padStart(4,"20")+"-"+i[0].padStart(2,"0")+"-"+i[1].padStart(2,"0")}else if(this.dateFormat==="INT"||this.dateFormat===this.dateFormats["INT"]){return i[2].padStart(4,"20")+"-"+i[1].padStart(2,"0")+"-"+i[0].padStart(2,"0")}else if(this.dateFormat==="ISO"||this.dateFormat===this.dateFormats["ISO"]){return i[0].padStart(4,"20")+"-"+i[1].padStart(2,"0")+"-"+i[2].padStart(2,"0")}default:return i.join("/")}}}isValidDate(e){if(!e||!this.isoEntry.test(e)){return false}else{let t=e.split("-");let i=parseInt(t[2],10);let r=parseInt(t[1],10);let a=parseInt(t[0],10);if(a<1e3||a>3e3||r==0||r>12)return false;let s=[31,28,31,30,31,30,31,31,30,31,30,31];if(a%400==0||a%100!=0&&a%4==0)s[1]=29;return i>0&&i<=s[r-1]}}generateError(){const e=this.requiredFieldMessage||s.formatMessage({id:"date.requiredDateError",defaultMessage:"A date is required."});const t=s.formatMessage({id:"date.invalidDate",defaultMessage:"Please enter a valid date in the format {dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}."},{dateFormat:this.dateFormat.toLowerCase()});if(this.errorMessage){this.displayError=this.errorMessage}else if(this.inputEl.value.length){this.displayError=t}else if(!this.inputEl.value.length&&this.requiredField){this.displayError=e}}clearError(){this.displayError=""}addSlashes(e){if(this.dateFormat==="ISO"||this.dateFormat===this.dateFormats["ISO"]){return e.substring(0,4)+"/"+e.substring(4,6)+"/"+e.substring(6)}else{return e.substring(0,2)+"/"+e.substring(2,4)+"/"+e.substring(4)}}componentWillLoad(){if(this.label===""){console.error("You must include a label prop for the datepicker input (for accessibility reasons), even if the label position is none.")}if(this.errorMessage){this.generateError()}this.uid=this.el.id?this.el.id:p();if(this.value&&this.isValidDate(this.value)){this.lastValidValue=this.value}}componentDidLoad(){this.inputEl.value=this.reformatDate(this.dateFormat,this.value);this.processInput(true)}render(){const e=s.formatMessage({id:"date.format",defaultMessage:"{dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}"},{dateFormat:this.dateFormat.toLowerCase()});return i(r,{id:this.uid,"aria-busy":"false",class:`${this.displayError?"invalid":""}`,invalid:this.displayError?"true":null},i("div",{ref:e=>this.dpWrapper=e,class:`wrapper label-${this.labelPosition} ${this.displayError?"invalid":""}`},i("div",{class:"label-wrapper"},this.labelPosition!=="none"&&i("label",{id:`datepickerLabel-${this.uid}`,htmlFor:`date-input-${this.uid}`,class:"label",title:`${this.label} (${e})`},this.label,this.requiredField&&i("span",{"aria-hidden":"true",class:"required"},"*"))),i("div",null,i("div",{class:"inner-wrapper"},i("input",{disabled:this.disabled,type:"text",id:`date-input-${this.uid}`,class:"date-input",name:"date",placeholder:e,onFocus:this.focusHandler.bind(this),onInput:e=>this.handleInput(e),onBlur:e=>this.handleBlur(e),ref:e=>this.inputEl=e,"aria-describedby":`error-${this.uid}`,"aria-controls":`popup-${this.uid}`,"aria-label":this.label,"aria-required":this.requiredField?"true":null}),i("priv-datepicker",{disabled:this.disabled,date:this.lastValidValue?new Date(this.lastValidValue):new Date,parentId:this.uid})),i("div",{id:`error-${this.uid}`,class:"error","aria-live":"assertive","aria-atomic":"true"},this.displayError))))}static get delegatesFocus(){return true}get el(){return a(this)}static get watchers(){return{errorMessage:["handleError"]}}};d.style=n;export{d as wm_datepicker};
+//# sourceMappingURL=p-1da75922.entry.js.map

package/dist/ripple/p-1da75922.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["wmDatepickerCss","DatePicker","this","lastCommittedValue","value","parsableEntry","isoEntry","eightDigitsEntry","dateFormats","US","intl","formatMessage","id","defaultMessage","INT","ISO","handleTabbingOn","dpWrapper","classList","add","handleTabbingOff","remove","handleError","errorMessage","generateError","clearError","processInput","handleInput","ev","target","handleBlur","shouldPreventValidation","preventValidation","isRelatedTarget","focusHandler","handlePopupBlurred","detail","relatedTarget","el","event","CustomEvent","dispatchEvent","getActiveElement","checkForFocusableElInShadow","document","activeElement","handleCellTriggered","dateElement","isoDate","getAttribute","textContent","inputEl","reformatDate","dateFormat","isFirstLoad","leftEmpty","requiredField","test","addSlashes","isValidDate","length","lastValidValue","wmDatepickerNewValidValue","emit","toFormat","date","dateArr","replace","split","padStart","join","input","parts","day","parseInt","month","year","monthLength","requiredDateErr","requiredFieldMessage","validDateErr","toLowerCase","displayError","substring","componentWillLoad","label","console","error","uid","generateId","componentDidLoad","render","h","Host","class","invalid","ref","d","labelPosition","htmlFor","title","disabled","type","name","placeholder","onFocus","bind","onInput","onBlur","Date","parentId"],"sources":["./src/components/wm-datepicker/wm-datepicker.scss?tag=wm-datepicker&encapsulation=shadow","./src/components/wm-datepicker/wm-datepicker.tsx"],"sourcesContent":[":host,\r\nwm-datepicker {\r\n  font-family: inherit;\r\n\r\n  * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  @include label;\r\n\r\n  .wrapper {\r\n    position: relative;\r\n\r\n    .required {\r\n      color: $datepicker-required-input;\r\n    }\r\n\r\n    .inner-wrapper {\r\n      @include displayFlex();\r\n      align-items: center;\r\n      height: rem-calc(40);\r\n      border: 1px solid;\r\n      border-color: $datepicker-input-border-color;\r\n      @include border-radius(3px);\r\n      max-width: 236px; /* input is 200px or smaller, button is 36px */\r\n      justify-content: space-between;\r\n      position: relative;\r\n\r\n      .date-input {\r\n        -moz-border-top-left-radius: 3px;\r\n        -webkit-border-top-left-radius: 3px;\r\n        border-top-left-radius: 3px;\r\n        -moz-border-bottom-left-radius: 3px;\r\n        -webkit-border-bottom-left-radius: 3px;\r\n        border-bottom-left-radius: 3px;\r\n        border: none;\r\n        font-size: rem-calc(14);\r\n        padding: rem-calc(10 15 8);\r\n        min-width: 0;\r\n        height: 100%;\r\n        flex: 1;\r\n        margin: 0;\r\n\r\n        &:disabled {\r\n          background-color: $input-disabled-bg;\r\n          color: $input-disabled-color;\r\n        }\r\n\r\n        &:focus {\r\n          outline: none;\r\n        }\r\n      }\r\n    }\r\n\r\n    &.invalid {\r\n      .inner-wrapper {\r\n        @include invalid;\r\n      }\r\n\r\n      .error {\r\n        margin-top: 4px;\r\n        margin-bottom: 4px;\r\n        display: block;\r\n        top: 100%;\r\n        left: 0;\r\n        font-style: italic;\r\n        font-size: rem-calc(14);\r\n        color: $error-color;\r\n      }\r\n    }\r\n\r\n    &.focus {\r\n      .inner-wrapper {\r\n        @include field-focus;\r\n      }\r\n    }\r\n  }\r\n\r\n  .user-is-tabbing {\r\n    .toggle:focus {\r\n      &:not(:active) {\r\n        border: none;\r\n        z-index: 11;\r\n      }\r\n    }\r\n  }\r\n}\r\n","import { h, Component, Host, Element, Event, EventEmitter, Prop, Listen, Watch, State } from \"@stencil/core\";\r\nimport { generateId, checkForFocusableElInShadow, intl, isRelatedTarget } from \"../../global/functions\";\r\n\r\n@Component({\r\n  tag: \"wm-datepicker\",\r\n  styleUrl: \"wm-datepicker.scss\",\r\n  shadow: { delegatesFocus: true },\r\n})\r\nexport class DatePicker {\r\n  @Element() el!: HTMLWmDatepickerElement;\r\n  private dpWrapper!: HTMLDivElement;\r\n  private inputEl!: HTMLInputElement;\r\n\r\n  @Prop({ mutable: true }) value?: string = \"\";\r\n  @Prop() disabled: boolean = false;\r\n  @Prop({ mutable: true }) dateFormat: string = \"US\";\r\n  @Prop({ reflect: true }) errorMessage: string = \"\";\r\n  @Prop({ mutable: true }) labelPosition: \"top\" | \"left\" | \"none\" = \"top\";\r\n  @Prop({ mutable: true }) label: string = \"\";\r\n  @Prop() requiredField: boolean = false;\r\n  @Prop() requiredFieldMessage?: string;\r\n  @Prop() preventValidation?: string; // id or series of ids, validation will not occur when clicking an element with this id\r\n  @State() displayError: string = \"\";\r\n  @Event() wmDatepickerNewValidValue!: EventEmitter;\r\n\r\n  // we only want to fire the \"change\" event if the value has actually changed (that's\r\n  // how native elements do it), so we need to keep in state the last committed value.\r\n  private lastCommittedValue?: string = this.value;\r\n  private lastValidValue?: string;\r\n  private uid!: string;\r\n\r\n  // 1, 2, or 4 digits, separator, 1 or 2 digits, separator, then 1 or 2 or 4 digits\r\n  private parsableEntry = /^(\\d{1}|\\d{2}|\\d{4})[\\-\\.\\/]\\d{1,2}[\\-\\.\\/](\\d{1}|\\d{2}|\\d{4})$/;\r\n  private isoEntry = /^\\d\\d\\d\\d[-]\\d\\d[-]\\d\\d$/;\r\n  private eightDigitsEntry = /^\\d{8}$/;\r\n\r\n  dateFormats: any = {\r\n    US: intl.formatMessage({\r\n      id: \"date.formatUS\",\r\n      defaultMessage: \"mm/dd/yyyy\",\r\n    }),\r\n    INT: intl.formatMessage({\r\n      id: \"date.formatINT\",\r\n      defaultMessage: \"dd/mm/yyyy\",\r\n    }),\r\n    ISO: intl.formatMessage({\r\n      id: \"date.formatISO\",\r\n      defaultMessage: \"yyyy/mm/dd\",\r\n    }),\r\n  };\r\n\r\n  @Listen(\"keydown\")\r\n  handleTabbingOn() {\r\n    this.dpWrapper && this.dpWrapper.classList.add(\"user-is-tabbing\");\r\n  }\r\n\r\n  @Listen(\"click\")\r\n  handleTabbingOff() {\r\n    this.dpWrapper && this.dpWrapper.classList.remove(\"user-is-tabbing\");\r\n  }\r\n\r\n  @Watch(\"errorMessage\")\r\n  handleError() {\r\n    if (this.errorMessage) {\r\n      this.generateError();\r\n    } else {\r\n      this.clearError();\r\n      this.processInput();\r\n    }\r\n  }\r\n\r\n  handleInput(ev: Event) {\r\n    // keep component's value in sync with input's value\r\n    // validation only happens on blur and initial load,\r\n    // but component's value should reflect user input at any time\r\n    this.value = (ev.target! as HTMLInputElement).value; // same as this.inputEl.value\r\n  }\r\n\r\n  // this is input blur, not component blur\r\n  handleBlur(ev: FocusEvent) {\r\n    // do not validate if clicking to an element that should prevent validation (e.g. close button on modal)\r\n    const shouldPreventValidation = this.preventValidation && isRelatedTarget(ev, this.preventValidation);\r\n    if (!shouldPreventValidation) {\r\n      this.processInput();\r\n    }\r\n    this.dpWrapper.classList.remove(\"focus\");\r\n  }\r\n\r\n  // this is input focus, not component focus\r\n  focusHandler() {\r\n    this.dpWrapper.classList.add(\"focus\");\r\n  }\r\n\r\n  @Listen(\"popupBlurred\")\r\n  handlePopupBlurred(ev: CustomEvent) {\r\n    // emit blur event when leaving component from priv-datepicker\r\n    if (ev.detail.relatedTarget !== this.el) {\r\n      const event = new CustomEvent(\"blur\");\r\n      // @ts-ignore\r\n      event.relatedTarget = ev.detail.relatedTarget;\r\n      this.el.dispatchEvent(event);\r\n    }\r\n  }\r\n\r\n  getActiveElement() {\r\n    return checkForFocusableElInShadow(document.activeElement as HTMLElement);\r\n  }\r\n\r\n  @Listen(\"cellTriggered\")\r\n  handleCellTriggered(ev: CustomEvent) {\r\n    let dateElement = ev.detail as HTMLTableCellElement;\r\n    let isoDate =\r\n      dateElement.getAttribute(\"data-year\")! +\r\n      \"-\" +\r\n      dateElement.getAttribute(\"data-month\")! +\r\n      \"-\" +\r\n      dateElement.textContent!;\r\n    this.inputEl.value = this.reformatDate(this.dateFormat, isoDate);\r\n    this.processInput();\r\n\r\n    // Create event to trigger onInput function on host element, to get the updated value\r\n    // Because there are more ways to input than just typing, we are firing this event upon cellTriggered\r\n    const event = new CustomEvent(\"input\");\r\n    this.el.dispatchEvent(event);\r\n  }\r\n\r\n  processInput(isFirstLoad?: boolean) {\r\n    // The required field error should not display on first load\r\n    const leftEmpty = !isFirstLoad && this.requiredField;\r\n\r\n    let isoDate = this.inputEl.value;\r\n\r\n    //If input is 8 digits, add slashes as a courtesy and process anyway\r\n    if (this.eightDigitsEntry.test(this.inputEl.value)) {\r\n      this.inputEl.value = this.addSlashes(this.inputEl.value);\r\n    }\r\n\r\n    // if we don't have 2 separators we can't reformat so we'll return what was passed in\r\n    if (this.parsableEntry.test(this.inputEl.value)) {\r\n      //ISO format for submission\r\n      isoDate = this.reformatDate(\"ISO\", this.inputEl.value);\r\n\r\n      //User-specific format for display\r\n      this.inputEl.value = this.reformatDate(this.dateFormat, isoDate);\r\n\r\n      if (this.isValidDate(isoDate)) {\r\n        //If there's no errorMessage on state, all errors can be cleared. If there IS an error message, it will clear any internal validation errors by overriding them.\r\n        if (this.errorMessage) {\r\n          this.generateError();\r\n        } else {\r\n          this.clearError();\r\n        }\r\n        //Prevents error from appearing if input field is empty\r\n      } else if (this.inputEl.value.length) {\r\n        this.generateError();\r\n      }\r\n    } else if (this.inputEl.value.length || leftEmpty || this.errorMessage) {\r\n      this.generateError();\r\n    } else if (!this.inputEl.value.length && !leftEmpty) {\r\n      this.clearError();\r\n    }\r\n\r\n    // value is set to the reformated date or whatever the user passed\r\n    this.value = isoDate;\r\n\r\n    if (isoDate !== this.lastCommittedValue) {\r\n      const event = new CustomEvent(\"change\");\r\n      this.el.dispatchEvent(event);\r\n      this.lastCommittedValue = this.value;\r\n    }\r\n\r\n    // event must fire after we set this.value\r\n    // only fire if new valid value is different from the previous one\r\n    if (this.isValidDate(isoDate) && isoDate !== this.lastValidValue) {\r\n      this.wmDatepickerNewValidValue.emit();\r\n      //Update prop passed into calendar to valid date\r\n      this.lastValidValue = isoDate;\r\n    }\r\n  }\r\n\r\n  // this function reformats date strings to/from the storage format ONLY. US -> INT and vice versa is not supported.\r\n  reformatDate(toFormat: string, date?: string): string {\r\n    if (!date) {\r\n      return \"\";\r\n    } else if (!this.parsableEntry.test(date)) {\r\n      return date;\r\n    } else {\r\n      let dateArr = date.replace(/[\\-\\.]/gi, \"/\").split(\"/\");\r\n      switch (toFormat) {\r\n        case \"US\":\r\n        case this.dateFormats[\"US\"]:\r\n          return dateArr[1].padStart(2, \"0\") + \"/\" + dateArr[2].padStart(2, \"0\") + \"/\" + dateArr[0].padStart(4, \"20\");\r\n        case \"INT\":\r\n        case this.dateFormats[\"INT\"]:\r\n          return dateArr[2].padStart(2, \"0\") + \"/\" + dateArr[1].padStart(2, \"0\") + \"/\" + dateArr[0].padStart(4, \"20\");\r\n        case \"ISO\":\r\n        case this.dateFormats[\"ISO\"]:\r\n          if (this.dateFormat === \"US\" || this.dateFormat === this.dateFormats[\"US\"]) {\r\n            return dateArr[2].padStart(4, \"20\") + \"-\" + dateArr[0].padStart(2, \"0\") + \"-\" + dateArr[1].padStart(2, \"0\");\r\n          } else if (this.dateFormat === \"INT\" || this.dateFormat === this.dateFormats[\"INT\"]) {\r\n            return dateArr[2].padStart(4, \"20\") + \"-\" + dateArr[1].padStart(2, \"0\") + \"-\" + dateArr[0].padStart(2, \"0\");\r\n          } else if (this.dateFormat === \"ISO\" || this.dateFormat === this.dateFormats[\"ISO\"]) {\r\n            return dateArr[0].padStart(4, \"20\") + \"-\" + dateArr[1].padStart(2, \"0\") + \"-\" + dateArr[2].padStart(2, \"0\");\r\n          }\r\n        default:\r\n          return dateArr.join(\"/\");\r\n      }\r\n    }\r\n  }\r\n\r\n  isValidDate(input?: string) {\r\n    // if it's not ISO it's not valid\r\n    if (!input || !this.isoEntry.test(input)) {\r\n      return false;\r\n    } else {\r\n      // Parse the ISO date parts to integers\r\n      let parts = input.split(\"-\");\r\n      let day = parseInt(parts[2], 10);\r\n      let month = parseInt(parts[1], 10);\r\n      let year = parseInt(parts[0], 10);\r\n      // Check the ranges of month and year\r\n      if (year < 1000 || year > 3000 || month == 0 || month > 12) return false;\r\n      let monthLength = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];\r\n      // Adjust for leap years\r\n      if (year % 400 == 0 || (year % 100 != 0 && year % 4 == 0)) monthLength[1] = 29;\r\n      // Check the range of the day\r\n      return day > 0 && day <= monthLength[month - 1];\r\n    }\r\n  }\r\n\r\n  generateError() {\r\n    const requiredDateErr: string =\r\n      this.requiredFieldMessage ||\r\n      intl.formatMessage({\r\n        id: \"date.requiredDateError\",\r\n        defaultMessage: \"A date is required.\",\r\n      });\r\n    const validDateErr = intl.formatMessage(\r\n      {\r\n        id: \"date.invalidDate\",\r\n        defaultMessage:\r\n          \"Please enter a valid date in the format {dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}.\",\r\n      },\r\n      { dateFormat: this.dateFormat.toLowerCase() }\r\n    );\r\n    if (this.errorMessage) {\r\n      this.displayError = this.errorMessage;\r\n    } else if (this.inputEl.value.length) {\r\n      this.displayError = validDateErr;\r\n    } else if (!this.inputEl.value.length && this.requiredField) {\r\n      this.displayError = requiredDateErr;\r\n    }\r\n  }\r\n\r\n  clearError() {\r\n    this.displayError = \"\";\r\n  }\r\n\r\n  addSlashes(input: string) {\r\n    if (this.dateFormat === \"ISO\" || this.dateFormat === this.dateFormats[\"ISO\"]) {\r\n      return input.substring(0, 4) + \"/\" + input.substring(4, 6) + \"/\" + input.substring(6);\r\n    } else {\r\n      return input.substring(0, 2) + \"/\" + input.substring(2, 4) + \"/\" + input.substring(4);\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    if (this.label === \"\") {\r\n      console.error(\r\n        \"You must include a label prop for the datepicker input (for accessibility reasons), even if the label position is none.\"\r\n      );\r\n    }\r\n    if (this.errorMessage) {\r\n      this.generateError();\r\n    }\r\n\r\n    this.uid = this.el.id ? this.el.id : generateId();\r\n\r\n    if (this.value && this.isValidDate(this.value)) {\r\n      // update value passed into calendar so that it opens on the specified date\r\n      this.lastValidValue = this.value;\r\n    }\r\n  }\r\n\r\n  componentDidLoad() {\r\n    // convert passed-in starting date from ISO to locale format, update displayed input to proper format\r\n    this.inputEl.value = this.reformatDate(this.dateFormat, this.value);\r\n    this.processInput(true);\r\n  }\r\n\r\n  render() {\r\n    const dateFormat = intl.formatMessage(\r\n      {\r\n        id: \"date.format\",\r\n        defaultMessage: \"{dateFormat, select, us {mm/dd/yyyy} int {dd/mm/yyyy} other {yyyy/mm/dd}}\",\r\n      },\r\n      { dateFormat: this.dateFormat.toLowerCase() }\r\n    );\r\n    return (\r\n      <Host\r\n        id={this.uid}\r\n        aria-busy=\"false\"\r\n        class={`${this.displayError ? \"invalid\" : \"\"}`}\r\n        invalid={this.displayError ? \"true\" : null}\r\n      >\r\n        <div\r\n          ref={(d) => (this.dpWrapper = d as HTMLDivElement)}\r\n          class={`wrapper label-${this.labelPosition} ${this.displayError ? \"invalid\" : \"\"}`}\r\n        >\r\n          <div class=\"label-wrapper\">\r\n            {this.labelPosition !== \"none\" && (\r\n              <label\r\n                id={`datepickerLabel-${this.uid}`}\r\n                htmlFor={`date-input-${this.uid}`}\r\n                class=\"label\"\r\n                title={`${this.label} (${dateFormat})`}\r\n              >\r\n                {this.label}\r\n                {this.requiredField && (\r\n                  <span aria-hidden=\"true\" class=\"required\">\r\n                    *\r\n                  </span>\r\n                )}\r\n              </label>\r\n            )}\r\n          </div>\r\n          <div>\r\n            <div class=\"inner-wrapper\">\r\n              <input\r\n                disabled={this.disabled}\r\n                type=\"text\"\r\n                id={`date-input-${this.uid}`}\r\n                class=\"date-input\"\r\n                name=\"date\"\r\n                placeholder={dateFormat}\r\n                onFocus={this.focusHandler.bind(this)}\r\n                onInput={(ev) => this.handleInput(ev)}\r\n                onBlur={(ev) => this.handleBlur(ev)}\r\n                ref={(input) => (this.inputEl = input as HTMLInputElement)}\r\n                aria-describedby={`error-${this.uid}`}\r\n                aria-controls={`popup-${this.uid}`}\r\n                aria-label={this.label}\r\n                aria-required={this.requiredField ? \"true\" : null}\r\n              />\r\n              <priv-datepicker\r\n                disabled={this.disabled}\r\n                date={this.lastValidValue ? new Date(this.lastValidValue) : new Date()}\r\n                parentId={this.uid}\r\n              />\r\n            </div>\r\n            <div id={`error-${this.uid}`} class=\"error\" aria-live=\"assertive\" aria-atomic=\"true\">\r\n              {this.displayError}\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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"}

package/dist/ripple/{p-0a23f0fa.entry.js → p-22d9c36e.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as o,H as i,g as s}from"./p-1c23de4a.js";import{g as a,c as n}from"./p-9fd3badc.js";const d="wm-modal{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);z-index:2001;width:80vw;max-width:750px;max-height:80vh;-webkit-box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14);-moz-box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14);box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14)}wm-modal *{-webkit-box-sizing:border-box;box-sizing:border-box}wm-modal>*{width:80vw;max-width:750px;background:#fff}wm-modal>*:focus{outline:none}wm-modal wm-modal-header,wm-modal wm-modal-footer{padding:1.25rem 1.875rem}wm-modal wm-modal-header{z-index:2003}wm-modal wm-modal-footer{z-index:2003}wm-modal>:not(wm-modal-header):not(wm-modal-footer){max-height:calc(80vh - 166px);z-index:2002}wm-modal.wm-modal wm-modal-header{border-bottom:1px solid #f4f3f6}wm-modal.wm-modal wm-modal-footer{border-top:1px solid #f4f3f6}@media only screen and (max-width: 768px){wm-modal.wm-modal{height:100%;max-height:none;max-width:none;width:100vw}wm-modal.wm-modal>*{max-width:none;width:100vw}wm-modal.wm-modal>*:not(wm-modal-header):not(wm-modal-footer){max-height:none;height:calc(100vh - 166px)}}wm-modal.wm-dialog>:not(wm-modal-header):not(wm-modal-footer){padding:0 1.875rem 1.25rem 1.875rem;font-size:0.875rem;border:none}wm-modal .overlay{width:100vw;height:100vh;max-width:none;max-height:none;position:fixed !important;top:-1;bottom:1;left:-1;right:1;-webkit-transform:translate(0%, 0%);transform:translate(0%, 0%);background-color:rgba(25, 25, 25, 0.4);-ms-transition:opacity 0.5s ease-out;-webkit-transition:opacity 0.5s ease-out;-moz-transition:opacity 0.5s ease-out;transition:opacity 0.5s ease-out;z-index:2000}wm-modal.hide{visibility:hidden}wm-modal .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important;top:0;left:0}";const m=class{constructor(o){t(this,o);this.focusLastElement=e(this,"focusLastElement",3);this.focusFirstElement=e(this,"focusFirstElement",3);this.wmModalCloseTriggered=e(this,"wmModalCloseTriggered",3);this.wmCloseTriggered=e(this,"wmCloseTriggered",7);this.wmModalPrimaryTriggered=e(this,"wmModalPrimaryTriggered",7);this.wmPrimaryTriggered=e(this,"wmPrimaryTriggered",7);this.wmModalSecondaryTriggered=e(this,"wmModalSecondaryTriggered",7);this.wmSecondaryTriggered=e(this,"wmSecondaryTriggered",7);this.bodyFocusListener=()=>this.redirectFocusFromBody();this.open=false;this.isOpen=false;this.elementToFocus="";this.modalType=null;this.isTypeDialog=null;this.uid=undefined}get tempOpen(){return this.open||this.isOpen}get tempModalType(){return this.modalType?this.modalType:this.isTypeDialog?"dialog":"modal"}get focusOnOpenEl(){let t=null;if(this.elementToFocus==="primary"||this.elementToFocus==="secondary"){t=this.el.querySelector(`#wm-${this.elementToFocus}-${this.uid}`)}else if(this.elementToFocus){t=this.el.querySelector("#"+this.elementToFocus);!t&&console.warn("Ripple Component Library: The modal component couldn't find an element matching the id you passed for 'elementToFocus'. It will fall back to the default and focus the close button when the modal opens.")}const e=this.el.querySelector(`#wm-modal-close-${this.uid}`);return t?t:e}toggleModal(){this.tempOpen?this.showModal():this.hideModal()}handleClick(t){this.tempOpen&&t.target===this.overlayEl&&this.focusOnOpenEl.focus()}closeModalOnEscape(t){if(t.key==="Escape"){t.stopPropagation();this.wmModalCloseTriggered.emit();this.wmCloseTriggered.emit();this.open=false}}showModal(){this.setAriaDescribedbyOnModal();this.setElToFocusOnClose();document.body.style.overflow="hidden";document.body.tabIndex=0;document.body.removeEventListener("focus",this.bodyFocusListener,true);document.body.addEventListener("focus",this.bodyFocusListener,true);window.requestAnimationFrame((()=>{window.requestAnimationFrame((()=>this.focusOnOpenEl.focus()))}))}hideModal(){document.body.style.overflow="visible";document.body.tabIndex=-1;document.body.removeEventListener("focus",this.bodyFocusListener,true);window.requestAnimationFrame((()=>this.focusOnCloseEl.focus()))}componentWillLoad(){if(this.isOpen){console.warn("wm-modal: is-open has been deprecated as of v3.1.0. Please use open instead.")}if(this.isTypeDialog){console.warn("wm-modal: is-type-dialog has been deprecated as of v3.1.0. Please use modal-type instead.")}if(this.elementToFocus==="primary"||this.elementToFocus==="secondary"){if(!this.el.id){console.error("You are telling the modal to focus an element in the footer when it opens. That's fine! But when you do that, you also need to give the wm-modal-wrapper an ID and set the ID of the modal body to 'content-[id of wm-modal-wrapper]. This is for accessibility purposes.")}}this.el.focus=()=>{this.focusOnOpenEl.focus()};this.uid=this.el.id?this.el.id:a()}componentDidLoad(){if(this.tempOpen){this.showModal()}}async emitCloseEvent(){this.wmModalCloseTriggered.emit();this.wmCloseTriggered.emit()}async emitPrimaryEvent(){this.wmModalPrimaryTriggered.emit();this.wmPrimaryTriggered.emit()}async emitSecondaryEvent(){this.wmModalSecondaryTriggered.emit();this.wmSecondaryTriggered.emit()}setAriaDescribedbyOnModal(){const t=document.getElementById(`content-${this.uid}`);if(!t){console.warn("Ripple Component Library: The element containing the body of the modal must include an id in the format 'content-[id of modal]' for accessibility purposes.")}else{this.el.setAttribute("aria-describedby",`wm-modal-heading-text-${this.uid} content-${this.uid}`)}}setElToFocusOnClose(){const t=document.activeElement;if(t.tagName==="WM-MENUITEM"){this.focusOnCloseEl=t.parentElement}else{this.focusOnCloseEl=n(t)}}redirectFocusFromBody(){if(document.activeElement.tagName==="BODY"){this.focusOnOpenEl.focus()}}render(){return o(i,{class:`${this.tempOpen?"":"hide "}${"wm-"+this.tempModalType}`,role:"dialog","aria-describedby":`wm-modal-heading-text-${this.uid}`,"aria-modal":"true",tabindex:this.tempOpen?0:null,onFocus:()=>{this.focusLastElement.emit()}},o("div",{class:"overlay",ref:t=>this.overlayEl=t}),o("div",{class:"sr-only",tabIndex:0,onFocus:()=>{this.focusFirstElement.emit()}}))}get el(){return s(this)}static get watchers(){return{open:["toggleModal"],isOpen:["toggleModal"]}}};m.style=d;export{m as wm_modal};
-//# sourceMappingURL=p-0a23f0fa.entry.js.map
+import{r as t,c as e,h as o,H as i,g as s}from"./p-1c23de4a.js";import{g as a,c as n}from"./p-edfba0e1.js";const d="wm-modal{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;position:fixed;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);z-index:2001;width:80vw;max-width:750px;max-height:80vh;-webkit-box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14);-moz-box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14);box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14)}wm-modal *{-webkit-box-sizing:border-box;box-sizing:border-box}wm-modal>*{width:80vw;max-width:750px;background:#fff}wm-modal>*:focus{outline:none}wm-modal wm-modal-header,wm-modal wm-modal-footer{padding:1.25rem 1.875rem}wm-modal wm-modal-header{z-index:2003}wm-modal wm-modal-footer{z-index:2003}wm-modal>:not(wm-modal-header):not(wm-modal-footer){max-height:calc(80vh - 166px);z-index:2002}wm-modal.wm-modal wm-modal-header{border-bottom:1px solid #f4f3f6}wm-modal.wm-modal wm-modal-footer{border-top:1px solid #f4f3f6}@media only screen and (max-width: 768px){wm-modal.wm-modal{height:100%;max-height:none;max-width:none;width:100vw}wm-modal.wm-modal>*{max-width:none;width:100vw}wm-modal.wm-modal>*:not(wm-modal-header):not(wm-modal-footer){max-height:none;height:calc(100vh - 166px)}}wm-modal.wm-dialog>:not(wm-modal-header):not(wm-modal-footer){padding:0 1.875rem 1.25rem 1.875rem;font-size:0.875rem;border:none}wm-modal .overlay{width:100vw;height:100vh;max-width:none;max-height:none;position:fixed !important;top:-1;bottom:1;left:-1;right:1;-webkit-transform:translate(0%, 0%);transform:translate(0%, 0%);background-color:rgba(25, 25, 25, 0.4);-ms-transition:opacity 0.5s ease-out;-webkit-transition:opacity 0.5s ease-out;-moz-transition:opacity 0.5s ease-out;transition:opacity 0.5s ease-out;z-index:2000}wm-modal.hide{visibility:hidden}wm-modal .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important;top:0;left:0}";const m=class{constructor(o){t(this,o);this.focusLastElement=e(this,"focusLastElement",3);this.focusFirstElement=e(this,"focusFirstElement",3);this.wmModalCloseTriggered=e(this,"wmModalCloseTriggered",3);this.wmCloseTriggered=e(this,"wmCloseTriggered",7);this.wmModalPrimaryTriggered=e(this,"wmModalPrimaryTriggered",7);this.wmPrimaryTriggered=e(this,"wmPrimaryTriggered",7);this.wmModalSecondaryTriggered=e(this,"wmModalSecondaryTriggered",7);this.wmSecondaryTriggered=e(this,"wmSecondaryTriggered",7);this.bodyFocusListener=()=>this.redirectFocusFromBody();this.open=false;this.isOpen=false;this.elementToFocus="";this.modalType=null;this.isTypeDialog=null;this.uid=undefined}get tempOpen(){return this.open||this.isOpen}get tempModalType(){return this.modalType?this.modalType:this.isTypeDialog?"dialog":"modal"}get focusOnOpenEl(){let t=null;if(this.elementToFocus==="primary"||this.elementToFocus==="secondary"){t=this.el.querySelector(`#wm-${this.elementToFocus}-${this.uid}`)}else if(this.elementToFocus){t=this.el.querySelector("#"+this.elementToFocus);!t&&console.warn("Ripple Component Library: The modal component couldn't find an element matching the id you passed for 'elementToFocus'. It will fall back to the default and focus the close button when the modal opens.")}const e=this.el.querySelector(`#wm-modal-close-${this.uid}`);return t?t:e}toggleModal(){this.tempOpen?this.showModal():this.hideModal()}handleClick(t){this.tempOpen&&t.target===this.overlayEl&&this.focusOnOpenEl.focus()}closeModalOnEscape(t){if(t.key==="Escape"){t.stopPropagation();this.wmModalCloseTriggered.emit();this.wmCloseTriggered.emit();this.open=false}}showModal(){this.setAriaDescribedbyOnModal();this.setElToFocusOnClose();document.body.style.overflow="hidden";document.body.tabIndex=0;document.body.removeEventListener("focus",this.bodyFocusListener,true);document.body.addEventListener("focus",this.bodyFocusListener,true);window.requestAnimationFrame((()=>{window.requestAnimationFrame((()=>this.focusOnOpenEl.focus()))}))}hideModal(){document.body.style.overflow="visible";document.body.tabIndex=-1;document.body.removeEventListener("focus",this.bodyFocusListener,true);window.requestAnimationFrame((()=>this.focusOnCloseEl.focus()))}componentWillLoad(){if(this.isOpen){console.warn("wm-modal: is-open has been deprecated as of v3.1.0. Please use open instead.")}if(this.isTypeDialog){console.warn("wm-modal: is-type-dialog has been deprecated as of v3.1.0. Please use modal-type instead.")}if(this.elementToFocus==="primary"||this.elementToFocus==="secondary"){if(!this.el.id){console.error("You are telling the modal to focus an element in the footer when it opens. That's fine! But when you do that, you also need to give the wm-modal-wrapper an ID and set the ID of the modal body to 'content-[id of wm-modal-wrapper]. This is for accessibility purposes.")}}this.el.focus=()=>{this.focusOnOpenEl.focus()};this.uid=this.el.id?this.el.id:a()}componentDidLoad(){if(this.tempOpen){this.showModal()}}async emitCloseEvent(){this.wmModalCloseTriggered.emit();this.wmCloseTriggered.emit()}async emitPrimaryEvent(){this.wmModalPrimaryTriggered.emit();this.wmPrimaryTriggered.emit()}async emitSecondaryEvent(){this.wmModalSecondaryTriggered.emit();this.wmSecondaryTriggered.emit()}setAriaDescribedbyOnModal(){const t=document.getElementById(`content-${this.uid}`);if(!t){console.warn("Ripple Component Library: The element containing the body of the modal must include an id in the format 'content-[id of modal]' for accessibility purposes.")}else{this.el.setAttribute("aria-describedby",`wm-modal-heading-text-${this.uid} content-${this.uid}`)}}setElToFocusOnClose(){const t=document.activeElement;if(t.tagName==="WM-MENUITEM"){this.focusOnCloseEl=t.parentElement}else{this.focusOnCloseEl=n(t)}}redirectFocusFromBody(){if(document.activeElement.tagName==="BODY"){this.focusOnOpenEl.focus()}}render(){return o(i,{class:`${this.tempOpen?"":"hide "}${"wm-"+this.tempModalType}`,role:"dialog","aria-describedby":`wm-modal-heading-text-${this.uid}`,"aria-modal":"true",tabindex:this.tempOpen?0:null,onFocus:()=>{this.focusLastElement.emit()}},o("div",{class:"overlay",ref:t=>this.overlayEl=t}),o("div",{class:"sr-only",tabIndex:0,onFocus:()=>{this.focusFirstElement.emit()}}))}get el(){return s(this)}static get watchers(){return{open:["toggleModal"],isOpen:["toggleModal"]}}};m.style=d;export{m as wm_modal};
+//# sourceMappingURL=p-22d9c36e.entry.js.map

package/dist/ripple/p-22d9c36e.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["wmModalCss","Modal","this","bodyFocusListener","redirectFocusFromBody","tempOpen","open","isOpen","tempModalType","modalType","isTypeDialog","focusOnOpenEl","customElementToFocus","elementToFocus","el","querySelector","uid","console","warn","closeButtonEl","toggleModal","showModal","hideModal","handleClick","ev","target","overlayEl","focus","closeModalOnEscape","key","stopPropagation","wmModalCloseTriggered","emit","wmCloseTriggered","setAriaDescribedbyOnModal","setElToFocusOnClose","document","body","style","overflow","tabIndex","removeEventListener","addEventListener","window","requestAnimationFrame","focusOnCloseEl","componentWillLoad","id","error","generateId","componentDidLoad","async","wmModalPrimaryTriggered","wmPrimaryTriggered","wmModalSecondaryTriggered","wmSecondaryTriggered","modalBody","getElementById","setAttribute","elToFocus","activeElement","tagName","parentElement","checkForActiveElInShadow","render","h","Host","class","role","tabindex","onFocus","focusLastElement","ref","focusFirstElement"],"sources":["./src/components/wm-modal/wm-modal.scss?tag=wm-modal","./src/components/wm-modal/wm-modal.tsx"],"sourcesContent":["wm-modal {\r\n  * {\r\n    box-sizing: border-box;\r\n  }\r\n  @include displayFlex();\r\n  @include justifyContent(center);\r\n  @include alignItems(center);\r\n\r\n  flex-direction: column;\r\n  position: fixed;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  z-index: 2001;\r\n  width: 80vw;\r\n  max-width: 750px;\r\n  max-height: 80vh;\r\n  @include box-shadow(\r\n    0px 11px 15px 0px rgba(0, 0, 0, 0.2),\r\n    0px 9px 46px 8px rgba(0, 0, 0, 0.12),\r\n    0px 24px 38px 3px rgba(0, 0, 0, 0.14)\r\n  );\r\n\r\n  > * {\r\n    width: 80vw;\r\n    max-width: 750px;\r\n    background: $light-background;\r\n\r\n    &:focus {\r\n      outline: none;\r\n    }\r\n  }\r\n\r\n  wm-modal-header,\r\n  wm-modal-footer {\r\n    padding: rem-calc(20 30);\r\n  }\r\n\r\n  wm-modal-header {\r\n    z-index: 2003;\r\n  }\r\n\r\n  wm-modal-footer {\r\n    z-index: 2003;\r\n  }\r\n\r\n  > :not(wm-modal-header):not(wm-modal-footer) {\r\n    max-height: calc(80vh - 166px);\r\n    z-index: 2002;\r\n  }\r\n\r\n  &.wm-modal {\r\n    wm-modal-header {\r\n      border-bottom: 1px solid rgb(244, 243, 246);\r\n    }\r\n\r\n    wm-modal-footer {\r\n      border-top: 1px solid rgb(244, 243, 246);\r\n    }\r\n\r\n    @media only screen and (max-width: 768px) {\r\n      height: 100%;\r\n      max-height: none;\r\n      max-width: none;\r\n      width: 100vw;\r\n\r\n      > * {\r\n        max-width: none;\r\n        width: 100vw;\r\n      }\r\n\r\n      > *:not(wm-modal-header):not(wm-modal-footer) {\r\n        max-height: none;\r\n        height: calc(100vh - 166px);\r\n      }\r\n    }\r\n  }\r\n\r\n  &.wm-dialog {\r\n    > :not(wm-modal-header):not(wm-modal-footer) {\r\n      padding: rem-calc(0 30 20 30);\r\n      font-size: rem-calc(14px);\r\n      border: none;\r\n    }\r\n  }\r\n\r\n  .overlay {\r\n    width: 100vw;\r\n    height: 100vh;\r\n    max-width: none;\r\n    max-height: none;\r\n    position: fixed !important;\r\n    top: -1;\r\n    bottom: 1;\r\n    left: -1;\r\n    right: 1;\r\n    transform: translate(0%, 0%);\r\n    background-color: rgba(25, 25, 25, 0.4);\r\n    @include transition(opacity 0.5s ease-out);\r\n    z-index: 2000;\r\n  }\r\n\r\n  &.hide {\r\n    visibility: hidden;\r\n  }\r\n\r\n  .sr-only {\r\n    @include srOnly;\r\n    top: 0;\r\n    left: 0;\r\n  }\r\n}\r\n","import { h, Component, Element, Listen, Host, Prop, Watch, Event, EventEmitter, Method } from \"@stencil/core\";\r\nimport { checkForActiveElInShadow } from \"../../global/functions\";\r\nimport { generateId } from \"../../global/functions\";\r\n\r\n@Component({\r\n  tag: \"wm-modal\",\r\n  styleUrl: \"wm-modal.scss\",\r\n})\r\nexport class Modal {\r\n  @Element() el!: HTMLWmModalElement;\r\n  @Prop({ reflect: true, mutable: true }) open: boolean = false;\r\n  @Prop({ reflect: true, mutable: true }) isOpen: boolean = false; // DEPRECATED in favor of open\r\n  get tempOpen() {\r\n    // instances of this.tempOpen should be replaced with this.open once isOpen is fully phased out\r\n    return this.open || this.isOpen;\r\n  }\r\n  @Prop({ mutable: true }) elementToFocus: \"primary\" | \"secondary\" | string = \"\"; // primary and secondary point to the corresponding buttons, otherwise focus based on element id\r\n  @Prop({ reflect: true }) modalType: \"modal\" | \"dialog\" | null = null;\r\n  @Prop({ reflect: true }) isTypeDialog: boolean | null = null;\r\n  get tempModalType() {\r\n    return this.modalType ? this.modalType : this.isTypeDialog ? \"dialog\" : \"modal\";\r\n  }\r\n  @Prop({ mutable: true, reflect: true }) uid!: string;\r\n  private focusOnCloseEl!: HTMLElement;\r\n  private overlayEl!: HTMLDivElement;\r\n  private bodyFocusListener: () => void = () => this.redirectFocusFromBody();\r\n\r\n  @Event({ bubbles: false }) focusLastElement!: EventEmitter;\r\n  @Event({ bubbles: false }) focusFirstElement!: EventEmitter;\r\n  // wmModalCloseTriggered does not bubble, prevent nested modals from closing all at once\r\n  @Event({ bubbles: false }) wmModalCloseTriggered!: EventEmitter;\r\n  @Event() wmCloseTriggered!: EventEmitter; // deprecated in favor of wmModalCloseTriggered\r\n  @Event() wmModalPrimaryTriggered!: EventEmitter;\r\n  @Event() wmPrimaryTriggered!: EventEmitter; // deprecated in favor of wmModalPrimaryTriggered\r\n  @Event() wmModalSecondaryTriggered!: EventEmitter;\r\n  @Event() wmSecondaryTriggered!: EventEmitter; // deprecated in favor of wmModalSecondaryTriggered\r\n\r\n  get focusOnOpenEl(): HTMLElement {\r\n    let customElementToFocus: HTMLElement | null = null;\r\n\r\n    if (this.elementToFocus === \"primary\" || this.elementToFocus === \"secondary\") {\r\n      customElementToFocus = this.el.querySelector<HTMLElement>(`#wm-${this.elementToFocus}-${this.uid}`);\r\n    } else if (this.elementToFocus) {\r\n      customElementToFocus = this.el.querySelector<HTMLElement>(\"#\" + this.elementToFocus);\r\n      !customElementToFocus &&\r\n        console.warn(\r\n          \"Ripple Component Library: The modal component couldn't find an element matching the id you passed for 'elementToFocus'. It will fall back to the default and focus the close button when the modal opens.\"\r\n        );\r\n    }\r\n\r\n    const closeButtonEl = this.el.querySelector<HTMLElement>(`#wm-modal-close-${this.uid}`)!;\r\n    return customElementToFocus ? customElementToFocus : closeButtonEl;\r\n  }\r\n\r\n  //App can open modal by toggling the prop\r\n  @Watch(\"open\")\r\n  @Watch(\"isOpen\")\r\n  toggleModal() {\r\n    this.tempOpen ? this.showModal() : this.hideModal();\r\n  }\r\n\r\n  //The below not implemented in light of the fact that the app does often need to keep track of the modal's state itself so that it can update the data displayed in the body:\r\n  //App can also open modal by emitting wmShowModal event. Event needs to include the modal's unique id as the event detail, or else all modals on the page will open when wmShowModal event is dispatched.\r\n  // @Listen(\"wmShowModal\", { target: \"window\" })\r\n  // doesEventMatchId(ev: CustomEvent) {\r\n  //   ev.detail === this.uid && this.showModal();\r\n  // }\r\n\r\n  @Listen(\"click\")\r\n  handleClick(ev: MouseEvent & { target: HTMLElement }) {\r\n    this.tempOpen && ev.target === this.overlayEl && this.focusOnOpenEl.focus();\r\n  }\r\n\r\n  @Listen(\"keydown\")\r\n  closeModalOnEscape(ev: KeyboardEvent) {\r\n    if (ev.key === \"Escape\") {\r\n      // stops propagation prevents nested modal from closing all at once\r\n      ev.stopPropagation();\r\n      this.wmModalCloseTriggered.emit();\r\n      this.wmCloseTriggered.emit(); // deprecated\r\n      this.open = false;\r\n    }\r\n  }\r\n\r\n  showModal() {\r\n    this.setAriaDescribedbyOnModal();\r\n    this.setElToFocusOnClose(); //Record where the user was before the modal opened so that focus can return to it when the modal closes\r\n    document.body.style.overflow = \"hidden\"; //Keeps the page below the modal from scrolling\r\n\r\n    //Focus listeners as a general catch for keeping focus in case of errors in finding element with id passed in by dev (element is removed from DOM, etc.) or other scenarios\r\n    document.body.tabIndex = 0;\r\n    document.body.removeEventListener(\"focus\", this.bodyFocusListener, true);\r\n    document.body.addEventListener(\"focus\", this.bodyFocusListener, true);\r\n\r\n    window.requestAnimationFrame(() => {\r\n      // nested requestAnimationFrames allow all elements to become visible on page before assigning focus\r\n      window.requestAnimationFrame(() => this.focusOnOpenEl.focus()); //Bring focus to element inside modal\r\n    });\r\n  }\r\n\r\n  //Close the modal and focus the triggering element when the modal buttons emit their events\r\n  hideModal() {\r\n    document.body.style.overflow = \"visible\";\r\n    document.body.tabIndex = -1;\r\n    document.body.removeEventListener(\"focus\", this.bodyFocusListener, true);\r\n    window.requestAnimationFrame(() => this.focusOnCloseEl.focus()); //Return focus\r\n  }\r\n\r\n  componentWillLoad() {\r\n    if (this.isOpen) {\r\n      console.warn(\"wm-modal: is-open has been deprecated as of v3.1.0. Please use open instead.\");\r\n    }\r\n    if (this.isTypeDialog) {\r\n      console.warn(\"wm-modal: is-type-dialog has been deprecated as of v3.1.0. Please use modal-type instead.\");\r\n    }\r\n    if (this.elementToFocus === \"primary\" || this.elementToFocus === \"secondary\") {\r\n      if (!this.el.id) {\r\n        console.error(\r\n          \"You are telling the modal to focus an element in the footer when it opens. That's fine! But when you do that, you also need to give the wm-modal-wrapper an ID and set the ID of the modal body to 'content-[id of wm-modal-wrapper]. This is for accessibility purposes.\"\r\n        );\r\n      }\r\n    }\r\n\r\n    this.el.focus = () => {\r\n      this.focusOnOpenEl.focus();\r\n    };\r\n\r\n    this.uid = this.el.id ? this.el.id : generateId();\r\n  }\r\n\r\n  componentDidLoad() {\r\n    if (this.tempOpen) {\r\n      this.showModal();\r\n    }\r\n  }\r\n\r\n  @Method()\r\n  async emitCloseEvent() {\r\n    this.wmModalCloseTriggered.emit();\r\n    this.wmCloseTriggered.emit(); // deprecated\r\n  }\r\n\r\n  @Method()\r\n  async emitPrimaryEvent() {\r\n    this.wmModalPrimaryTriggered.emit();\r\n    this.wmPrimaryTriggered.emit(); // deprecated\r\n  }\r\n\r\n  @Method()\r\n  async emitSecondaryEvent() {\r\n    this.wmModalSecondaryTriggered.emit();\r\n    this.wmSecondaryTriggered.emit(); // deprecated\r\n  }\r\n\r\n  setAriaDescribedbyOnModal() {\r\n    const modalBody = document.getElementById(`content-${this.uid}`);\r\n\r\n    if (!modalBody) {\r\n      console.warn(\r\n        \"Ripple Component Library: The element containing the body of the modal must include an id in the format 'content-[id of modal]' for accessibility purposes.\"\r\n      );\r\n    } else {\r\n      this.el.setAttribute(\"aria-describedby\", `wm-modal-heading-text-${this.uid} content-${this.uid}`);\r\n    }\r\n  }\r\n\r\n  setElToFocusOnClose() {\r\n    const elToFocus = document.activeElement as HTMLElement;\r\n    if (elToFocus.tagName === \"WM-MENUITEM\") {\r\n      this.focusOnCloseEl = elToFocus.parentElement!;\r\n    } else {\r\n      this.focusOnCloseEl = checkForActiveElInShadow(elToFocus);\r\n    }\r\n  }\r\n\r\n  redirectFocusFromBody() {\r\n    if ((document.activeElement as HTMLElement).tagName === \"BODY\") {\r\n      this.focusOnOpenEl.focus();\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host\r\n        class={`${this.tempOpen ? \"\" : \"hide \"}${\"wm-\" + this.tempModalType}`}\r\n        role=\"dialog\"\r\n        aria-describedby={`wm-modal-heading-text-${this.uid}`}\r\n        aria-modal=\"true\"\r\n        tabindex={this.tempOpen ? 0 : null}\r\n        onFocus={() => {\r\n          this.focusLastElement.emit();\r\n        }}\r\n      >\r\n        <div class=\"overlay\" ref={(el) => (this.overlayEl = el as HTMLDivElement)} />\r\n        <div\r\n          class=\"sr-only\"\r\n          tabIndex={0}\r\n          onFocus={() => {\r\n            this.focusFirstElement.emit();\r\n          }}\r\n        />\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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"}

package/dist/ripple/p-24a4cb11.system.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["ChartSlice","exports","class_1","prototype","componentDidLoad","parseInt","this","amount","legend","Error","componentDidUpdate","wmChartSliceUpdated","emit"],"sources":["src/components/charts/wm-chart/wm-chart-slice.tsx"],"sourcesContent":["import { Component, Prop, Event, EventEmitter } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-chart-slice\",\n})\nexport class ChartSlice {\n  @Prop() legend?: string;\n  @Prop() amount?: string;\n  @Prop() popoverTitle?: string;\n  @Prop() popoverText?: string;\n  @Prop() popoverButtonText?: string;\n\n  @Event() wmChartSliceUpdated!: EventEmitter<void>;\n\n  componentDidLoad() {\n    if (parseInt(this.amount!) > 0 && !this.legend) {\n      throw new Error(\n        \"wm-chart-slice was provided an amount value without a legend. The legend is required unless the amount is 0 or left empty. For more information see https://components.watermarkinsights.com/chart\"\n      );\n    }\n  }\n\n  componentDidUpdate() {\n    this.wmChartSliceUpdated.emit();\n  }\n}\n"],"mappings":"8IAKaA,EAAUC,EAAA,4B,qNASrBC,EAAAC,UAAAC,iBAAA,WACE,GAAIC,SAASC,KAAKC,QAAW,IAAMD,KAAKE,OAAQ,CAC9C,MAAM,IAAIC,MACR,qM,GAKNP,EAAAC,UAAAO,mBAAA,WACEJ,KAAKK,oBAAoBC,M,WAlBN,G"}
+{"version":3,"names":["ChartSlice","exports","class_1","prototype","componentDidLoad","parseInt","this","amount","legend","Error","componentDidUpdate","wmChartSliceUpdated","emit"],"sources":["src/components/charts/wm-chart/wm-chart-slice.tsx"],"sourcesContent":["import { Component, Prop, Event, EventEmitter } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"wm-chart-slice\",\r\n})\r\nexport class ChartSlice {\r\n  @Prop() legend?: string;\r\n  @Prop() amount?: string;\r\n  @Prop() popoverTitle?: string;\r\n  @Prop() popoverText?: string;\r\n  @Prop() popoverButtonText?: string;\r\n\r\n  @Event() wmChartSliceUpdated!: EventEmitter<void>;\r\n\r\n  componentDidLoad() {\r\n    if (parseInt(this.amount!) > 0 && !this.legend) {\r\n      throw new Error(\r\n        \"wm-chart-slice was provided an amount value without a legend. The legend is required unless the amount is 0 or left empty. For more information see https://components.watermarkinsights.com/chart\"\r\n      );\r\n    }\r\n  }\r\n\r\n  componentDidUpdate() {\r\n    this.wmChartSliceUpdated.emit();\r\n  }\r\n}\r\n"],"mappings":"8IAKaA,EAAUC,EAAA,4B,qNASrBC,EAAAC,UAAAC,iBAAA,WACE,GAAIC,SAASC,KAAKC,QAAW,IAAMD,KAAKE,OAAQ,CAC9C,MAAM,IAAIC,MACR,qM,GAKNP,EAAAC,UAAAO,mBAAA,WACEJ,KAAKK,oBAAoBC,M,WAlBN,G"}

package/dist/ripple/{p-c5a50724.entry.js → p-24f7d6eb.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as i,f as s,g as o}from"./p-1c23de4a.js";import{i as a,m as r,x as n}from"./p-9fd3badc.js";const h='.toggle{all:unset;cursor:pointer;padding:0 0.375rem;height:2.375rem;border:none;-moz-border-top-right-radius:3px;-webkit-border-top-right-radius:3px;border-top-right-radius:3px;-moz-border-bottom-right-radius:3px;-webkit-border-bottom-right-radius:3px;border-bottom-right-radius:3px;-moz-border-top-left-radius:0;-webkit-border-top-left-radius:0;border-top-left-radius:0;-moz-border-bottom-left-radius:0;-webkit-border-bottom-left-radius:0;border-bottom-left-radius:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background-color:#fff}.toggle:disabled{pointer-events:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background-color:rgba(74, 74, 74, 0.05)}.toggle:disabled .calendar::after{color:#7b7b7b}.toggle:hover{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background:#e6e6e6}.toggle:hover .calendar::after{color:#575195}[dir=RTL] .toggle{right:auto;left:0}.toggle span::after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f0ed";font-size:1.5rem;color:#575195;padding:0;line-height:2.5rem}.toggle:focus{outline:none}.toggle::-moz-focus-inner{border:0}.user-is-tabbing .toggle:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}.user-is-tabbing .toggle:focus::-moz-focus-inner{border:0}.popup{visibility:hidden;font-family:inherit;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;-webkit-box-shadow:0px 4px 15px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow:0px 4px 15px 0px rgba(0, 0, 0, 0.2);box-shadow:0px 4px 15px 0px rgba(0, 0, 0, 0.2);width:21rem;z-index:10;position:absolute;left:0;top:40px;min-height:21.0625rem;-webkit-transition:-webkit-transform 0.25s ease;transition:-webkit-transform 0.25s ease;transition:transform 0.25s ease;transition:transform 0.25s ease, -webkit-transform 0.25s ease;-webkit-transform-origin:center top;transform-origin:center top;-webkit-transform:scale(1, 0);transform:scale(1, 0);background-color:#fff}.popup.open{-webkit-transform:scale(1, 1);transform:scale(1, 1)}.popup.expand-upwards{top:auto;bottom:2.375rem;-webkit-transform-origin:center bottom;transform-origin:center bottom}.popup .calendar-header{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;position:relative;padding:0.9375rem 0.25rem}.popup .calendar-header .title-box{height:2.625rem;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;border:1px solid;font-weight:500;font-size:0.875rem;background:transparent;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;padding:0 0.375rem 0 0.75rem;border-color:#575195;color:#575195}.popup .calendar-header .title-box:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f140";padding-left:0.75rem}.popup .calendar-header .title-box.year:after{content:"\\f143"}.popup .calendar-header .title-box::-moz-focus-inner{border:0}.popup .calendar-header .title-box:focus{outline:none}.popup .calendar-header .arw-btn{cursor:pointer;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;width:2.75rem;height:2.75rem;border:none;color:#575195;background:transparent;padding:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;line-height:2.75rem}.popup .calendar-header .arw-btn .mdi{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:1.5rem;font-weight:normal;line-height:2.75rem}.popup .calendar-header .arw-btn .mdi:hover{background-color:#efeef1}.popup .calendar-header .arw-btn:focus{outline:none}.popup .calendar-header .arw-btn:active{-ms-transform:scale(0.9, 0.9);-webkit-transform:scale(0.9, 0.9);-moz-transform:scale(0.9, 0.9);transform:scale(0.9, 0.9);background-color:#d7d6d9}.popup .day-view{min-width:100%}.popup .day-view .date-grid{width:100%;text-align:center;border-collapse:collapse;margin-bottom:0.4375rem;color:#757575}.popup .day-view .date-grid .date-row:first-child .date-cell{margin-top:0.125rem}.popup .day-view .date-grid .date-header{background-color:#eeedf4}.popup .day-view .date-grid .header-cell{height:2.0625rem;line-height:2.0625rem;width:2.75rem;margin:0 calc((14.28% - 44px) / 2);padding:0;display:inline-block;font-size:0.8125rem;font-weight:bold;color:#4a4a4a;border:none}.popup .day-view .date-grid .date-cell{cursor:pointer;display:inline-block;padding:0;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;height:2.75rem;width:2.75rem;margin:0 calc((14.28% - 44px) / 2);font-size:0.875rem;font-weight:500;line-height:2.75rem}.popup .day-view .date-grid .date-cell:focus{outline:none}.popup .day-view .date-grid .date-cell:hover{background-color:#efeef1}.popup .day-view .date-grid .date-cell:active{background-color:#575195;color:#ffffff}.popup .day-view .date-grid .date-cell.current-month{color:#4a4a4a}.popup .day-view .date-grid .date-cell.current-month[aria-selected=true]{background-color:#575195;color:#ffffff}.popup .month-view .months{border-top:2px solid;border-top-color:#eeedf4;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.popup .month-view .month-row{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;width:100%;border-bottom:2px solid;border-bottom-color:#eeedf4}.popup .month-view .month{cursor:pointer;text-align:center;width:100%;height:4rem;line-height:4rem;font-weight:500;color:#575195}.popup .month-view .month:not(:last-child){border-right:2px solid;border-right-color:#eeedf4}.popup .month-view .month:focus{outline:none}.popup .month-view .month:hover{background-color:#efeef1}.popup .month-view .month:active,.popup .month-view .month.selected{background-color:#575195;color:#ffffff}.popup.user-is-tabbing button:focus,.popup.user-is-tabbing .title-box:focus,.popup.user-is-tabbing .date-cell:focus,.popup.user-is-tabbing .month:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;border:none;z-index:11}.popup.user-is-tabbing button:focus::-moz-focus-inner,.popup.user-is-tabbing .title-box:focus::-moz-focus-inner,.popup.user-is-tabbing .date-cell:focus::-moz-focus-inner,.popup.user-is-tabbing .month:focus::-moz-focus-inner{border:0}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}';const d=class{constructor(s){t(this,s);this.cellTriggered=e(this,"cellTriggered",7);this.toggleButtonClicked=e(this,"toggleButtonClicked",7);this.popupClosed=e(this,"popupClosed",7);this.popupBlurred=e(this,"popupBlurred",7);this.popupClicked=true;this.buttonClicked=true;this.prevClicked=true;this.nextClicked=true;this.openUp=false;this.calendar_months=[a.formatMessage({id:"date.january",defaultMessage:"January",description:"Month of the year"}),a.formatMessage({id:"date.february",defaultMessage:"February",description:"Month of the year"}),a.formatMessage({id:"date.march",defaultMessage:"March",description:"Month of the year"}),a.formatMessage({id:"date.april",defaultMessage:"April",description:"Month of the year"}),a.formatMessage({id:"date.may",defaultMessage:"May",description:"Month of the year"}),a.formatMessage({id:"date.june",defaultMessage:"June",description:"Month of the year"}),a.formatMessage({id:"date.july",defaultMessage:"July",description:"Month of the year"}),a.formatMessage({id:"date.august",defaultMessage:"August",description:"Month of the year"}),a.formatMessage({id:"date.september",defaultMessage:"September",description:"Month of the year"}),a.formatMessage({id:"date.october",defaultMessage:"October",description:"Month of the year"}),a.formatMessage({id:"date.november",defaultMessage:"November",description:"Month of the year"}),a.formatMessage({id:"date.december",defaultMessage:"December",description:"Month of the year"})];this.weekdays=[a.formatMessage({id:"date.sunday",defaultMessage:"Sunday"}),a.formatMessage({id:"date.monday",defaultMessage:"Monday"}),a.formatMessage({id:"date.tuesday",defaultMessage:"Tuesday"}),a.formatMessage({id:"date.wednesday",defaultMessage:"Wednesday"}),a.formatMessage({id:"date.thursday",defaultMessage:"Thursday"}),a.formatMessage({id:"date.friday",defaultMessage:"Friday"}),a.formatMessage({id:"date.saturday",defaultMessage:"Saturday"})];this.renderCalendarDate=(t,e)=>{let s=this.removeZeroes(String(t[1]));let o=this.removeZeroes(String(t[2]));let r=s===this.monthInFocus?"current-month":"";const n=t[0]+t[1]+t[2];const h=this.isDateToday(t);return i("div",{role:"gridcell",id:`cell-${n}-${this.parentId}`,class:`date-cell ${r}`,"aria-selected":false,"aria-label":`${h?`${a.formatMessage({id:"date.today",defaultMessage:"today",description:"calendar button"})}, `:""}${this.weekdays[e]}, ${this.calendar_months[s-1]} ${o}, ${t[0]}`,onClick:t=>{this.handleTriggeredDate(t.target)},onKeyDown:t=>this.trapFocusEnd(t),"data-month":t[1],"data-year":t[0],onBlur:t=>t.stopPropagation()},o)};this.disabled=false;this.isExpanded=false;this.view="day";this.date=new Date;this.selectedYear=this.date.getUTCFullYear();this.selectedMonth=this.date.getUTCMonth()+1;this.selectedDay=this.date.getUTCDate();this.monthInFocus=this.selectedMonth;this.yearInFocus=this.selectedYear;this.dayInFocus=this.selectedDay;this.monthNumInFocus=this.selectedMonth;this.parentId="";this.isTabbing=false}handleKey(t){this.prevClicked=false;this.nextClicked=false;switch(t.key){case"Enter":t.preventDefault();!t.target.id.includes("popup-title")&&t.target.click();break;case"Escape":t.preventDefault();if(this.isExpanded){t.stopPropagation();this.closePopup(true)}break;case"PageUp":t.preventDefault();this.backOneMonth();break;case"PageDown":t.preventDefault();this.forwardOneMonth();break;case"Home":t.preventDefault();this.unfocusCell();this.dayInFocus=1;s(this.el);break;case"End":t.preventDefault();this.unfocusCell();this.dayInFocus=this.getMonthDays(this.monthInFocus,this.yearInFocus);s(this.el);break;case"ArrowLeft":t.preventDefault();if(this.view==="day"){this.unfocusCell();if(this.dayInFocus===1){const t=this.getPreviousMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;this.dayInFocus=this.getMonthDays(this.monthInFocus,this.yearInFocus)}else{this.dayInFocus-=1}}else{this.unfocusMonth();if(this.monthNumInFocus===0){this.monthNumInFocus=11}else{this.monthNumInFocus-=1}}break;case"ArrowRight":t.preventDefault();if(this.view==="day"){this.unfocusCell();if(this.dayInFocus===this.getMonthDays(this.monthInFocus,this.yearInFocus)){const t=this.getNextMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;this.dayInFocus=1}else{this.dayInFocus+=1}}else{this.unfocusMonth();if(this.monthNumInFocus===11){this.monthNumInFocus=0}else{this.monthNumInFocus+=1}}break;case"ArrowUp":t.preventDefault();if(this.view==="day"){this.unfocusCell();if(this.dayInFocus<8){const t=this.getPreviousMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;const e=7-this.dayInFocus;this.dayInFocus=this.getMonthDays(this.monthInFocus,this.yearInFocus)-e}else{this.dayInFocus-=7}}else{this.unfocusMonth();if(this.monthNumInFocus<3){this.monthNumInFocus+=9}else{this.monthNumInFocus-=3}}break;case"ArrowDown":t.preventDefault();if(!this.isExpanded){this.openPopup()}else{if(this.view==="day"){if(!(document.activeElement.shadowRoot||document).activeElement.classList.contains("date-cell")){this.focusCell();break}this.unfocusCell();const t=this.getMonthDays(this.monthInFocus,this.yearInFocus)-7;if(this.dayInFocus>t){const e=this.getNextMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=e.month;this.yearInFocus=e.year;this.dayInFocus=this.dayInFocus-t}else{this.dayInFocus+=7}}else{const t=(document.activeElement.shadowRoot||document).activeElement;if(t.tagName==="BUTTON"||t.id.includes("popup-title-year")){this.focusMonth();break}this.unfocusMonth();if(this.monthNumInFocus>8){this.monthNumInFocus-=9}else{this.monthNumInFocus+=3}}}break}}toggleTabbingOn(t){const e=["Tab","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Enter"];if(e.includes(t.key)){this.isTabbing=true}}toggleTabbingOff(){this.isTabbing=false}blurHandler(t){if(!this.popupClicked&&!this.buttonClicked&&this.isExpanded){this.closePopup();this.popupBlurred.emit({relatedTarget:t.target})}this.popupClicked=false;this.buttonClicked=false}handleBlurOnWindow(t){if(this.isExpanded){this.closePopup();this.popupBlurred.emit({relatedTarget:t.target})}}componentDidUpdate(){this.handleSelectedDate();if(this.isExpanded){this.prevClicked?this.prevButton.focus():this.nextClicked?this.nextButton.focus():this.view==="day"?this.focusCell():this.focusMonth()}}componentDidLoad(){this.handleSelectedDate();this.setDateValuesForView()}zeroPad(t,e){if(!String.prototype.padStart){String.prototype.padStart=function t(e,i){e=e-this.length;if(e>i.length){i+=i.repeat(e/i.length)}return i.slice(0,e)+String(this)}}return`${t.toString()}`.padStart(e,"0")}removeZeroes(t){return+t<10?+t.slice(1):+t}isDateToday(t){const e=new Date;const i=[e.getFullYear().toString(),(e.getMonth()+1).toString(),e.getDate().toString()];return i.reduce(((e,i,s)=>e&&this.removeZeroes(t[s]).toString()===i),true)}togglePopup(){this.isExpanded?this.closePopup():this.openPopup();this.buttonClicked=true}closePopup(t=false){this.isExpanded=false;this.popupEl.classList.remove("open");window.setTimeout((()=>{this.popupEl.style.visibility="hidden"}),250);if(this.view==="day"){this.unfocusCell()}this.monthInFocus=this.selectedMonth;this.yearInFocus=this.selectedYear;this.dayInFocus=this.selectedDay;this.changeView("day");if(t){this.buttonEl.focus()}}openPopup(){this.panelPosition();this.setDateValuesForView();this.prevClicked=false;this.nextClicked=false;this.popupEl.style.visibility="visible";window.requestAnimationFrame((()=>{this.popupEl.classList.add("open")}));this.isExpanded=true;this.focusCell()}getMonthDays(t,e){const i=[4,6,9,11];const s=e%4===0;return t===2?s?29:28:i.includes(t)?30:31}getMonthFirstDay(t,e){return+new Date(e,t-1,1,12,0,0).getDay()+1}getPreviousMonth(t,e){const i=t>1?t-1:12;const s=t>1?e:e-1;return{month:i,year:s}}getNextMonth(t,e){const i=t<12?t+1:1;const s=t<12?e:e+1;return{month:i,year:s}}getCalendarDates(t,e){const i=this.getMonthDays(t,e);const s=this.getMonthFirstDay(t,e);const o=s-1;let a=42-(o+i);a=a>6?a-7:a;const{month:r,year:n}=this.getPreviousMonth(t,e);const{month:h,year:d}=this.getNextMonth(t,e);const l=this.getMonthDays(r,n);const p=[...new Array(o).fill("1")].map(((t,e)=>{const i=e+1+(l-o);return[n.toString(),this.zeroPad(r,2),this.zeroPad(i,2)]}));const c=[...new Array(i).fill("1")].map(((i,s)=>{const o=s+1;return[e.toString(),this.zeroPad(t,2),this.zeroPad(o,2)]}));const u=[...new Array(a).fill("1")].map(((t,e)=>{const i=e+1;return[d.toString(),this.zeroPad(h,2),this.zeroPad(i,2)]}));return[...p,...c,...u]}forwardOneMonth(){this.unfocusCell();const t=this.getNextMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;const e=this.getMonthDays(this.monthInFocus,this.yearInFocus);if(this.dayInFocus>this.getMonthDays(this.monthInFocus,this.yearInFocus)){this.dayInFocus=e}this.updateLiveRegion(`Displaying ${this.calendar_months[this.monthInFocus-1]}, ${this.yearInFocus}`)}backOneMonth(){this.unfocusCell();const t=this.getPreviousMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;const e=this.getMonthDays(this.monthInFocus,this.yearInFocus);if(this.dayInFocus>this.getMonthDays(this.monthInFocus,this.yearInFocus)){this.dayInFocus=e}this.updateLiveRegion(`Viewing ${this.calendar_months[this.monthInFocus-1]}, ${this.yearInFocus}`)}handleTriggeredDate(t){this.cellTriggered.emit(t);this.closePopup(true)}handleSelectedDate(){if(this.selectedDate){this.selectedDate.removeAttribute("aria-selected")}this.selectedDate=this.getCellById(this.selectedYear,this.selectedMonth,this.selectedDay);if(this.selectedDate){this.selectedDate.setAttribute("aria-selected","true")}}getCellById(t,e,i){const s=t+this.zeroPad(e,2)+this.zeroPad(i,2);return this.el.querySelector(`#cell-${s}-${this.parentId}`)}unfocusCell(){const t=this.getCellById(this.yearInFocus,this.monthInFocus,this.dayInFocus);t.tabIndex=-1}focusCell(){const t=this.getMonthDays(this.monthInFocus,this.yearInFocus);this.dayInFocus=this.dayInFocus>t?t:this.dayInFocus;const e=this.getCellById(this.yearInFocus,this.monthInFocus,this.dayInFocus);if(e){e.tabIndex=0;e.focus()}}unfocusMonth(){const t=this.el.querySelector(`#month-${this.monthNumInFocus}-${this.parentId}`);t.tabIndex=-1}focusMonth(){const t=this.el.querySelector(`#month-${this.monthNumInFocus}-${this.parentId}`);t.tabIndex=0;t.focus()}trapFocusLeft(t){if(t.shiftKey&&t.key==="Tab"){t.preventDefault();this.focusCellInView()}}trapFocusEnd(t){if(!t.shiftKey&&t.key==="Tab"){t.preventDefault();this.prevButton.focus()}}trapFocusRight(t){if(!t.shiftKey&&t.key==="Tab"){t.preventDefault();this.focusCellInView()}}focusCellInView(){if(this.view==="day"){this.focusCell()}else{this.focusMonth()}}toggleBusyAttribute(t){this.el.querySelector("#wm-container").setAttribute("aria-busy",t)}setDateValuesForView(){this.selectedYear=this.date.getUTCFullYear();this.selectedMonth=this.date.getUTCMonth()+1;this.selectedDay=this.date.getUTCDate();this.monthInFocus=this.selectedMonth;this.yearInFocus=this.selectedYear;this.dayInFocus=this.selectedDay;this.monthNumInFocus=this.selectedMonth-1}updateLiveRegion(t){let e=this.el.querySelector("#live-region");e.innerHTML=t}panelPosition(){let t=document.getElementById(this.parentId);const e=t.shadowRoot.querySelector(".label-wrapper").clientHeight;this.openUp=r(t,this.popupEl,e);if(n(t,336)){this.popupEl.style.left="0";this.popupEl.style.right="auto"}else{this.popupEl.style.right="0";this.popupEl.style.left="auto"}}changeView(t){this.view=t;this.monthNumInFocus=this.monthInFocus-1}renderMonths(t,e){return i("div",{id:`month-${e}-${this.parentId}`,class:`month ${this.selectedMonth-1===e?"selected":""}`,role:"gridcell",tabindex:e+1===this.monthInFocus?0:-1,onKeyDown:t=>this.trapFocusEnd(t),onBlur:t=>t.stopPropagation(),onClick:()=>{this.monthInFocus=e+1;this.changeView("day")}},t)}render(){const t=this.getCalendarDates(this.monthInFocus,this.yearInFocus);return i("div",{class:"container",id:"wm-container"},i("button",{disabled:this.disabled,onClick:this.togglePopup.bind(this),"aria-describedby":`date-input-${this.parentId}`,ref:t=>this.buttonEl=t,"aria-expanded":`${this.isExpanded}`,class:"toggle",id:`toggle-${this.parentId}`},i("span",{class:"calendar",title:a.formatMessage({id:"date.calendarView",defaultMessage:"Calendar View",description:"Calendar button"})})),i("div",{class:`popup ${this.view}-view ${this.openUp?"expand-upwards":""} ${this.isTabbing?"user-is-tabbing":""}`,id:`popup-${this.parentId}`,ref:t=>this.popupEl=t,onClick:()=>this.popupClicked=true,role:"application","aria-describedby":"application"},this.view==="day"?i("div",{class:"day-view"},i("div",{class:"calendar-header"},i("button",{onClick:()=>{this.prevClicked=true;this.popupClicked=true;this.backOneMonth()},onKeyDown:t=>this.trapFocusLeft(t),ref:t=>this.prevButton=t,class:"arw-btn","aria-label":a.formatMessage({id:"date.selectPreviousMonth",defaultMessage:"Select previous month",description:"Calendar button"})},i("span",{class:"mdi"},"")),i("div",{id:`popup-title-month-${this.parentId}`,class:"title-box",tabindex:0,role:"button",onKeyDown:t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();this.changeView("month")}},onClick:this.changeView.bind(this,"month"),"aria-label":`${a.formatMessage({id:"date.currentMonth",defaultMessage:"current month",description:"Calendar button"})}: ${this.calendar_months[this.monthInFocus-1]}\n                  ${this.yearInFocus}.`,"aria-describedby":"month-title"},i("span",{class:"title","aria-hidden":"true"},this.calendar_months[this.monthInFocus-1]," ",this.yearInFocus)),i("button",{onClick:()=>{this.nextClicked=true;this.popupClicked=true;this.forwardOneMonth()},onKeyDown:t=>this.trapFocusRight(t),"aria-label":a.formatMessage({id:"date.selectNextMonth",defaultMessage:"Select next month",description:"Calendar button"}),ref:t=>this.nextButton=t,class:"arw-btn"},i("span",{class:"mdi"},""))),i("div",{"aria-labelledby":`popup-title-month-${this.parentId}`,role:"grid",class:"date-grid"},i("div",{role:"rowgroup",class:"date-header"},i("div",{role:"row",class:"header-row"},i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.su",defaultMessage:"Su",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.mo",defaultMessage:"Mo",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.tu",defaultMessage:"Tu",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.we",defaultMessage:"We",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.th",defaultMessage:"Th",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.fr",defaultMessage:"Fr",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.sa",defaultMessage:"Sa",description:"Abbreviated day of the week"}))))),i("div",{role:"rowgroup"},i("div",{role:"row",class:"date-row"},t.slice(0,7).map(((t,e)=>this.renderCalendarDate(t,e)))),i("div",{role:"row"},t.slice(7,14).map(((t,e)=>this.renderCalendarDate(t,e)))),i("div",{role:"row"},t.slice(14,21).map(((t,e)=>this.renderCalendarDate(t,e)))),i("div",{role:"row"},t.slice(21,28).map(((t,e)=>this.renderCalendarDate(t,e)))),i("div",{role:"row"},t.slice(28,35).map(((t,e)=>this.renderCalendarDate(t,e)))),t.length>35?i("div",{role:"row"},t.slice(35).map(((t,e)=>this.renderCalendarDate(t,e)))):""))):i("div",{class:"month-view"},i("div",{class:"calendar-header"},i("button",{onClick:()=>{this.prevClicked=true;this.popupClicked=true;this.yearInFocus-=1;this.updateLiveRegion(`${this.yearInFocus} selected.`)},onKeyDown:t=>this.trapFocusLeft(t),"aria-label":a.formatMessage({id:"date.selectPreviousYear",defaultMessage:"Select previous year",description:"Calendar button"}),ref:t=>this.prevButton=t,class:"arw-btn"},i("span",{class:"mdi"},"")),i("div",{id:`popup-title-year-${this.parentId}`,tabindex:0,class:"title-box year",role:"button",onClick:this.changeView.bind(this,"day"),onKeyDown:t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();this.changeView("day")}},"aria-labelledby":"year-title"},i("span",{class:"title"},this.yearInFocus)),i("button",{onClick:()=>{this.nextClicked=true;this.popupClicked=true;this.yearInFocus+=1;this.updateLiveRegion(`${this.yearInFocus} selected.`)},"aria-label":a.formatMessage({id:"date.selectNextYear",defaultMessage:"Select next year",description:"Calendar button"}),onKeyDown:t=>this.trapFocusRight(t),ref:t=>this.nextButton=t,class:"arw-btn"},i("span",{class:"mdi"},""))),i("div",{"aria-labelledby":`popup-title-year-${this.parentId}`,role:"grid",class:"months"},i("div",{role:"row",class:"month-row"},this.calendar_months.slice(0,3).map(((t,e)=>this.renderMonths(t,e)))),i("div",{role:"row",class:"month-row"},this.calendar_months.slice(3,6).map(((t,e)=>this.renderMonths(t,e+3)))),i("div",{role:"row",class:"month-row"},this.calendar_months.slice(6,9).map(((t,e)=>this.renderMonths(t,e+6)))),i("div",{role:"row",class:"month-row"},this.calendar_months.slice(9).map(((t,e)=>this.renderMonths(t,e+9))))))),this.isExpanded&&i("div",{id:"live-region","aria-live":"polite","aria-relevant":"text",class:"sr-only"}),i("div",{id:"month-title",class:"sr-only"},a.formatMessage({id:"date.selectMonth",defaultMessage:"Activate to select a month.",description:"Calendar button"})),i("div",{id:"year-title",class:"sr-only"},a.formatMessage({id:"date.selectYear",defaultMessage:"Activate to select a year.",description:"Calendar button"})),i("div",{id:"application",class:"sr-only"},a.formatMessage({id:"date.instructions",defaultMessage:"Use arrows to select a date in the table. Tab left or right to buttons for selecting previous month, next month, or the month selection table."})))}get el(){return o(this)}};d.style=h;export{d as priv_datepicker};
-//# sourceMappingURL=p-c5a50724.entry.js.map
+import{r as t,c as e,h as i,f as s,g as o}from"./p-1c23de4a.js";import{i as a,m as r,x as n}from"./p-edfba0e1.js";const h='.toggle{all:unset;cursor:pointer;padding:0 0.375rem;height:2.375rem;border:none;-moz-border-top-right-radius:3px;-webkit-border-top-right-radius:3px;border-top-right-radius:3px;-moz-border-bottom-right-radius:3px;-webkit-border-bottom-right-radius:3px;border-bottom-right-radius:3px;-moz-border-top-left-radius:0;-webkit-border-top-left-radius:0;border-top-left-radius:0;-moz-border-bottom-left-radius:0;-webkit-border-bottom-left-radius:0;border-bottom-left-radius:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background-color:#fff}.toggle:disabled{pointer-events:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background-color:rgba(74, 74, 74, 0.05)}.toggle:disabled .calendar::after{color:#7b7b7b}.toggle:hover{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background:#e6e6e6}.toggle:hover .calendar::after{color:#575195}[dir=RTL] .toggle{right:auto;left:0}.toggle span::after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f0ed";font-size:1.5rem;color:#575195;padding:0;line-height:2.5rem}.toggle:focus{outline:none}.toggle::-moz-focus-inner{border:0}.user-is-tabbing .toggle:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}.user-is-tabbing .toggle:focus::-moz-focus-inner{border:0}.popup{visibility:hidden;font-family:inherit;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;-webkit-box-shadow:0px 4px 15px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow:0px 4px 15px 0px rgba(0, 0, 0, 0.2);box-shadow:0px 4px 15px 0px rgba(0, 0, 0, 0.2);width:21rem;z-index:10;position:absolute;left:0;top:40px;min-height:21.0625rem;-webkit-transition:-webkit-transform 0.25s ease;transition:-webkit-transform 0.25s ease;transition:transform 0.25s ease;transition:transform 0.25s ease, -webkit-transform 0.25s ease;-webkit-transform-origin:center top;transform-origin:center top;-webkit-transform:scale(1, 0);transform:scale(1, 0);background-color:#fff}.popup.open{-webkit-transform:scale(1, 1);transform:scale(1, 1)}.popup.expand-upwards{top:auto;bottom:2.375rem;-webkit-transform-origin:center bottom;transform-origin:center bottom}.popup .calendar-header{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;position:relative;padding:0.9375rem 0.25rem}.popup .calendar-header .title-box{height:2.625rem;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;border:1px solid;font-weight:500;font-size:0.875rem;background:transparent;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;padding:0 0.375rem 0 0.75rem;border-color:#575195;color:#575195}.popup .calendar-header .title-box:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f140";padding-left:0.75rem}.popup .calendar-header .title-box.year:after{content:"\\f143"}.popup .calendar-header .title-box::-moz-focus-inner{border:0}.popup .calendar-header .title-box:focus{outline:none}.popup .calendar-header .arw-btn{cursor:pointer;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;width:2.75rem;height:2.75rem;border:none;color:#575195;background:transparent;padding:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;line-height:2.75rem}.popup .calendar-header .arw-btn .mdi{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:1.5rem;font-weight:normal;line-height:2.75rem}.popup .calendar-header .arw-btn .mdi:hover{background-color:#efeef1}.popup .calendar-header .arw-btn:focus{outline:none}.popup .calendar-header .arw-btn:active{-ms-transform:scale(0.9, 0.9);-webkit-transform:scale(0.9, 0.9);-moz-transform:scale(0.9, 0.9);transform:scale(0.9, 0.9);background-color:#d7d6d9}.popup .day-view{min-width:100%}.popup .day-view .date-grid{width:100%;text-align:center;border-collapse:collapse;margin-bottom:0.4375rem;color:#757575}.popup .day-view .date-grid .date-row:first-child .date-cell{margin-top:0.125rem}.popup .day-view .date-grid .date-header{background-color:#eeedf4}.popup .day-view .date-grid .header-cell{height:2.0625rem;line-height:2.0625rem;width:2.75rem;margin:0 calc((14.28% - 44px) / 2);padding:0;display:inline-block;font-size:0.8125rem;font-weight:bold;color:#4a4a4a;border:none}.popup .day-view .date-grid .date-cell{cursor:pointer;display:inline-block;padding:0;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;height:2.75rem;width:2.75rem;margin:0 calc((14.28% - 44px) / 2);font-size:0.875rem;font-weight:500;line-height:2.75rem}.popup .day-view .date-grid .date-cell:focus{outline:none}.popup .day-view .date-grid .date-cell:hover{background-color:#efeef1}.popup .day-view .date-grid .date-cell:active{background-color:#575195;color:#ffffff}.popup .day-view .date-grid .date-cell.current-month{color:#4a4a4a}.popup .day-view .date-grid .date-cell.current-month[aria-selected=true]{background-color:#575195;color:#ffffff}.popup .month-view .months{border-top:2px solid;border-top-color:#eeedf4;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.popup .month-view .month-row{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;width:100%;border-bottom:2px solid;border-bottom-color:#eeedf4}.popup .month-view .month{cursor:pointer;text-align:center;width:100%;height:4rem;line-height:4rem;font-weight:500;color:#575195}.popup .month-view .month:not(:last-child){border-right:2px solid;border-right-color:#eeedf4}.popup .month-view .month:focus{outline:none}.popup .month-view .month:hover{background-color:#efeef1}.popup .month-view .month:active,.popup .month-view .month.selected{background-color:#575195;color:#ffffff}.popup.user-is-tabbing button:focus,.popup.user-is-tabbing .title-box:focus,.popup.user-is-tabbing .date-cell:focus,.popup.user-is-tabbing .month:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;border:none;z-index:11}.popup.user-is-tabbing button:focus::-moz-focus-inner,.popup.user-is-tabbing .title-box:focus::-moz-focus-inner,.popup.user-is-tabbing .date-cell:focus::-moz-focus-inner,.popup.user-is-tabbing .month:focus::-moz-focus-inner{border:0}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}';const d=class{constructor(s){t(this,s);this.cellTriggered=e(this,"cellTriggered",7);this.toggleButtonClicked=e(this,"toggleButtonClicked",7);this.popupClosed=e(this,"popupClosed",7);this.popupBlurred=e(this,"popupBlurred",7);this.popupClicked=true;this.buttonClicked=true;this.prevClicked=true;this.nextClicked=true;this.openUp=false;this.calendar_months=[a.formatMessage({id:"date.january",defaultMessage:"January",description:"Month of the year"}),a.formatMessage({id:"date.february",defaultMessage:"February",description:"Month of the year"}),a.formatMessage({id:"date.march",defaultMessage:"March",description:"Month of the year"}),a.formatMessage({id:"date.april",defaultMessage:"April",description:"Month of the year"}),a.formatMessage({id:"date.may",defaultMessage:"May",description:"Month of the year"}),a.formatMessage({id:"date.june",defaultMessage:"June",description:"Month of the year"}),a.formatMessage({id:"date.july",defaultMessage:"July",description:"Month of the year"}),a.formatMessage({id:"date.august",defaultMessage:"August",description:"Month of the year"}),a.formatMessage({id:"date.september",defaultMessage:"September",description:"Month of the year"}),a.formatMessage({id:"date.october",defaultMessage:"October",description:"Month of the year"}),a.formatMessage({id:"date.november",defaultMessage:"November",description:"Month of the year"}),a.formatMessage({id:"date.december",defaultMessage:"December",description:"Month of the year"})];this.weekdays=[a.formatMessage({id:"date.sunday",defaultMessage:"Sunday"}),a.formatMessage({id:"date.monday",defaultMessage:"Monday"}),a.formatMessage({id:"date.tuesday",defaultMessage:"Tuesday"}),a.formatMessage({id:"date.wednesday",defaultMessage:"Wednesday"}),a.formatMessage({id:"date.thursday",defaultMessage:"Thursday"}),a.formatMessage({id:"date.friday",defaultMessage:"Friday"}),a.formatMessage({id:"date.saturday",defaultMessage:"Saturday"})];this.renderCalendarDate=(t,e)=>{let s=this.removeZeroes(String(t[1]));let o=this.removeZeroes(String(t[2]));let r=s===this.monthInFocus?"current-month":"";const n=t[0]+t[1]+t[2];const h=this.isDateToday(t);return i("div",{role:"gridcell",id:`cell-${n}-${this.parentId}`,class:`date-cell ${r}`,"aria-selected":false,"aria-label":`${h?`${a.formatMessage({id:"date.today",defaultMessage:"today",description:"calendar button"})}, `:""}${this.weekdays[e]}, ${this.calendar_months[s-1]} ${o}, ${t[0]}`,onClick:t=>{this.handleTriggeredDate(t.target)},onKeyDown:t=>this.trapFocusEnd(t),"data-month":t[1],"data-year":t[0],onBlur:t=>t.stopPropagation()},o)};this.disabled=false;this.isExpanded=false;this.view="day";this.date=new Date;this.selectedYear=this.date.getUTCFullYear();this.selectedMonth=this.date.getUTCMonth()+1;this.selectedDay=this.date.getUTCDate();this.monthInFocus=this.selectedMonth;this.yearInFocus=this.selectedYear;this.dayInFocus=this.selectedDay;this.monthNumInFocus=this.selectedMonth;this.parentId="";this.isTabbing=false}handleKey(t){this.prevClicked=false;this.nextClicked=false;switch(t.key){case"Enter":t.preventDefault();!t.target.id.includes("popup-title")&&t.target.click();break;case"Escape":t.preventDefault();if(this.isExpanded){t.stopPropagation();this.closePopup(true)}break;case"PageUp":t.preventDefault();this.backOneMonth();break;case"PageDown":t.preventDefault();this.forwardOneMonth();break;case"Home":t.preventDefault();this.unfocusCell();this.dayInFocus=1;s(this.el);break;case"End":t.preventDefault();this.unfocusCell();this.dayInFocus=this.getMonthDays(this.monthInFocus,this.yearInFocus);s(this.el);break;case"ArrowLeft":t.preventDefault();if(this.view==="day"){this.unfocusCell();if(this.dayInFocus===1){const t=this.getPreviousMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;this.dayInFocus=this.getMonthDays(this.monthInFocus,this.yearInFocus)}else{this.dayInFocus-=1}}else{this.unfocusMonth();if(this.monthNumInFocus===0){this.monthNumInFocus=11}else{this.monthNumInFocus-=1}}break;case"ArrowRight":t.preventDefault();if(this.view==="day"){this.unfocusCell();if(this.dayInFocus===this.getMonthDays(this.monthInFocus,this.yearInFocus)){const t=this.getNextMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;this.dayInFocus=1}else{this.dayInFocus+=1}}else{this.unfocusMonth();if(this.monthNumInFocus===11){this.monthNumInFocus=0}else{this.monthNumInFocus+=1}}break;case"ArrowUp":t.preventDefault();if(this.view==="day"){this.unfocusCell();if(this.dayInFocus<8){const t=this.getPreviousMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;const e=7-this.dayInFocus;this.dayInFocus=this.getMonthDays(this.monthInFocus,this.yearInFocus)-e}else{this.dayInFocus-=7}}else{this.unfocusMonth();if(this.monthNumInFocus<3){this.monthNumInFocus+=9}else{this.monthNumInFocus-=3}}break;case"ArrowDown":t.preventDefault();if(!this.isExpanded){this.openPopup()}else{if(this.view==="day"){if(!(document.activeElement.shadowRoot||document).activeElement.classList.contains("date-cell")){this.focusCell();break}this.unfocusCell();const t=this.getMonthDays(this.monthInFocus,this.yearInFocus)-7;if(this.dayInFocus>t){const e=this.getNextMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=e.month;this.yearInFocus=e.year;this.dayInFocus=this.dayInFocus-t}else{this.dayInFocus+=7}}else{const t=(document.activeElement.shadowRoot||document).activeElement;if(t.tagName==="BUTTON"||t.id.includes("popup-title-year")){this.focusMonth();break}this.unfocusMonth();if(this.monthNumInFocus>8){this.monthNumInFocus-=9}else{this.monthNumInFocus+=3}}}break}}toggleTabbingOn(t){const e=["Tab","ArrowUp","ArrowDown","ArrowLeft","ArrowRight","Enter"];if(e.includes(t.key)){this.isTabbing=true}}toggleTabbingOff(){this.isTabbing=false}blurHandler(t){if(!this.popupClicked&&!this.buttonClicked&&this.isExpanded){this.closePopup();this.popupBlurred.emit({relatedTarget:t.target})}this.popupClicked=false;this.buttonClicked=false}handleBlurOnWindow(t){if(this.isExpanded){this.closePopup();this.popupBlurred.emit({relatedTarget:t.target})}}componentDidUpdate(){this.handleSelectedDate();if(this.isExpanded){this.prevClicked?this.prevButton.focus():this.nextClicked?this.nextButton.focus():this.view==="day"?this.focusCell():this.focusMonth()}}componentDidLoad(){this.handleSelectedDate();this.setDateValuesForView()}zeroPad(t,e){if(!String.prototype.padStart){String.prototype.padStart=function t(e,i){e=e-this.length;if(e>i.length){i+=i.repeat(e/i.length)}return i.slice(0,e)+String(this)}}return`${t.toString()}`.padStart(e,"0")}removeZeroes(t){return+t<10?+t.slice(1):+t}isDateToday(t){const e=new Date;const i=[e.getFullYear().toString(),(e.getMonth()+1).toString(),e.getDate().toString()];return i.reduce(((e,i,s)=>e&&this.removeZeroes(t[s]).toString()===i),true)}togglePopup(){this.isExpanded?this.closePopup():this.openPopup();this.buttonClicked=true}closePopup(t=false){this.isExpanded=false;this.popupEl.classList.remove("open");window.setTimeout((()=>{this.popupEl.style.visibility="hidden"}),250);if(this.view==="day"){this.unfocusCell()}this.monthInFocus=this.selectedMonth;this.yearInFocus=this.selectedYear;this.dayInFocus=this.selectedDay;this.changeView("day");if(t){this.buttonEl.focus()}}openPopup(){this.panelPosition();this.setDateValuesForView();this.prevClicked=false;this.nextClicked=false;this.popupEl.style.visibility="visible";window.requestAnimationFrame((()=>{this.popupEl.classList.add("open")}));this.isExpanded=true;this.focusCell()}getMonthDays(t,e){const i=[4,6,9,11];const s=e%4===0;return t===2?s?29:28:i.includes(t)?30:31}getMonthFirstDay(t,e){return+new Date(e,t-1,1,12,0,0).getDay()+1}getPreviousMonth(t,e){const i=t>1?t-1:12;const s=t>1?e:e-1;return{month:i,year:s}}getNextMonth(t,e){const i=t<12?t+1:1;const s=t<12?e:e+1;return{month:i,year:s}}getCalendarDates(t,e){const i=this.getMonthDays(t,e);const s=this.getMonthFirstDay(t,e);const o=s-1;let a=42-(o+i);a=a>6?a-7:a;const{month:r,year:n}=this.getPreviousMonth(t,e);const{month:h,year:d}=this.getNextMonth(t,e);const l=this.getMonthDays(r,n);const p=[...new Array(o).fill("1")].map(((t,e)=>{const i=e+1+(l-o);return[n.toString(),this.zeroPad(r,2),this.zeroPad(i,2)]}));const c=[...new Array(i).fill("1")].map(((i,s)=>{const o=s+1;return[e.toString(),this.zeroPad(t,2),this.zeroPad(o,2)]}));const u=[...new Array(a).fill("1")].map(((t,e)=>{const i=e+1;return[d.toString(),this.zeroPad(h,2),this.zeroPad(i,2)]}));return[...p,...c,...u]}forwardOneMonth(){this.unfocusCell();const t=this.getNextMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;const e=this.getMonthDays(this.monthInFocus,this.yearInFocus);if(this.dayInFocus>this.getMonthDays(this.monthInFocus,this.yearInFocus)){this.dayInFocus=e}this.updateLiveRegion(`Displaying ${this.calendar_months[this.monthInFocus-1]}, ${this.yearInFocus}`)}backOneMonth(){this.unfocusCell();const t=this.getPreviousMonth(this.monthInFocus,this.yearInFocus);this.monthInFocus=t.month;this.yearInFocus=t.year;const e=this.getMonthDays(this.monthInFocus,this.yearInFocus);if(this.dayInFocus>this.getMonthDays(this.monthInFocus,this.yearInFocus)){this.dayInFocus=e}this.updateLiveRegion(`Viewing ${this.calendar_months[this.monthInFocus-1]}, ${this.yearInFocus}`)}handleTriggeredDate(t){this.cellTriggered.emit(t);this.closePopup(true)}handleSelectedDate(){if(this.selectedDate){this.selectedDate.removeAttribute("aria-selected")}this.selectedDate=this.getCellById(this.selectedYear,this.selectedMonth,this.selectedDay);if(this.selectedDate){this.selectedDate.setAttribute("aria-selected","true")}}getCellById(t,e,i){const s=t+this.zeroPad(e,2)+this.zeroPad(i,2);return this.el.querySelector(`#cell-${s}-${this.parentId}`)}unfocusCell(){const t=this.getCellById(this.yearInFocus,this.monthInFocus,this.dayInFocus);t.tabIndex=-1}focusCell(){const t=this.getMonthDays(this.monthInFocus,this.yearInFocus);this.dayInFocus=this.dayInFocus>t?t:this.dayInFocus;const e=this.getCellById(this.yearInFocus,this.monthInFocus,this.dayInFocus);if(e){e.tabIndex=0;e.focus()}}unfocusMonth(){const t=this.el.querySelector(`#month-${this.monthNumInFocus}-${this.parentId}`);t.tabIndex=-1}focusMonth(){const t=this.el.querySelector(`#month-${this.monthNumInFocus}-${this.parentId}`);t.tabIndex=0;t.focus()}trapFocusLeft(t){if(t.shiftKey&&t.key==="Tab"){t.preventDefault();this.focusCellInView()}}trapFocusEnd(t){if(!t.shiftKey&&t.key==="Tab"){t.preventDefault();this.prevButton.focus()}}trapFocusRight(t){if(!t.shiftKey&&t.key==="Tab"){t.preventDefault();this.focusCellInView()}}focusCellInView(){if(this.view==="day"){this.focusCell()}else{this.focusMonth()}}toggleBusyAttribute(t){this.el.querySelector("#wm-container").setAttribute("aria-busy",t)}setDateValuesForView(){this.selectedYear=this.date.getUTCFullYear();this.selectedMonth=this.date.getUTCMonth()+1;this.selectedDay=this.date.getUTCDate();this.monthInFocus=this.selectedMonth;this.yearInFocus=this.selectedYear;this.dayInFocus=this.selectedDay;this.monthNumInFocus=this.selectedMonth-1}updateLiveRegion(t){let e=this.el.querySelector("#live-region");e.innerHTML=t}panelPosition(){let t=document.getElementById(this.parentId);const e=t.shadowRoot.querySelector(".label-wrapper").clientHeight;this.openUp=r(t,this.popupEl,e);if(n(t,336)){this.popupEl.style.left="0";this.popupEl.style.right="auto"}else{this.popupEl.style.right="0";this.popupEl.style.left="auto"}}changeView(t){this.view=t;this.monthNumInFocus=this.monthInFocus-1}renderMonths(t,e){return i("div",{id:`month-${e}-${this.parentId}`,class:`month ${this.selectedMonth-1===e?"selected":""}`,role:"gridcell",tabindex:e+1===this.monthInFocus?0:-1,onKeyDown:t=>this.trapFocusEnd(t),onBlur:t=>t.stopPropagation(),onClick:()=>{this.monthInFocus=e+1;this.changeView("day")}},t)}render(){const t=this.getCalendarDates(this.monthInFocus,this.yearInFocus);return i("div",{class:"container",id:"wm-container"},i("button",{disabled:this.disabled,onClick:this.togglePopup.bind(this),"aria-describedby":`date-input-${this.parentId}`,ref:t=>this.buttonEl=t,"aria-expanded":`${this.isExpanded}`,class:"toggle",id:`toggle-${this.parentId}`},i("span",{class:"calendar",title:a.formatMessage({id:"date.calendarView",defaultMessage:"Calendar View",description:"Calendar button"})})),i("div",{class:`popup ${this.view}-view ${this.openUp?"expand-upwards":""} ${this.isTabbing?"user-is-tabbing":""}`,id:`popup-${this.parentId}`,ref:t=>this.popupEl=t,onClick:()=>this.popupClicked=true,role:"application","aria-describedby":"application"},this.view==="day"?i("div",{class:"day-view"},i("div",{class:"calendar-header"},i("button",{onClick:()=>{this.prevClicked=true;this.popupClicked=true;this.backOneMonth()},onKeyDown:t=>this.trapFocusLeft(t),ref:t=>this.prevButton=t,class:"arw-btn","aria-label":a.formatMessage({id:"date.selectPreviousMonth",defaultMessage:"Select previous month",description:"Calendar button"})},i("span",{class:"mdi"},"")),i("div",{id:`popup-title-month-${this.parentId}`,class:"title-box",tabindex:0,role:"button",onKeyDown:t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();this.changeView("month")}},onClick:this.changeView.bind(this,"month"),"aria-label":`${a.formatMessage({id:"date.currentMonth",defaultMessage:"current month",description:"Calendar button"})}: ${this.calendar_months[this.monthInFocus-1]}\n                  ${this.yearInFocus}.`,"aria-describedby":"month-title"},i("span",{class:"title","aria-hidden":"true"},this.calendar_months[this.monthInFocus-1]," ",this.yearInFocus)),i("button",{onClick:()=>{this.nextClicked=true;this.popupClicked=true;this.forwardOneMonth()},onKeyDown:t=>this.trapFocusRight(t),"aria-label":a.formatMessage({id:"date.selectNextMonth",defaultMessage:"Select next month",description:"Calendar button"}),ref:t=>this.nextButton=t,class:"arw-btn"},i("span",{class:"mdi"},""))),i("div",{"aria-labelledby":`popup-title-month-${this.parentId}`,role:"grid",class:"date-grid"},i("div",{role:"rowgroup",class:"date-header"},i("div",{role:"row",class:"header-row"},i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.su",defaultMessage:"Su",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.mo",defaultMessage:"Mo",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.tu",defaultMessage:"Tu",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.we",defaultMessage:"We",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.th",defaultMessage:"Th",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.fr",defaultMessage:"Fr",description:"Abbreviated day of the week"}))),i("div",{role:"columnheader",class:"header-cell"},i("span",null,a.formatMessage({id:"date.sa",defaultMessage:"Sa",description:"Abbreviated day of the week"}))))),i("div",{role:"rowgroup"},i("div",{role:"row",class:"date-row"},t.slice(0,7).map(((t,e)=>this.renderCalendarDate(t,e)))),i("div",{role:"row"},t.slice(7,14).map(((t,e)=>this.renderCalendarDate(t,e)))),i("div",{role:"row"},t.slice(14,21).map(((t,e)=>this.renderCalendarDate(t,e)))),i("div",{role:"row"},t.slice(21,28).map(((t,e)=>this.renderCalendarDate(t,e)))),i("div",{role:"row"},t.slice(28,35).map(((t,e)=>this.renderCalendarDate(t,e)))),t.length>35?i("div",{role:"row"},t.slice(35).map(((t,e)=>this.renderCalendarDate(t,e)))):""))):i("div",{class:"month-view"},i("div",{class:"calendar-header"},i("button",{onClick:()=>{this.prevClicked=true;this.popupClicked=true;this.yearInFocus-=1;this.updateLiveRegion(`${this.yearInFocus} selected.`)},onKeyDown:t=>this.trapFocusLeft(t),"aria-label":a.formatMessage({id:"date.selectPreviousYear",defaultMessage:"Select previous year",description:"Calendar button"}),ref:t=>this.prevButton=t,class:"arw-btn"},i("span",{class:"mdi"},"")),i("div",{id:`popup-title-year-${this.parentId}`,tabindex:0,class:"title-box year",role:"button",onClick:this.changeView.bind(this,"day"),onKeyDown:t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();this.changeView("day")}},"aria-labelledby":"year-title"},i("span",{class:"title"},this.yearInFocus)),i("button",{onClick:()=>{this.nextClicked=true;this.popupClicked=true;this.yearInFocus+=1;this.updateLiveRegion(`${this.yearInFocus} selected.`)},"aria-label":a.formatMessage({id:"date.selectNextYear",defaultMessage:"Select next year",description:"Calendar button"}),onKeyDown:t=>this.trapFocusRight(t),ref:t=>this.nextButton=t,class:"arw-btn"},i("span",{class:"mdi"},""))),i("div",{"aria-labelledby":`popup-title-year-${this.parentId}`,role:"grid",class:"months"},i("div",{role:"row",class:"month-row"},this.calendar_months.slice(0,3).map(((t,e)=>this.renderMonths(t,e)))),i("div",{role:"row",class:"month-row"},this.calendar_months.slice(3,6).map(((t,e)=>this.renderMonths(t,e+3)))),i("div",{role:"row",class:"month-row"},this.calendar_months.slice(6,9).map(((t,e)=>this.renderMonths(t,e+6)))),i("div",{role:"row",class:"month-row"},this.calendar_months.slice(9).map(((t,e)=>this.renderMonths(t,e+9))))))),this.isExpanded&&i("div",{id:"live-region","aria-live":"polite","aria-relevant":"text",class:"sr-only"}),i("div",{id:"month-title",class:"sr-only"},a.formatMessage({id:"date.selectMonth",defaultMessage:"Activate to select a month.",description:"Calendar button"})),i("div",{id:"year-title",class:"sr-only"},a.formatMessage({id:"date.selectYear",defaultMessage:"Activate to select a year.",description:"Calendar button"})),i("div",{id:"application",class:"sr-only"},a.formatMessage({id:"date.instructions",defaultMessage:"Use arrows to select a date in the table. Tab left or right to buttons for selecting previous month, next month, or the month selection table."})))}get el(){return o(this)}};d.style=h;export{d as priv_datepicker};
+//# sourceMappingURL=p-24f7d6eb.entry.js.map