@limetech/lime-elements 36.3.0-next.34 → 36.3.0-next.35
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.
- package/dist/cjs/limel-callout.cjs.entry.js +1 -1
- package/dist/collection/components/callout/callout.css +27 -7
- package/dist/collection/components/callout/callout.js +2 -0
- package/dist/esm/limel-callout.entry.js +1 -1
- package/dist/lime-elements/lime-elements.esm.js +1 -1
- package/dist/lime-elements/p-0131cadd.entry.js +1 -0
- package/dist/types/components/callout/callout.d.ts +2 -0
- package/dist/types/components/callout/callout.types.d.ts +1 -0
- package/package.json +1 -1
- package/dist/lime-elements/p-db350146.entry.js +0 -1
|
@@ -26,7 +26,7 @@ function getHeading(type = 'note', language = 'en') {
|
|
|
26
26
|
}
|
|
27
27
|
}
|
|
28
28
|
|
|
29
|
-
const calloutCss = ":host(limel-callout){display:flex;border-radius:0.5rem;overflow:hidden;color:rgb(var(--contrast-1100))}:host([type=note]){--limel-callout-tint-color:rgb(var(--color-gray-default))}:host([type=important]){--limel-callout-tint-color:rgb(var(--color-sky-default))}:host([type=tip]){--limel-callout-tint-color:rgb(var(--color-green-default))}:host([type=caution]){--limel-callout-tint-color:rgb(var(--color-orange-light))}:host([type=warning]){--limel-callout-tint-color:rgb(var(--color-red-dark))}.side{padding:0.25rem;position:relative}.side:before{content:\"\";position:absolute;inset:0;opacity:0.2;background-color:var(--limel-callout-tint-color)}.side limel-icon{width:1.5rem;color:var(--limel-callout-tint-color);margin-top:0.0625rem}.main{display:flex;flex:1;flex-direction:column;gap:0.5rem;padding:0.25rem 0.5rem 0.5rem 0.5rem;background-color:rgb(var(--contrast-300))}.heading{margin:0;font-size:1rem}";
|
|
29
|
+
const calloutCss = ":host(limel-callout){display:flex;border-radius:0.5rem;overflow:hidden;color:var(--callout-text-color, rgb(var(--contrast-1100)))}:host([type=note]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-gray-default))\n )}:host([type=important]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-sky-default))\n )}:host([type=tip]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-green-default))\n )}:host([type=caution]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-orange-light))\n )}:host([type=warning]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-red-dark))\n )}.side{padding:0.25rem;position:relative}.side:before{content:\"\";position:absolute;inset:0;opacity:0.2;background-color:var(--limel-callout-tint-color)}.side limel-icon{width:1.5rem;color:var(--limel-callout-tint-color);margin-top:0.0625rem}.main{display:flex;flex:1;flex-direction:column;gap:0.5rem;padding:0.25rem 0.5rem 0.5rem 0.5rem;background-color:var(--callout-background-color, rgb(var(--contrast-300)))}.heading{margin:0;font-size:1rem}";
|
|
30
30
|
|
|
31
31
|
const Callout = class {
|
|
32
32
|
constructor(hostRef) {
|
|
@@ -1,28 +1,48 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @prop --callout-text-color: Text color of the component. Defaults to `--contrast-1100`.
|
|
3
|
+
* @prop --callout-background-color: Background color of the component. Defaults to `--contrast-300`.
|
|
4
|
+
* @prop --callout-color: Color used in the UI to add more contextual meaning about the type of the information. This color is different based on the chosen `type`, but you can override it using this prop.
|
|
5
|
+
*/
|
|
1
6
|
:host(limel-callout) {
|
|
2
7
|
display: flex;
|
|
3
8
|
border-radius: 0.5rem;
|
|
4
9
|
overflow: hidden;
|
|
5
|
-
color: rgb(var(--contrast-1100));
|
|
10
|
+
color: var(--callout-text-color, rgb(var(--contrast-1100)));
|
|
6
11
|
}
|
|
7
12
|
|
|
8
13
|
:host([type=note]) {
|
|
9
|
-
--limel-callout-tint-color:
|
|
14
|
+
--limel-callout-tint-color: var(
|
|
15
|
+
--callout-color,
|
|
16
|
+
rgb(var(--color-gray-default))
|
|
17
|
+
);
|
|
10
18
|
}
|
|
11
19
|
|
|
12
20
|
:host([type=important]) {
|
|
13
|
-
--limel-callout-tint-color:
|
|
21
|
+
--limel-callout-tint-color: var(
|
|
22
|
+
--callout-color,
|
|
23
|
+
rgb(var(--color-sky-default))
|
|
24
|
+
);
|
|
14
25
|
}
|
|
15
26
|
|
|
16
27
|
:host([type=tip]) {
|
|
17
|
-
--limel-callout-tint-color:
|
|
28
|
+
--limel-callout-tint-color: var(
|
|
29
|
+
--callout-color,
|
|
30
|
+
rgb(var(--color-green-default))
|
|
31
|
+
);
|
|
18
32
|
}
|
|
19
33
|
|
|
20
34
|
:host([type=caution]) {
|
|
21
|
-
--limel-callout-tint-color:
|
|
35
|
+
--limel-callout-tint-color: var(
|
|
36
|
+
--callout-color,
|
|
37
|
+
rgb(var(--color-orange-light))
|
|
38
|
+
);
|
|
22
39
|
}
|
|
23
40
|
|
|
24
41
|
:host([type=warning]) {
|
|
25
|
-
--limel-callout-tint-color:
|
|
42
|
+
--limel-callout-tint-color: var(
|
|
43
|
+
--callout-color,
|
|
44
|
+
rgb(var(--color-red-dark))
|
|
45
|
+
);
|
|
26
46
|
}
|
|
27
47
|
|
|
28
48
|
.side {
|
|
@@ -48,7 +68,7 @@
|
|
|
48
68
|
flex-direction: column;
|
|
49
69
|
gap: 0.5rem;
|
|
50
70
|
padding: 0.25rem 0.5rem 0.5rem 0.5rem;
|
|
51
|
-
background-color: rgb(var(--contrast-300));
|
|
71
|
+
background-color: var(--callout-background-color, rgb(var(--contrast-300)));
|
|
52
72
|
}
|
|
53
73
|
|
|
54
74
|
.heading {
|
|
@@ -21,6 +21,8 @@ import { getHeading, getIcon } from './callout.helpers';
|
|
|
21
21
|
* @exampleComponent limel-example-callout-tip
|
|
22
22
|
* @exampleComponent limel-example-callout-caution
|
|
23
23
|
* @exampleComponent limel-example-callout-warning
|
|
24
|
+
* @exampleComponent limel-example-callout-rich-content
|
|
25
|
+
* @exampleComponent limel-example-callout-styles
|
|
24
26
|
*/
|
|
25
27
|
export class Callout {
|
|
26
28
|
constructor() {
|
|
@@ -22,7 +22,7 @@ function getHeading(type = 'note', language = 'en') {
|
|
|
22
22
|
}
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
const calloutCss = ":host(limel-callout){display:flex;border-radius:0.5rem;overflow:hidden;color:rgb(var(--contrast-1100))}:host([type=note]){--limel-callout-tint-color:rgb(var(--color-gray-default))}:host([type=important]){--limel-callout-tint-color:rgb(var(--color-sky-default))}:host([type=tip]){--limel-callout-tint-color:rgb(var(--color-green-default))}:host([type=caution]){--limel-callout-tint-color:rgb(var(--color-orange-light))}:host([type=warning]){--limel-callout-tint-color:rgb(var(--color-red-dark))}.side{padding:0.25rem;position:relative}.side:before{content:\"\";position:absolute;inset:0;opacity:0.2;background-color:var(--limel-callout-tint-color)}.side limel-icon{width:1.5rem;color:var(--limel-callout-tint-color);margin-top:0.0625rem}.main{display:flex;flex:1;flex-direction:column;gap:0.5rem;padding:0.25rem 0.5rem 0.5rem 0.5rem;background-color:rgb(var(--contrast-300))}.heading{margin:0;font-size:1rem}";
|
|
25
|
+
const calloutCss = ":host(limel-callout){display:flex;border-radius:0.5rem;overflow:hidden;color:var(--callout-text-color, rgb(var(--contrast-1100)))}:host([type=note]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-gray-default))\n )}:host([type=important]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-sky-default))\n )}:host([type=tip]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-green-default))\n )}:host([type=caution]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-orange-light))\n )}:host([type=warning]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-red-dark))\n )}.side{padding:0.25rem;position:relative}.side:before{content:\"\";position:absolute;inset:0;opacity:0.2;background-color:var(--limel-callout-tint-color)}.side limel-icon{width:1.5rem;color:var(--limel-callout-tint-color);margin-top:0.0625rem}.main{display:flex;flex:1;flex-direction:column;gap:0.5rem;padding:0.25rem 0.5rem 0.5rem 0.5rem;background-color:var(--callout-background-color, rgb(var(--contrast-300)))}.heading{margin:0;font-size:1rem}";
|
|
26
26
|
|
|
27
27
|
const Callout = class {
|
|
28
28
|
constructor(hostRef) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as l}from"./p-d4e788e1.js";(()=>{const l=import.meta.url,i={};return""!==l&&(i.resourcesUrl=new URL(".",l).href),e(i)})().then((e=>l([["p-edbd8d62",[[1,"limel-color-picker",{value:[513],label:[513],helperText:[513,"helper-text"],tooltipLabel:[513,"tooltip-label"],required:[516],readonly:[516],isOpen:[32]}]]],["p-d87e2f26",[[1,"limel-dock",{dockItems:[16],dockFooterItems:[16],accessibleLabel:[513,"accessible-label"],expanded:[516],allowResize:[516,"allow-resize"],mobileBreakPoint:[514,"mobile-break-point"],useMobileLayout:[32]}]]],["p-46a76d55",[[1,"limel-split-button",{label:[513],primary:[516],icon:[513],disabled:[516],items:[16]}]]],["p-cad7cda1",[[1,"limel-picker",{disabled:[4],readonly:[516],label:[1],searchLabel:[1,"search-label"],helperText:[513,"helper-text"],leadingIcon:[1,"leading-icon"],emptyResultMessage:[1,"empty-result-message"],required:[4],value:[16],searcher:[16],multiple:[4],delimiter:[513],actions:[16],actionPosition:[1,"action-position"],actionScrollBehavior:[1,"action-scroll-behavior"],badgeIcons:[516,"badge-icons"],items:[32],textValue:[32],loading:[32],chips:[32]}]]],["p-b40f37d7",[[1,"limel-date-picker",{disabled:[516],readonly:[516],invalid:[516],label:[513],placeholder:[513],helperText:[513,"helper-text"],required:[516],value:[16],type:[513],format:[513],language:[513],formatter:[16],formattedValue:[32],internalFormat:[32],showPortal:[32]}]]],["p-039c10df",[[1,"limel-button-group",{value:[16],disabled:[516],selectedButtonId:[32]}]]],["p-eda87f8c",[[1,"limel-info-tile",{value:[520],icon:[1],label:[513],prefix:[513],suffix:[513],disabled:[516],badge:[520],loading:[516],link:[16],progress:[16]}]]],["p-2c7b0e49",[[1,"limel-select",{disabled:[516],readonly:[516],invalid:[516],required:[516],label:[513],helperText:[513,"helper-text"],value:[16],options:[16],multiple:[4],menuOpen:[32]}]]],["p-a88f2922",[[1,"limel-snackbar",{message:[1],timeout:[2],actionText:[1,"action-text"],dismissible:[4],multiline:[4],language:[1],show:[64]}]]],["p-3fda3473",[[1,"limel-tab-panel",{tabs:[1040]}]]],["p-4eeabc1f",[[1,"limel-file",{value:[16],label:[513],required:[516],disabled:[516],readonly:[516],accept:[513],language:[1],isDraggingOverDropZone:[32]}]]],["p-5393213b",[[1,"limel-collapsible-section",{isOpen:[1540,"is-open"],header:[513],actions:[16]}]]],["p-cc3529bb",[[1,"limel-dialog",{heading:[1],fullscreen:[516],open:[1540],closingActions:[16]}]]],["p-35a6ab13",[[1,"limel-progress-flow",{flowItems:[16],disabled:[4],readonly:[4]}]]],["p-4fcd3337",[[1,"limel-shortcut",{icon:[513],label:[513],disabled:[516],badge:[520],link:[16]}]]],["p-7d7d19de",[[1,"limel-table",{data:[16],columns:[16],mode:[1],layout:[1],pageSize:[2,"page-size"],totalRows:[2,"total-rows"],sorting:[16],activeRow:[1040],movableColumns:[4,"movable-columns"],loading:[4],page:[2],emptyMessage:[1,"empty-message"],aggregates:[16],selectable:[4],selection:[16]}]]],["p-bf3d6097",[[1,"limel-banner",{message:[513],icon:[513],isOpen:[32],open:[64],close:[64]}]]],["p-
|
|
1
|
+
import{p as e,b as l}from"./p-d4e788e1.js";(()=>{const l=import.meta.url,i={};return""!==l&&(i.resourcesUrl=new URL(".",l).href),e(i)})().then((e=>l([["p-edbd8d62",[[1,"limel-color-picker",{value:[513],label:[513],helperText:[513,"helper-text"],tooltipLabel:[513,"tooltip-label"],required:[516],readonly:[516],isOpen:[32]}]]],["p-d87e2f26",[[1,"limel-dock",{dockItems:[16],dockFooterItems:[16],accessibleLabel:[513,"accessible-label"],expanded:[516],allowResize:[516,"allow-resize"],mobileBreakPoint:[514,"mobile-break-point"],useMobileLayout:[32]}]]],["p-46a76d55",[[1,"limel-split-button",{label:[513],primary:[516],icon:[513],disabled:[516],items:[16]}]]],["p-cad7cda1",[[1,"limel-picker",{disabled:[4],readonly:[516],label:[1],searchLabel:[1,"search-label"],helperText:[513,"helper-text"],leadingIcon:[1,"leading-icon"],emptyResultMessage:[1,"empty-result-message"],required:[4],value:[16],searcher:[16],multiple:[4],delimiter:[513],actions:[16],actionPosition:[1,"action-position"],actionScrollBehavior:[1,"action-scroll-behavior"],badgeIcons:[516,"badge-icons"],items:[32],textValue:[32],loading:[32],chips:[32]}]]],["p-b40f37d7",[[1,"limel-date-picker",{disabled:[516],readonly:[516],invalid:[516],label:[513],placeholder:[513],helperText:[513,"helper-text"],required:[516],value:[16],type:[513],format:[513],language:[513],formatter:[16],formattedValue:[32],internalFormat:[32],showPortal:[32]}]]],["p-039c10df",[[1,"limel-button-group",{value:[16],disabled:[516],selectedButtonId:[32]}]]],["p-eda87f8c",[[1,"limel-info-tile",{value:[520],icon:[1],label:[513],prefix:[513],suffix:[513],disabled:[516],badge:[520],loading:[516],link:[16],progress:[16]}]]],["p-2c7b0e49",[[1,"limel-select",{disabled:[516],readonly:[516],invalid:[516],required:[516],label:[513],helperText:[513,"helper-text"],value:[16],options:[16],multiple:[4],menuOpen:[32]}]]],["p-a88f2922",[[1,"limel-snackbar",{message:[1],timeout:[2],actionText:[1,"action-text"],dismissible:[4],multiline:[4],language:[1],show:[64]}]]],["p-3fda3473",[[1,"limel-tab-panel",{tabs:[1040]}]]],["p-4eeabc1f",[[1,"limel-file",{value:[16],label:[513],required:[516],disabled:[516],readonly:[516],accept:[513],language:[1],isDraggingOverDropZone:[32]}]]],["p-5393213b",[[1,"limel-collapsible-section",{isOpen:[1540,"is-open"],header:[513],actions:[16]}]]],["p-cc3529bb",[[1,"limel-dialog",{heading:[1],fullscreen:[516],open:[1540],closingActions:[16]}]]],["p-35a6ab13",[[1,"limel-progress-flow",{flowItems:[16],disabled:[4],readonly:[4]}]]],["p-4fcd3337",[[1,"limel-shortcut",{icon:[513],label:[513],disabled:[516],badge:[520],link:[16]}]]],["p-7d7d19de",[[1,"limel-table",{data:[16],columns:[16],mode:[1],layout:[1],pageSize:[2,"page-size"],totalRows:[2,"total-rows"],sorting:[16],activeRow:[1040],movableColumns:[4,"movable-columns"],loading:[4],page:[2],emptyMessage:[1,"empty-message"],aggregates:[16],selectable:[4],selection:[16]}]]],["p-bf3d6097",[[1,"limel-banner",{message:[513],icon:[513],isOpen:[32],open:[64],close:[64]}]]],["p-0131cadd",[[1,"limel-callout",{type:[513],language:[1]}]]],["p-b80de0ea",[[1,"limel-code-editor",{value:[1],language:[1],readonly:[4],lineNumbers:[4,"line-numbers"],fold:[4],lint:[4],colorScheme:[1,"color-scheme"],random:[32]}]]],["p-6c38b505",[[1,"limel-config",{config:[16]}]]],["p-5338663b",[[1,"limel-flex-container",{direction:[513],justify:[513],align:[513],reverse:[516]}]]],["p-dcf88b3e",[[1,"limel-form",{schema:[16],value:[16],disabled:[4],propsFactory:[16],transformErrors:[16],errors:[16]}]]],["p-82cd7bb6",[[1,"limel-grid"]]],["p-8c4e3b46",[[1,"limel-slider",{disabled:[516],readonly:[516],factor:[514],label:[513],helperText:[513,"helper-text"],unit:[513],value:[514],valuemax:[514],valuemin:[514],step:[514],percentageClass:[32]}]]],["p-c6e913a4",[[1,"limel-switch",{label:[513],disabled:[516],readonly:[516],value:[516],fieldId:[32]}]]],["p-2f9918a3",[[0,"limel-dock-button",{item:[16],expanded:[516],useMobileLayout:[516,"use-mobile-layout"],isOpen:[32]}]]],["p-f979c0f2",[[1,"limel-color-picker-palette",{value:[513],label:[513],helperText:[513,"helper-text"],required:[516]}]]],["p-73613abb",[[1,"limel-menu-list",{items:[16],badgeIcons:[4,"badge-icons"],iconSize:[1,"icon-size"],type:[1],maxLinesSecondaryText:[2,"max-lines-secondary-text"]}]]],["p-d16b27b9",[[1,"limel-menu",{items:[16],disabled:[516],openDirection:[513,"open-direction"],open:[1540],badgeIcons:[516,"badge-icons"],gridLayout:[516,"grid-layout"]}]]],["p-123f5fbb",[[1,"limel-icon-button",{icon:[513],elevated:[516],label:[513],disabled:[516]}]]],["p-55c8cb64",[[1,"limel-tab-bar",{tabs:[1040],canScrollLeft:[32],canScrollRight:[32]},[[9,"resize","handleWindowResize"]]]]],["p-95cefb5f",[[1,"limel-header",{icon:[1],heading:[1],subheading:[1],supportingText:[1,"supporting-text"]}]]],["p-cfaa685f",[[0,"limel-progress-flow-item",{item:[16],disabled:[4],readonly:[4]}]]],["p-eed2a202",[[1,"limel-checkbox",{disabled:[516],readonly:[516],label:[513],helperText:[513,"helper-text"],checked:[516],indeterminate:[516],required:[516],modified:[32]}]]],["p-1ab38214",[[1,"limel-flatpickr-adapter",{value:[16],type:[1],format:[1],isOpen:[4,"is-open"],inputElement:[16],language:[1],formatter:[16]}]]],["p-10e259de",[[1,"limel-spinner",{size:[513],limeBranded:[4,"lime-branded"]}]]],["p-9336fd7f",[[1,"limel-button",{label:[513],primary:[516],outlined:[516],icon:[513],disabled:[516],loading:[516],loadingFailed:[516,"loading-failed"],justLoaded:[32]}]]],["p-2fd478df",[[1,"limel-badge",{label:[520]}]]],["p-896e35b4",[[1,"limel-chip-set",{value:[16],type:[513],label:[513],helperText:[513,"helper-text"],disabled:[516],readonly:[516],inputType:[513,"input-type"],maxItems:[514,"max-items"],required:[516],searchLabel:[513,"search-label"],emptyInputOnBlur:[516,"empty-input-on-blur"],clearAllButton:[4,"clear-all-button"],leadingIcon:[513,"leading-icon"],delimiter:[513],language:[1],editMode:[32],textValue:[32],blurred:[32],inputChipIndexSelected:[32],getEditMode:[64],setFocus:[64],emptyInput:[64]}]]],["p-05d88196",[[1,"limel-circular-progress",{value:[2],maxValue:[2,"max-value"],prefix:[513],suffix:[1],displayPercentageColors:[4,"display-percentage-colors"],size:[513]}],[1,"limel-linear-progress",{value:[2],indeterminate:[4]}]]],["p-3be2dfc7",[[1,"limel-portal",{openDirection:[1,"open-direction"],position:[1],containerId:[1,"container-id"],containerStyle:[16],parent:[16],inheritParentWidth:[4,"inherit-parent-width"],visible:[4]}]]],["p-25013385",[[1,"limel-list",{items:[16],badgeIcons:[4,"badge-icons"],iconSize:[1,"icon-size"],type:[1],maxLinesSecondaryText:[2,"max-lines-secondary-text"]}],[1,"limel-menu-surface",{open:[4],allowClicksElement:[16]}]]],["p-75d01713",[[1,"limel-icon",{size:[513],name:[513],badge:[516]}]]],["p-f90c8fb2",[[1,"limel-input-field",{disabled:[516],readonly:[516],invalid:[516],label:[513],placeholder:[513],helperText:[513,"helper-text"],prefix:[513],suffix:[513],required:[516],value:[513],trailingIcon:[513,"trailing-icon"],leadingIcon:[513,"leading-icon"],pattern:[513],type:[513],formatNumber:[516,"format-number"],step:[520],max:[514],min:[514],maxlength:[514],minlength:[514],completions:[16],showLink:[516,"show-link"],isFocused:[32],isModified:[32],showCompletions:[32]}]]],["p-029360c8",[[1,"limel-popover",{open:[4],openDirection:[513,"open-direction"]}],[1,"limel-tooltip",{elementId:[513,"element-id"],label:[513],helperLabel:[513,"helper-label"],maxlength:[514],open:[32]}],[1,"limel-popover-surface",{contentCollection:[16]}],[1,"limel-tooltip-content",{label:[513],helperLabel:[513,"helper-label"],maxlength:[514]}]]]],e)));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as o,h as r}from"./p-d4e788e1.js";import{t as l}from"./p-b59e4287.js";const t={note:"info",important:"exclamation_mark",tip:"idea",caution:"high_priority",warning:"error"};function n(o="info"){var r;return null!==(r=t[o])&&void 0!==r?r:t.note}function a(o="note",r="en"){const t=`callout.${o}`;try{return l.get(t,r)}catch(o){return l.get(t,"en")}}const e=class{constructor(r){o(this,r),this.type="note",this.language="en"}render(){return[r("div",{class:"side",role:"presentation"},r("limel-icon",{name:n(this.type)})),r("div",{class:"main"},r("h1",{class:"heading"},a(this.type,this.language)),r("slot",null))]}};e.style=':host(limel-callout){display:flex;border-radius:0.5rem;overflow:hidden;color:var(--callout-text-color, rgb(var(--contrast-1100)))}:host([type=note]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-gray-default))\n )}:host([type=important]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-sky-default))\n )}:host([type=tip]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-green-default))\n )}:host([type=caution]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-orange-light))\n )}:host([type=warning]){--limel-callout-tint-color:var(\n --callout-color,\n rgb(var(--color-red-dark))\n )}.side{padding:0.25rem;position:relative}.side:before{content:"";position:absolute;inset:0;opacity:0.2;background-color:var(--limel-callout-tint-color)}.side limel-icon{width:1.5rem;color:var(--limel-callout-tint-color);margin-top:0.0625rem}.main{display:flex;flex:1;flex-direction:column;gap:0.5rem;padding:0.25rem 0.5rem 0.5rem 0.5rem;background-color:var(--callout-background-color, rgb(var(--contrast-300)))}.heading{margin:0;font-size:1rem}';export{e as limel_callout}
|
|
@@ -21,6 +21,8 @@ import { Languages } from '@limetech/lime-elements';
|
|
|
21
21
|
* @exampleComponent limel-example-callout-tip
|
|
22
22
|
* @exampleComponent limel-example-callout-caution
|
|
23
23
|
* @exampleComponent limel-example-callout-warning
|
|
24
|
+
* @exampleComponent limel-example-callout-rich-content
|
|
25
|
+
* @exampleComponent limel-example-callout-styles
|
|
24
26
|
*/
|
|
25
27
|
export declare class Callout {
|
|
26
28
|
/**
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as o,h as t}from"./p-d4e788e1.js";import{t as r}from"./p-b59e4287.js";const l={note:"info",important:"exclamation_mark",tip:"idea",caution:"high_priority",warning:"error"};function e(o="info"){var t;return null!==(t=l[o])&&void 0!==t?t:l.note}function i(o="note",t="en"){const l=`callout.${o}`;try{return r.get(l,t)}catch(o){return r.get(l,"en")}}const n=class{constructor(t){o(this,t),this.type="note",this.language="en"}render(){return[t("div",{class:"side",role:"presentation"},t("limel-icon",{name:e(this.type)})),t("div",{class:"main"},t("h1",{class:"heading"},i(this.type,this.language)),t("slot",null))]}};n.style=':host(limel-callout){display:flex;border-radius:0.5rem;overflow:hidden;color:rgb(var(--contrast-1100))}:host([type=note]){--limel-callout-tint-color:rgb(var(--color-gray-default))}:host([type=important]){--limel-callout-tint-color:rgb(var(--color-sky-default))}:host([type=tip]){--limel-callout-tint-color:rgb(var(--color-green-default))}:host([type=caution]){--limel-callout-tint-color:rgb(var(--color-orange-light))}:host([type=warning]){--limel-callout-tint-color:rgb(var(--color-red-dark))}.side{padding:0.25rem;position:relative}.side:before{content:"";position:absolute;inset:0;opacity:0.2;background-color:var(--limel-callout-tint-color)}.side limel-icon{width:1.5rem;color:var(--limel-callout-tint-color);margin-top:0.0625rem}.main{display:flex;flex:1;flex-direction:column;gap:0.5rem;padding:0.25rem 0.5rem 0.5rem 0.5rem;background-color:rgb(var(--contrast-300))}.heading{margin:0;font-size:1rem}';export{n as limel_callout}
|