@limetech/lime-elements 38.0.0 → 38.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/cjs/limel-chart.cjs.entry.js +33 -2
  3. package/dist/cjs/limel-chart.cjs.entry.js.map +1 -1
  4. package/dist/collection/components/chart/chart.css +16 -36
  5. package/dist/collection/components/chart/chart.js +55 -1
  6. package/dist/collection/components/chart/chart.js.map +1 -1
  7. package/dist/collection/components/chart/chart.types.js.map +1 -1
  8. package/dist/esm/limel-chart.entry.js +34 -3
  9. package/dist/esm/limel-chart.entry.js.map +1 -1
  10. package/dist/lime-elements/lime-elements.esm.js +1 -1
  11. package/dist/lime-elements/p-54b4a06b.entry.js +2 -0
  12. package/dist/lime-elements/p-54b4a06b.entry.js.map +1 -0
  13. package/dist/types/components/chart/chart.d.ts +9 -0
  14. package/dist/types/components/chart/chart.types.d.ts +6 -0
  15. package/dist/types/components.d.ts +12 -0
  16. package/package.json +1 -1
  17. package/dist/lime-elements/p-0eef63d5.entry.js +0 -2
  18. package/dist/lime-elements/p-0eef63d5.entry.js.map +0 -1
package/dist/lime-elements/p-0eef63d5.entry.js DELETED
@@ -1,2 +0,0 @@
1
- import{r as t,h as e}from"./p-443111b3.js";import{t as a}from"./p-efd753ba.js";import{c as r}from"./p-96460db3.js";const i='@charset "UTF-8";:host(limel-chart){--chart-axis-line-color:var(\n --limel-chart-axis-line-color,\n rgb(var(--contrast-900))\n );box-sizing:border-box;isolation:isolate;display:flex;width:100%;height:100%;min-width:0;min-height:0;padding:var(--limel-chart-padding)}table{all:unset;border-collapse:collapse;border-spacing:0;empty-cells:show;position:relative;display:flex;width:100%;height:100%;min-width:0;min-height:0}table colgroup,table thead,table tbody,table tr,table th,table td{all:unset}table caption,table colgroup,table thead,table tfoot,table th,table td{position:absolute;width:0;height:0;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap}*,*:before,*:after{box-sizing:border-box}.chart{position:relative;flex-grow:1;width:100%;height:100%;min-height:0;min-width:0}.chart:has(.item:hover) .item,.chart:has(.item:focus-visible) .item{opacity:0.4}.item{transition:background-color 0.2s ease, filter 0.2s ease, opacity 0.4s ease;cursor:help}.item:focus-visible,.item:hover{opacity:1 !important}limel-spinner{margin:auto}:host(limel-chart[type=bar]) .chart,:host(limel-chart[type=dot]) .chart,:host(limel-chart[type=line]) .chart,:host(limel-chart[type=area]) .chart{display:flex;background-color:var(--chart-background-color, transparent)}:host(limel-chart[type=bar]) .item,:host(limel-chart[type=dot]) .item,:host(limel-chart[type=line]) .item,:host(limel-chart[type=area]) .item{position:relative;mix-blend-mode:hard-light}:host(limel-chart[type=bar]) .item:focus,:host(limel-chart[type=dot]) .item:focus,:host(limel-chart[type=line]) .item:focus,:host(limel-chart[type=area]) .item:focus{outline:none}:host(limel-chart[type=bar]) .item:focus-visible,:host(limel-chart[type=dot]) .item:focus-visible,:host(limel-chart[type=line]) .item:focus-visible,:host(limel-chart[type=area]) .item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}:host(limel-chart[type=bar][orientation=landscape]),:host(limel-chart[type=dot][orientation=landscape]),:host(limel-chart[type=line][orientation=landscape]),:host(limel-chart[type=area][orientation=landscape]){--limel-chart-padding:0.5rem 0.5rem 0.5rem 2rem}:host(limel-chart[type=bar][orientation=landscape]) .chart,:host(limel-chart[type=dot][orientation=landscape]) .chart,:host(limel-chart[type=line][orientation=landscape]) .chart,:host(limel-chart[type=area][orientation=landscape]) .chart{flex-direction:row;align-items:flex-end;overflow:auto hidden;padding:0 0.125rem}:host(limel-chart[type=bar][orientation=landscape]) .item,:host(limel-chart[type=dot][orientation=landscape]) .item,:host(limel-chart[type=line][orientation=landscape]) .item,:host(limel-chart[type=area][orientation=landscape]) .item{min-width:0.5rem;width:inherit}:host(limel-chart[type=bar][orientation=portrait]),:host(limel-chart[type=dot][orientation=portrait]),:host(limel-chart[type=line][orientation=portrait]),:host(limel-chart[type=area][orientation=portrait]){--limel-chart-padding:0.5rem 0.5rem 1rem 0.5rem}:host(limel-chart[type=bar][orientation=portrait]) .chart,:host(limel-chart[type=dot][orientation=portrait]) .chart,:host(limel-chart[type=line][orientation=portrait]) .chart,:host(limel-chart[type=area][orientation=portrait]) .chart{flex-direction:column;overflow:hidden auto;padding:0.125rem 0}:host(limel-chart[type=bar][orientation=portrait]) .item,:host(limel-chart[type=dot][orientation=portrait]) .item,:host(limel-chart[type=line][orientation=portrait]) .item,:host(limel-chart[type=area][orientation=portrait]) .item{min-height:0.5rem;height:inherit}:host(limel-chart[type=pie]) table,:host(limel-chart[type=doughnut]) table,:host(limel-chart[type=ring]) table{min-height:2rem;min-width:2rem}:host(limel-chart[type=pie]) .chart,:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .chart,:host(limel-chart[type=doughnut]) .item,:host(limel-chart[type=ring]) .chart,:host(limel-chart[type=ring]) .item{aspect-ratio:1;display:flex;margin:auto}:host(limel-chart[type=pie]) .chart,:host(limel-chart[type=doughnut]) .chart,:host(limel-chart[type=ring]) .chart{justify-content:center;align-items:center}:host(limel-chart[type=pie]) .chart:before,:host(limel-chart[type=doughnut]) .chart:before,:host(limel-chart[type=ring]) .chart:before{aspect-ratio:1;content:"";position:absolute;z-index:0;inset:0;margin:auto;border-radius:50%;max-width:100%;max-height:100%;background-color:var(--chart-background-color, rgb(var(--contrast-200)))}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item,:host(limel-chart[type=ring]) .item{max-width:100%;max-height:100%;border-radius:50%;position:absolute;inset:0}:host(limel-chart[type=bar]) .chart,:host(limel-chart[type=dot]) .chart{gap:0.5rem}:host(limel-chart[type=bar]) .item,:host(limel-chart[type=dot]) .item{display:flex;align-items:center;justify-content:center;border-radius:var(--chart-item-border-radius, 0.125rem)}:host(limel-chart[type=bar]) .item{background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=dot]) .item:before,:host(limel-chart[type=dot]) .item:after{content:"";position:absolute;margin:auto;width:0.5rem;height:0.5rem;border-radius:50%}:host(limel-chart[type=dot]) .item::after{background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=dot]) .item.has-start-value:before{background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=bar][orientation=landscape]) .item,:host(limel-chart[type=dot][orientation=landscape]) .item{height:calc(var(--limel-chart-item-size) * 1%);bottom:calc(var(--limel-chart-item-offset) * 1%)}:host(limel-chart[type=bar][orientation=landscape]) .item.has-negative-value-only,:host(limel-chart[type=dot][orientation=landscape]) .item.has-negative-value-only{height:calc(var(--limel-chart-item-size) * -1%);transform-origin:bottom;transform:rotateX(180deg)}:host(limel-chart[type=dot][orientation=landscape]) .item.has-start-value,:host(limel-chart[type=dot][orientation=landscape]) .item:hover,:host(limel-chart[type=dot][orientation=landscape]) .item:focus-visible{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/1px 100% no-repeat}:host(limel-chart[type=dot][orientation=landscape]) .item:before{inset:auto 0 0 0;transform:translateY(50%)}:host(limel-chart[type=dot][orientation=landscape]) .item::after{inset:0 0 auto 0;transform:translateY(-50%)}:host(limel-chart[type=bar][orientation=portrait]) .item,:host(limel-chart[type=dot][orientation=portrait]) .item{width:calc(var(--limel-chart-item-size) * 1%);left:calc(var(--limel-chart-item-offset) * 1%)}:host(limel-chart[type=bar][orientation=portrait]) .item.has-negative-value-only,:host(limel-chart[type=dot][orientation=portrait]) .item.has-negative-value-only{width:calc(var(--limel-chart-item-size) * -1%);transform-origin:left;transform:rotateY(180deg)}:host(limel-chart[type=dot][orientation=portrait]) .item.has-start-value,:host(limel-chart[type=dot][orientation=portrait]) .item:hover,:host(limel-chart[type=dot][orientation=portrait]) .item:focus-visible{background:linear-gradient(to right, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/100% 1px no-repeat}:host(limel-chart[type=dot][orientation=portrait]) .item:before{inset:0 auto 0 0;transform:translateX(-50%)}:host(limel-chart[type=dot][orientation=portrait]) .item:after{inset:0 0 0 auto;transform:translateX(50%)}:host(limel-chart[type=area]) .item,:host(limel-chart[type=line]) .item{position:relative}:host(limel-chart[type=area]) .item:after,:host(limel-chart[type=line]) .item:after{margin:auto;width:0.5rem;height:0.5rem;border-radius:50%;border:1px solid rgb(var(--contrast-100))}:host(limel-chart[type=area]) .item:before,:host(limel-chart[type=line]) .item:before{inset:0}:host(limel-chart[type=area]) .item:after,:host(limel-chart[type=area]) .item:before,:host(limel-chart[type=line]) .item:after,:host(limel-chart[type=line]) .item:before{transition:border-color 0.2s ease, opacity 0.4s ease;content:"";position:absolute;background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=area]) .item:hover:after,:host(limel-chart[type=area]) .item:focus-visible:after,:host(limel-chart[type=line]) .item:hover:after,:host(limel-chart[type=line]) .item:focus-visible:after{border-color:transparent}:host(limel-chart[type=line][orientation=landscape]) .item,:host(limel-chart[type=area][orientation=landscape]) .item{height:100%}:host(limel-chart[type=line][orientation=landscape]) .item:after,:host(limel-chart[type=area][orientation=landscape]) .item:after{transform:translateX(-50%) translateY(50%);left:0;bottom:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[type=line][orientation=portrait]) .item,:host(limel-chart[type=area][orientation=portrait]) .item{width:100%}:host(limel-chart[type=line][orientation=portrait]) .item:after,:host(limel-chart[type=area][orientation=portrait]) .item:after{transform:translateX(-50%) translateY(-50%);left:calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%)}:host(limel-chart[type=area]) .item:after{opacity:0}:host(limel-chart[type=area]) .item:hover:after,:host(limel-chart[type=area]) .item:focus-visible:after{opacity:1}:host(limel-chart[type=area]) .item:hover:before,:host(limel-chart[type=area]) .item:focus-visible:before{opacity:0.7}:host(limel-chart[type=area][orientation=landscape]){}:host(limel-chart[type=area][orientation=landscape]) .item:before{clip-path:polygon(0 calc((100 - var(--limel-chart-item-offset)) * 1%), 0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1%), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1%), 100% calc((100 - var(--limel-chart-next-item-offset)) * 1%))}:host(limel-chart[type=area][orientation=portrait]){}:host(limel-chart[type=area][orientation=portrait]) .item:before{clip-path:polygon(calc(var(--limel-chart-item-offset) * 1%) 0, calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%) 0, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1%) 100%, calc(var(--limel-chart-next-item-offset) * 1%) 100%)}:host(limel-chart[type=line]){--limel-chart-line-thickness:0.125rem}:host(limel-chart[type=line]) .item:hover:before{opacity:0.4}:host(limel-chart[type=line][orientation=landscape]){}:host(limel-chart[type=line][orientation=landscape]) .item:hover{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) left/1px 100% no-repeat}:host(limel-chart[type=line][orientation=landscape]) .item:before{clip-path:polygon(0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1%), 0 calc((100 - (var(--limel-chart-item-size) + var(--limel-chart-item-offset))) * 1% + var(--limel-chart-line-thickness)), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1% + var(--limel-chart-line-thickness)), 100% calc((100 - (var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset))) * 1%))}:host(limel-chart[type=line][orientation=portrait]){}:host(limel-chart[type=line][orientation=portrait]) .item:hover{background:linear-gradient(to right, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) top/100% 1px no-repeat}:host(limel-chart[type=line][orientation=portrait]) .item:before{clip-path:polygon(calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1%) 0, calc((var(--limel-chart-item-size) + var(--limel-chart-item-offset)) * 1% + var(--limel-chart-line-thickness)) 0, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1% + var(--limel-chart-line-thickness)) 100%, calc((var(--limel-chart-next-item-size) + var(--limel-chart-next-item-offset)) * 1%) 100%)}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item{background:conic-gradient(transparent 0 calc(var(--limel-chart-item-offset) * 1%), var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8))) calc(var(--limel-chart-item-offset) * 1%) calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%), transparent calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%))}:host(limel-chart[type=pie]) .item:focus,:host(limel-chart[type=pie]) .item:focus-visible,:host(limel-chart[type=doughnut]) .item:focus,:host(limel-chart[type=doughnut]) .item:focus-visible{outline:none}:host(limel-chart[type=pie]) .item,:host(limel-chart[type=doughnut]) .item{pointer-events:none}:host(limel-chart[type=doughnut]) .chart:after{aspect-ratio:1;content:"";position:absolute;inset:0;margin:auto;max-width:60%;max-height:60%;border-radius:50%;background-color:rgb(var(--contrast-100))}:host(limel-chart[type=ring]) .chart:after{content:"";position:absolute;inset:0;aspect-ratio:1;border-radius:50%;max-height:calc(100% - var(--limel-chart-number-of-items) * 100% / (var(--limel-chart-number-of-items) + 1));max-width:calc(100% - var(--limel-chart-number-of-items) * 100% / (var(--limel-chart-number-of-items) + 1));background-color:var(--limel-chart-background-color, rgb(var(--contrast-200)))}:host(limel-chart[type=ring]) .chart:has(.item:hover) .item,:host(limel-chart[type=ring]) .chart:has(.item:focus-visible) .item{opacity:1;filter:grayscale(1)}:host(limel-chart[type=ring]) .chart:after,:host(limel-chart[type=ring]) .item{margin:auto;border:1px solid var(--limel-chart-background-color, rgb(var(--contrast-400)))}:host(limel-chart[type=ring]) .item{background:conic-gradient(var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8))) 0 calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%), var(--chart-background-color, rgb(var(--contrast-200))) calc(var(--limel-chart-item-offset) * 1% + var(--limel-chart-item-size) * 1%));max-width:calc(100% - var(--limel-chart-item-index) * 100% / (var(--limel-chart-number-of-items) + 1));max-height:calc(100% - var(--limel-chart-item-index) * 100% / (var(--limel-chart-number-of-items) + 1))}:host(limel-chart[type=ring]) .item:focus{outline:none}:host(limel-chart[type=ring]) .item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}:host(limel-chart[type=ring]) .item:focus-visible,:host(limel-chart[type=ring]) .item:hover{filter:grayscale(0) !important}:host(limel-chart[type=stacked-bar]) .chart{display:flex;border-radius:0.25rem;overflow:hidden;background-color:var(--chart-background-color, rgb(var(--contrast-800), 0.2))}:host(limel-chart[type=stacked-bar]) .item{display:flex;border-radius:var(--chart-item-border-radius, 0);background:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)))}:host(limel-chart[type=stacked-bar]) .item:focus{outline:none}:host(limel-chart[type=stacked-bar]) .item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}:host(limel-chart[type=stacked-bar]) .item:last-of-type{box-shadow:none !important}:host(limel-chart[type=stacked-bar][orientation=landscape]) .chart{flex-direction:row}:host(limel-chart[type=stacked-bar][orientation=landscape]) .item{min-height:0.5rem;width:calc(var(--limel-chart-item-size) * 1%);box-shadow:-1px 0 0 0 var(--chart-item-divider-color, rgb(var(--color-white), 0.6)) inset}:host(limel-chart[type=stacked-bar][orientation=portrait]) .chart{flex-direction:column-reverse}:host(limel-chart[type=stacked-bar][orientation=portrait]) .item{min-width:0.5rem;height:calc(var(--limel-chart-item-size) * 1%);box-shadow:0 -1px 0 0 rgb(var(--color-white), 0.6) inset}:host(limel-chart[type=nps]){--limel-chart-nps-gauge-angel:220deg}:host(limel-chart[type=nps]) table{min-height:4rem;min-width:4rem}:host(limel-chart[type=nps]) .chart{position:relative;display:flex;justify-content:center;align-items:center;aspect-ratio:1;margin:auto;width:unset;height:unset;max-width:100%;max-height:100%;rotate:calc(var(--limel-chart-nps-gauge-angel) / 2 * -1);transform:translate(-15%, -5%)}:host(limel-chart[type=nps]) .chart:before,:host(limel-chart[type=nps]) .chart:after{content:"";aspect-ratio:1;position:absolute;border-radius:50%;z-index:-1;min-height:0;min-width:0}:host(limel-chart[type=nps]) .chart:before{height:100%;max-height:100%;background:conic-gradient(rgb(var(--color-coral-default)) 0deg calc(var(--limel-chart-nps-gauge-angel) / 2), rgb(var(--color-amber-light)) calc(var(--limel-chart-nps-gauge-angel) / 2) calc(var(--limel-chart-nps-gauge-angel) * 0.65), rgb(var(--color-lime-light)) calc(var(--limel-chart-nps-gauge-angel) * 0.65) calc(var(--limel-chart-nps-gauge-angel) * 0.85), rgb(var(--color-lime-default)) calc(var(--limel-chart-nps-gauge-angel) * 0.85) var(--limel-chart-nps-gauge-angel), transparent var(--limel-chart-nps-gauge-angel))}:host(limel-chart[type=nps]) .chart:after{height:calc(100% - min(3rem, 20%) * 2);max-height:calc(100% - min(3rem, 20%) * 2);background:conic-gradient(var(--chart-background-color, rgb(var(--contrast-100))) 0deg var(--limel-chart-nps-gauge-angel), transparent var(--limel-chart-nps-gauge-angel))}:host(limel-chart[type=nps]) .item{display:flex;align-items:flex-start;justify-content:center;border-radius:0.5rem;position:absolute;height:calc(50% - min(3rem, 20%) + 0.5rem);width:0.5rem;transform:translateY(-50%) rotate(calc((var(--limel-chart-item-value) + 100) / 200 * var(--limel-chart-nps-gauge-angel)));transform-origin:bottom}:host(limel-chart[type=nps]) .item:focus{outline:none}:host(limel-chart[type=nps]) .item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}:host(limel-chart[type=nps]) .item:hover,:host(limel-chart[type=nps]) .item:focus-visible{background:linear-gradient(to bottom, rgb(var(--contrast-800), 0.4) 0%, rgb(var(--contrast-800), 0.4) 100%) center/1px 100% no-repeat}:host(limel-chart[type=nps]) .item:before,:host(limel-chart[type=nps]) .item:after{content:"";position:absolute}:host(limel-chart[type=nps]) .item:before{transform:translateY(-60%);width:0.4rem;border-radius:1rem;border-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)));border-style:solid;border-bottom-width:1.75rem;border-right-color:transparent;border-left-color:transparent;border-top-color:transparent}:host(limel-chart[type=nps]) .item:after{border-radius:50%;background-color:var(--limel-chart-item-color, var(--chart-item-color, rgb(var(--contrast-1100), 0.8)));aspect-ratio:1;height:clamp(0.75rem, 10%, 1.25rem);border:0.125rem solid rgb(var(--contrast-100), 0.8);box-shadow:var(--shadow-depth-8)}.axises{position:absolute;display:flex;justify-content:space-between;min-height:100%;min-width:100%;height:100%;width:100%}.axis-line{transition:opacity 0.4s ease;position:relative;opacity:0.2;font-size:0.625rem;border-color:var(--limel-chart-axis-line-color)}.axis-line:hover{opacity:0.6;transition-duration:0.2s}.axis-line.zero-line{opacity:0.6;z-index:1}.axis-line limel-badge{--badge-background-color:transparent;--badge-text-color:currentColor;position:absolute;text-align:right;min-width:2rem}:host(limel-chart[orientation=landscape]) .axises{flex-direction:column-reverse}:host(limel-chart[orientation=landscape]) .axis-line{border-bottom:1px solid;transform:translateY(50%)}:host(limel-chart[orientation=landscape]) .axis-line limel-badge{bottom:0;left:-2rem;transform:translateY(50%)}:host(limel-chart[orientation=portrait]) .axises{flex-direction:row}:host(limel-chart[orientation=portrait]) .axis-line{border-left:1px solid;transform:translateX(-50%)}:host(limel-chart[orientation=portrait]) .axis-line limel-badge{bottom:-1rem;right:-1rem}';const o=100;const l=10;const h=class{constructor(e){t(this,e);this.language="en";this.accessibleLabel=undefined;this.accessibleItemsLabel=undefined;this.items=undefined;this.type="stacked-bar";this.orientation="landscape";this.maxValue=undefined;this.axisIncrement=undefined;this.loading=false}componentWillLoad(){this.recalculateRangeData()}render(){if(this.loading){return e("limel-spinner",{limeBranded:false})}return e("table",{"aria-busy":this.loading?"true":"false","aria-live":"polite",style:{"--limel-chart-number-of-items":this.items.length.toString()}},this.renderCaption(),this.renderTableHeader(),this.renderAxises(),e("tbody",{class:"chart"},this.renderItems()))}renderCaption(){if(!this.accessibleLabel){return}return e("caption",null,this.accessibleLabel)}renderTableHeader(){return e("thead",null,e("tr",null,e("th",{scope:"col"},this.accessibleItemsLabel),e("th",{scope:"col"},a.get("value",this.language))))}renderAxises(){if(!["bar","dot","area","line"].includes(this.type)){return}const{minValue:t,maxValue:a}=this.range;const r=[];const i=Math.floor(t/this.axisIncrement)*this.axisIncrement;const o=Math.ceil(a/this.axisIncrement)*this.axisIncrement;for(let t=i;t<=o;t+=this.axisIncrement){r.push(e("div",{class:{"axis-line":true,"zero-line":t===0},role:"presentation"},e("limel-badge",{label:t})))}return e("div",{class:"axises",role:"presentation"},r)}renderItems(){var t;if(!((t=this.items)===null||t===void 0?void 0:t.length)){return}let a=0;return this.items.map(((t,i)=>{const o=r();const l=this.calculateSizeAndOffset(t);const h=l.size;let n=l.offset;if(this.type==="pie"||this.type==="doughnut"){n=a;a+=h}return e("tr",{style:this.getItemStyle(t,i,h,n),class:this.getItemClass(t),key:o,id:o,tabIndex:0},e("th",null,this.getItemText(t)),e("td",null,this.getFormattedValue(t)),this.renderTooltip(t,o,h))}))}getItemStyle(t,e,a,r){const i={"--limel-chart-item-offset":`${r}`,"--limel-chart-item-size":`${a}`,"--limel-chart-item-index":`${e}`,"--limel-chart-item-value":`${t.value}`};if(t.color){i["--limel-chart-item-color"]=t.color}if(this.type==="line"||this.type==="area"){const t=this.calculateSizeAndOffset(this.items[e+1]);i["--limel-chart-next-item-size"]=`${t.size}`;i["--limel-chart-next-item-offset"]=`${t.offset}`}return i}getItemClass(t){return{item:true,"has-start-value":Array.isArray(t.value),"has-negative-value-only":this.getMaximumValue(t)<0&&!this.isRangeItem(t)}}calculateSizeAndOffset(t){const{minValue:e,totalRange:a}=this.range;if(!t){return{size:0,offset:0}}let r=0;if(this.isRangeItem(t)){r=this.getMinimumValue(t)}const i=(r-e)/a*o;const l=(this.getMaximumValue(t)-e)/a*o;return{size:l-i,offset:i}}getFormattedValue(t){const{value:e,formattedValue:a}=t;if(a){return a}if(Array.isArray(e)){return`${e[0]} — ${e[1]}`}return`${e}`}getItemText(t){return t.text}renderTooltip(t,a,r){const i=this.getItemText(t);const o=2;const l=this.getFormattedValue(t);const h={label:i,helperLabel:l,elementId:a};if(this.type!=="bar"&&this.type!=="dot"&&this.type!=="nps"){h.label=`${i} (${r.toFixed(o)}%)`}return e("limel-tooltip",Object.assign({},h,{openDirection:this.orientation==="portrait"?"right":"top"}))}calculateRange(){var t;if(this.range){return this.range}const e=Math.min(0,...this.items.map(this.getMinimumValue));const a=Math.max(...this.items.map(this.getMaximumValue));const r=this.items.reduce(((t,e)=>t+this.getMaximumValue(e)),0);let i=(t=this.maxValue)!==null&&t!==void 0?t:a;if((this.type==="pie"||this.type==="doughnut")&&!this.maxValue){i=r}if(!this.axisIncrement){this.axisIncrement=this.calculateAxisIncrement(this.items)}const o=Math.ceil(i/this.axisIncrement)*this.axisIncrement;const l=Math.floor(e/this.axisIncrement)*this.axisIncrement;const h=o-l;return{minValue:l,maxValue:o,totalRange:h}}calculateAxisIncrement(t,e=l){const a=Math.max(...t.map((t=>{const e=t.value;if(Array.isArray(e)){return Math.max(...e)}return e})));const r=a/e;const i=10**Math.floor(Math.log10(r));return Math.ceil(r/i)*i}getMinimumValue(t){const e=t.value;return Array.isArray(e)?Math.min(...e):e}getMaximumValue(t){const e=t.value;return Array.isArray(e)?Math.max(...e):e}isRangeItem(t){return Array.isArray(t.value)}handleChange(){this.range=null;this.recalculateRangeData()}recalculateRangeData(){this.range=this.calculateRange()}static get watchers(){return{items:["handleChange"],axisIncrement:["handleChange"],maxValue:["handleChange"]}}};h.style=i;export{h as limel_chart};
2
- //# sourceMappingURL=p-0eef63d5.entry.js.map
package/dist/lime-elements/p-0eef63d5.entry.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"names":["chartCss","PERCENT","DEFAULT_INCREMENT_SIZE","Chart","componentWillLoad","this","recalculateRangeData","render","loading","h","limeBranded","style","items","length","toString","renderCaption","renderTableHeader","renderAxises","class","renderItems","accessibleLabel","scope","accessibleItemsLabel","translate","get","language","includes","type","minValue","maxValue","range","lines","adjustedMinRange","Math","floor","axisIncrement","adjustedMaxRange","ceil","value","push","role","label","_a","cumulativeOffset","map","item","index","itemId","createRandomString","sizeAndOffset","calculateSizeAndOffset","size","offset","getItemStyle","getItemClass","key","id","tabIndex","getItemText","getFormattedValue","renderTooltip","color","nextItem","Array","isArray","getMaximumValue","isRangeItem","totalRange","startValue","getMinimumValue","normalizedStart","normalizedEnd","formattedValue","text","PERCENT_DECIMAL","tooltipProps","helperLabel","elementId","toFixed","Object","assign","openDirection","orientation","calculateRange","minRange","min","maxRange","max","totalSum","reduce","sum","finalMaxRange","calculateAxisIncrement","visualMaxValue","visualMinValue","steps","roughStep","magnitude","log10","handleChange"],"sources":["./src/components/chart/chart.scss?tag=limel-chart&encapsulation=shadow","./src/components/chart/chart.tsx"],"sourcesContent":["@use '../../style/mixins';\n$min-item-size: 0.5rem;\n$default-item-color: var(--chart-item-color, rgb(var(--contrast-1100), 0.8));\n\n/**\n* @prop --chart-background-color: Defines the background color of the chart. Defaults to `transparent` for _most_ chart types.\n* @prop --chart-item-color: If no color is defined for chart items, this color will be use. Defaults to `rgb(var(--contrast-1100), 0.8)`.\n* @prop --chart-item-divider-color: Defines the color that visually separates items in some charts, such as `stacked-bar` chart items. Defaults to `rgb(var(--color-white), 0.6)`.\n* @prop --chart-axis-line-color: Defines color of the axis lines. Defaults to `--contrast-900`. Note that lines have opacity as well, and get opaque on hover.\n* @prop --chart-item-border-radius: Defines the roundness of corners of items in a chart. Defaults to different values depending on the chart type. Does not have any effect on `pie` and `doughnut` types.\n*/\n\n:host(limel-chart) {\n --chart-axis-line-color: var(\n --limel-chart-axis-line-color,\n rgb(var(--contrast-900))\n );\n box-sizing: border-box;\n isolation: isolate;\n\n display: flex;\n width: 100%;\n height: 100%;\n min-width: 0;\n min-height: 0;\n padding: var(--limel-chart-padding);\n}\n\ntable {\n // Since these are mainly \"resets\", no styles should be before them.\n all: unset;\n border-collapse: collapse;\n border-spacing: 0;\n empty-cells: show;\n\n position: relative;\n display: flex;\n width: 100%;\n height: 100%;\n min-width: 0;\n min-height: 0;\n\n colgroup,\n thead,\n tbody,\n tr,\n th,\n td {\n all: unset;\n }\n\n caption,\n colgroup,\n thead,\n tfoot,\n th,\n td {\n @include mixins.visually-hidden;\n }\n}\n\n*,\n*:before,\n*:after {\n box-sizing: border-box;\n}\n\n.chart {\n position: relative;\n flex-grow: 1;\n width: 100%;\n height: 100%;\n min-height: 0;\n min-width: 0;\n\n &:has(.item:hover),\n &:has(.item:focus-visible) {\n .item {\n opacity: 0.4;\n }\n }\n}\n\n.item {\n transition:\n background-color 0.2s ease,\n filter 0.2s ease,\n opacity 0.4s ease;\n cursor: help;\n\n &:focus-visible,\n &:hover {\n opacity: 1 !important;\n }\n}\n\nlimel-spinner {\n margin: auto;\n}\n\n@mixin line(\n $direction: vertical,\n $color: rgb(var(--contrast-800), 0.4),\n $position: center\n) {\n @if $direction == vertical {\n background: linear-gradient(to bottom, $color 0%, $color 100%)\n $position/1px\n 100%\n no-repeat;\n } @else if $direction == horizontal {\n background: linear-gradient(to right, $color 0%, $color 100%)\n $position/100%\n 1px\n no-repeat;\n }\n}\n\n@import './partial-styles/_layout-for-charts-with-x-y-axises';\n@import './partial-styles/_layout-for-charts-with-circular-shape';\n@import './partial-styles/_bar-gantt-dot';\n@import './partial-styles/_area_line';\n@import './partial-styles/_pie-doughnut';\n@import './partial-styles/_ring';\n@import './partial-styles/_stacked-bar';\n@import './partial-styles/_nps';\n@import './partial-styles/_axises';\n","import { Component, h, Prop, Watch } from '@stencil/core';\nimport { Languages } from '../date-picker/date.types';\nimport translate from '../../global/translations';\nimport { createRandomString } from '../../util/random-string';\nimport { ChartItem } from './chart.types';\n\nconst PERCENT = 100;\nconst DEFAULT_INCREMENT_SIZE = 10;\n\n/**\n * A chart is a graphical representation of data, in which\n * visual symbols such as such bars, dots, lines, or slices, represent\n * each data point, in comparison to others.\n *\n * @exampleComponent limel-example-chart-stacked-bar\n * @exampleComponent limel-example-chart-orientation\n * @exampleComponent limel-example-chart-max-value\n * @exampleComponent limel-example-chart-type-bar\n * @exampleComponent limel-example-chart-type-dot\n * @exampleComponent limel-example-chart-type-area\n * @exampleComponent limel-example-chart-type-line\n * @exampleComponent limel-example-chart-type-pie\n * @exampleComponent limel-example-chart-type-doughnut\n * @exampleComponent limel-example-chart-type-ring\n * @exampleComponent limel-example-chart-type-gantt\n * @exampleComponent limel-example-chart-type-nps\n * @exampleComponent limel-example-chart-multi-axis\n * @exampleComponent limel-example-chart-multi-axis-with-negative-start-values\n * @exampleComponent limel-example-chart-multi-axis-area-with-negative-start-values\n * @exampleComponent limel-example-chart-axis-increment\n * @exampleComponent limel-example-chart-accessibility\n * @exampleComponent limel-example-chart-styling\n * @exampleComponent limel-example-chart-creative-styling\n * @beta\n */\n\n@Component({\n tag: 'limel-chart',\n shadow: true,\n styleUrl: 'chart.scss',\n})\nexport class Chart {\n /**\n * Defines the language for translations.\n * Will translate the translatable strings on the components.\n */\n @Prop({ reflect: true })\n public language: Languages = 'en';\n\n /**\n * Helps users of assistive technologies to understand\n * the context of the chart, and what is being displayed.\n */\n @Prop({ reflect: true })\n public accessibleLabel?: string;\n\n /**\n * Helps users of assistive technologies to understand\n * what the items in the chart represent.\n */\n @Prop({ reflect: true })\n public accessibleItemsLabel?: string;\n\n /**\n * List of items in the chart,\n * each representing a data point.\n */\n @Prop()\n public items!: ChartItem[];\n\n /**\n * Defines how items are visualized in the chart.\n */\n @Prop({ reflect: true })\n public type?:\n | 'area'\n | 'bar'\n | 'doughnut'\n | 'line'\n | 'nps'\n | 'pie'\n | 'ring'\n | 'dot'\n | 'stacked-bar' = 'stacked-bar';\n\n /**\n * Defines whether the chart is intended to be displayed wide or tall.\n * Does not have any effect on chart types which generate circular forms.\n */\n @Prop({ reflect: true })\n public orientation?: 'landscape' | 'portrait' = 'landscape';\n\n /**\n * Specifies the range that items' values could be in.\n * This is used in calculation of the size of the items in the chart.\n * When not provided, the sum of all values in the items will be considered as the range.\n */\n @Prop({ reflect: true })\n public maxValue?: number;\n\n /**\n * Specifies the increment for the axis lines.\n */\n @Prop({ reflect: true })\n public axisIncrement?: number;\n\n /**\n * Indicates whether the chart is in a loading state.\n */\n @Prop({ reflect: true })\n public loading: boolean = false;\n\n private range: {\n minValue: number;\n maxValue: number;\n totalRange: number;\n };\n\n public componentWillLoad() {\n this.recalculateRangeData();\n }\n\n public render() {\n if (this.loading) {\n return <limel-spinner limeBranded={false} />;\n }\n\n return (\n <table\n aria-busy={this.loading ? 'true' : 'false'}\n aria-live=\"polite\"\n style={{\n '--limel-chart-number-of-items':\n this.items.length.toString(),\n }}\n >\n {this.renderCaption()}\n {this.renderTableHeader()}\n {this.renderAxises()}\n <tbody class=\"chart\">{this.renderItems()}</tbody>\n </table>\n );\n }\n\n private renderCaption() {\n if (!this.accessibleLabel) {\n return;\n }\n\n return <caption>{this.accessibleLabel}</caption>;\n }\n\n private renderTableHeader() {\n return (\n <thead>\n <tr>\n <th scope=\"col\">{this.accessibleItemsLabel}</th>\n <th scope=\"col\">{translate.get('value', this.language)}</th>\n </tr>\n </thead>\n );\n }\n\n private renderAxises() {\n if (!['bar', 'dot', 'area', 'line'].includes(this.type)) {\n return;\n }\n\n const { minValue, maxValue } = this.range;\n const lines = [];\n const adjustedMinRange =\n Math.floor(minValue / this.axisIncrement) * this.axisIncrement;\n const adjustedMaxRange =\n Math.ceil(maxValue / this.axisIncrement) * this.axisIncrement;\n\n for (\n let value = adjustedMinRange;\n value <= adjustedMaxRange;\n value += this.axisIncrement\n ) {\n lines.push(\n <div\n class={{\n 'axis-line': true,\n 'zero-line': value === 0,\n }}\n role=\"presentation\"\n >\n <limel-badge label={value} />\n </div>,\n );\n }\n\n return (\n <div class=\"axises\" role=\"presentation\">\n {lines}\n </div>\n );\n }\n\n private renderItems() {\n if (!this.items?.length) {\n return;\n }\n\n let cumulativeOffset = 0;\n\n return this.items.map((item, index) => {\n const itemId = createRandomString();\n const sizeAndOffset = this.calculateSizeAndOffset(item);\n const size = sizeAndOffset.size;\n let offset = sizeAndOffset.offset;\n\n if (this.type === 'pie' || this.type === 'doughnut') {\n offset = cumulativeOffset;\n cumulativeOffset += size;\n }\n\n return (\n <tr\n style={this.getItemStyle(item, index, size, offset)}\n class={this.getItemClass(item)}\n key={itemId}\n id={itemId}\n tabIndex={0}\n >\n <th>{this.getItemText(item)}</th>\n <td>{this.getFormattedValue(item)}</td>\n {this.renderTooltip(item, itemId, size)}\n </tr>\n );\n });\n }\n\n private getItemStyle(\n item: ChartItem,\n index: number,\n size: number,\n offset: number,\n ): Record<string, string> {\n const style: Record<string, string> = {\n '--limel-chart-item-offset': `${offset}`,\n '--limel-chart-item-size': `${size}`,\n '--limel-chart-item-index': `${index}`,\n '--limel-chart-item-value': `${item.value}`,\n };\n\n if (item.color) {\n style['--limel-chart-item-color'] = item.color;\n }\n\n if (this.type === 'line' || this.type === 'area') {\n const nextItem = this.calculateSizeAndOffset(this.items[index + 1]);\n\n style['--limel-chart-next-item-size'] = `${nextItem.size}`;\n style['--limel-chart-next-item-offset'] = `${nextItem.offset}`;\n }\n\n return style;\n }\n\n private getItemClass(item: ChartItem) {\n return {\n item: true,\n 'has-start-value': Array.isArray(item.value),\n 'has-negative-value-only':\n this.getMaximumValue(item) < 0 && !this.isRangeItem(item),\n };\n }\n\n private calculateSizeAndOffset(item?: ChartItem) {\n const { minValue, totalRange } = this.range;\n if (!item) {\n return {\n size: 0,\n offset: 0,\n };\n }\n\n let startValue = 0;\n if (this.isRangeItem(item)) {\n startValue = this.getMinimumValue(item);\n }\n\n const normalizedStart =\n ((startValue - minValue) / totalRange) * PERCENT;\n const normalizedEnd =\n ((this.getMaximumValue(item) - minValue) / totalRange) * PERCENT;\n\n return {\n size: normalizedEnd - normalizedStart,\n offset: normalizedStart,\n };\n }\n\n private getFormattedValue(item: ChartItem): string {\n const { value, formattedValue } = item;\n\n if (formattedValue) {\n return formattedValue;\n }\n\n if (Array.isArray(value)) {\n return `${value[0]} — ${value[1]}`;\n }\n\n return `${value}`;\n }\n\n private getItemText(item: ChartItem): string {\n return item.text;\n }\n\n private renderTooltip(item: ChartItem, itemId: string, size: number) {\n const text = this.getItemText(item);\n const PERCENT_DECIMAL = 2;\n const formattedValue = this.getFormattedValue(item);\n\n const tooltipProps: any = {\n label: text,\n helperLabel: formattedValue,\n elementId: itemId,\n };\n\n if (this.type !== 'bar' && this.type !== 'dot' && this.type !== 'nps') {\n tooltipProps.label = `${text} (${size.toFixed(PERCENT_DECIMAL)}%)`;\n }\n\n return (\n <limel-tooltip\n {...tooltipProps}\n openDirection={\n this.orientation === 'portrait' ? 'right' : 'top'\n }\n />\n );\n }\n\n private calculateRange() {\n if (this.range) {\n return this.range;\n }\n\n const minRange = Math.min(0, ...this.items.map(this.getMinimumValue));\n const maxRange = Math.max(...this.items.map(this.getMaximumValue));\n const totalSum = this.items.reduce(\n (sum, item) => sum + this.getMaximumValue(item),\n 0,\n );\n\n let finalMaxRange = this.maxValue ?? maxRange;\n if (\n (this.type === 'pie' || this.type === 'doughnut') &&\n !this.maxValue\n ) {\n finalMaxRange = totalSum;\n }\n\n if (!this.axisIncrement) {\n this.axisIncrement = this.calculateAxisIncrement(this.items);\n }\n\n const visualMaxValue =\n Math.ceil(finalMaxRange / this.axisIncrement) * this.axisIncrement;\n const visualMinValue =\n Math.floor(minRange / this.axisIncrement) * this.axisIncrement;\n const totalRange = visualMaxValue - visualMinValue;\n\n return {\n minValue: visualMinValue,\n maxValue: visualMaxValue,\n totalRange: totalRange,\n };\n }\n\n private calculateAxisIncrement(\n items: ChartItem[],\n steps: number = DEFAULT_INCREMENT_SIZE,\n ) {\n const maxValue = Math.max(\n ...items.map((item) => {\n const value = item.value;\n if (Array.isArray(value)) {\n return Math.max(...value);\n }\n\n return value;\n }),\n );\n\n const roughStep = maxValue / steps;\n // eslint-disable-next-line no-magic-numbers\n const magnitude = 10 ** Math.floor(Math.log10(roughStep));\n\n return Math.ceil(roughStep / magnitude) * magnitude;\n }\n\n private getMinimumValue(item: ChartItem): number {\n const value = item.value;\n\n return Array.isArray(value) ? Math.min(...value) : value;\n }\n\n private getMaximumValue(item: ChartItem): number {\n const value = item.value;\n\n return Array.isArray(value) ? Math.max(...value) : value;\n }\n\n private isRangeItem(item: ChartItem): item is ChartItem<[number, number]> {\n return Array.isArray(item.value);\n }\n\n @Watch('items')\n @Watch('axisIncrement')\n @Watch('maxValue')\n handleChange() {\n this.range = null;\n this.recalculateRangeData();\n }\n\n private recalculateRangeData() {\n this.range = this.calculateRange();\n }\n}\n"],"mappings":"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"}