@neovici/cosmoz-omnitable 18.10.0-beta.2 → 18.10.0

package/dist/cosmoz-omnitable-styles.js

@@ -3,10 +3,10 @@ import { tagged as css } from '@neovici/cosmoz-utils';
 export const checkbox = css `
 	.checkbox {
 		box-sizing: border-box;
-		width: calc(var(--cz-spacing) * 4.5);
-		height: calc(var(--cz-spacing) * 4.5);
+		width: 18px;
+		height: 18px;
 		background: transparent;
-		border-radius: var(--cz-radius-xs);
+		border-radius: 4px;
 		appearance: none;
 		-webkit-appearance: none;
 		outline: none;
@@ -14,16 +14,19 @@ export const checkbox = css `
 		user-select: none;
 		cursor: pointer;
 		display: inline-block;
-		box-shadow: inset 0 0 0 2px var(--cz-color-border-primary);
+		box-shadow: 0 0 0 2px
+			var(--cosmoz-omnitable-checkbox-shadow-color, rgba(0, 0, 0, 0.16)) inset;
 		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+		vertical-align: middle;
 		transition: background-color 140ms;
-		margin: 1px calc(var(--cz-spacing) * 3);
+		margin: 1px 12px;
 		flex: none;
 	}
 
 	.checkbox:checked {
-		background: rgb(
-			from var(--cz-color-bg-brand-solid) r g b / calc(alpha * 0.85)
+		background-color: var(
+			--cosmoz-omnitable-checkbox-checked-color,
+			var(--primary-color)
 		);
 		box-shadow: none;
 	}
@@ -32,12 +35,13 @@ export const checkbox = css `
 		content: '';
 		position: absolute;
 		box-sizing: content-box;
-		width: 4px;
+		width: 5px;
 		height: 10px;
-		border: 2px solid var(--cz-color-text-on-brand);
+		border: 2.4px solid
+			var(--cosmoz-omnitable-checkbox-checked-tick-color, #fff);
 		border-top: none;
 		border-left: none;
-		transform-origin: 4px 10px;
+		transform-origin: 5px 10px;
 		transform: translate(3px) rotate(45deg);
 	}
 
@@ -51,12 +55,15 @@ export const checkbox = css `
 	}
 
 	.checkbox:hover {
-		box-shadow: 0 0 0 2px
-			rgb(from var(--cz-color-text-primary) r g b / calc(alpha * 0.75)) inset;
+		box-shadow:
+			0 0 0 2px
+				var(--cosmoz-omnitable-checkbox-shadow-color-hover, rgba(0, 0, 0, 1))
+				inset,
+			0 0 2px 6px #2021240f;
 	}
 
 	.checkbox:checked:hover {
-		box-shadow: 0 0 2px 4px var(--cz-color-bg-quaternary);
+		box-shadow: 0 0 2px 6px #2021240f;
 	}
 
 	.checkbox:indeterminate::before {
@@ -66,7 +73,10 @@ export const checkbox = css `
 		height: 2px;
 		left: 4px;
 		top: 8px;
-		background-color: var(--cz-color-text-brand);
+		background-color: var(
+			--cosmoz-omnitable-checkbox-checked-color,
+			var(--primary-color)
+		);
 	}
 `;
 export default css `
@@ -75,10 +85,10 @@ export default css `
 		flex-direction: column;
 		position: relative;
 		overflow: hidden;
-		color: var(--cz-color-text-secondary);
+		color: var(--cosmoz-omnitable-text-color, rgb(89, 102, 121));
 	}
 	:host a {
-		color: var(--cz-color-brand-300);
+		color: var(--primary-link-color, inherit);
 		text-decoration: var(--cosmoz-omnitable-link-decoration, underline);
 	}
 	:host a:hover {
@@ -91,6 +101,7 @@ export default css `
 
 	/* The wrapping div that contains the header, the table content and the footer */
 	.mainContainer {
+		background-color: var(--cosmoz-omnitable-bg-color, rgb(255, 255, 255));
 		display: flex;
 		flex-direction: column;
 		flex: auto;
@@ -104,8 +115,11 @@ export default css `
 		position: relative;
 		display: flex;
 		align-items: flex-end;
-		background-color: var(--cz-color-bg-secondary);
-		border-block: 1px solid var(--cz-color-border-primary);
+		background-color: var(--cosmoz-omnitable-header-bg-color, inherit);
+		border-top-left-radius: var(--cosmoz-omnitable-header-border-radius-top-left, 8px);
+		border-top-right-radius: var(--cosmoz-omnitable-header-border-radius-top-right, 8px);
+		border-bottom-left-radius: var(--cosmoz-omnitable-header-border-radius-bottom-left, 2px);
+		border-bottom-right-radius: var(--cosmoz-omnitable-header-border-radius-bottom-right, 2px);
 	}
 
 	[hidden] {
@@ -116,10 +130,81 @@ export default css `
 		width: 100%;
 	}
 
+	cosmoz-omnitable-header-row .external-values-false {
+		--paper-input-container-color: var(
+			--cosmoz-omnitable-local-filter-header-color
+		);
+	}
+
+	cosmoz-omnitable-header-row .external-values-true {
+		--paper-input-container-color: var(
+			--cosmoz-omnitable-remote-filter-header-color
+		);
+	}
+
 	.header > cosmoz-omnitable-header-row {
 		flex: auto;
 	}
 
+	.header-cell {
+		--paper-input-container: {
+			padding-top: 0;
+			padding-bottom: 1px;
+			--paper-font-caption_-_line-height: 18px;
+		}
+		--paper-input-container-underline: {
+			border-color: var(--cosmoz-omnitable-header-line-color);
+			display: var(--cosmoz-omnitable-paper-input-underline-display, block);
+		}
+		--paper-input-container-underline-focus {
+			border-color: var(--cosmoz-omnitable-header-line-focused-color);
+			display: var(--cosmoz-omnitable-paper-input-underline-display, block);
+		}
+
+		text-transform: var(--cosmoz-omnitable-header-text-transform, none);
+		--paper-font-subhead_-_font-weight: var(
+			--cosmoz-omnitable-header-font-weight,
+			normal
+		);
+
+		--cosmoz-input-font-family: var(
+			--cosmoz-omnitable-header-font-family,
+			'Roboto',
+			'Noto',
+			sans-serif
+		);
+		--cosmoz-input-font-size: var(
+			--cosmoz-omnitable-header-font-size,
+			16px
+		);
+		--cosmoz-input-padding: var(--cosmoz-omnitable-header-input-padding, 0);
+		--cosmoz-input-label-text-transform: var(--cosmoz-omnitable-header-text-transform, none);
+		--cosmoz-input-label-font-weight: var(--cosmoz-omnitable-header-font-weight, normal);
+		--cosmoz-input-line-color: var(--cosmoz-omnitable-header-line-color);
+		--cosmoz-input-line-display: var(--cosmoz-omnitable-header-line-display, block);
+		--cosmoz-input-focused-color: var(--cosmoz-omnitable-header-line-focused-color);
+	}
+
+	.header-cell cosmoz-input[disabled],
+	.header-cell cosmoz-autocomplete-ui[disabled],
+	.header-cell cosmoz-autocomplete-excluding[disabled] {
+		pointer-events: none;
+		cursor: default;
+		--cosmoz-input-disabled-opacity: 1;
+	}
+
+	.header-cell cosmoz-input[disabled]::part(line),
+	.header-cell cosmoz-autocomplete-ui[disabled]::part(input-line),
+	.header-cell cosmoz-autocomplete-excluding[disabled]::part(input-line) {
+		border-bottom-style: solid;
+	}
+
+	cosmoz-omnitable-dropdown-input[disabled],
+	.header-cell cosmoz-omnitable-dropdown-input[disabled] {
+		pointer-events: none;
+		cursor: default;
+	}
+
 	cosmoz-omnitable-header-row {
 		white-space: nowrap;
 	}
@@ -130,6 +215,7 @@ export default css `
 		padding: 0 3px;
 		white-space: nowrap;
 		text-overflow: ellipsis;
+		vertical-align: bottom;
 	}
 	cosmoz-omnitable-header-row > div[hidden] {
 		display: none !important;
@@ -138,9 +224,9 @@ export default css `
 	cosmoz-omnitable-resize-nub {
 		display: inline-block;
 		position: absolute;
-		bottom: 0;
+		bottom: 2px;
 		width: 7px;
-		height: 100%;
+		height: 30px;
 		margin-left: -3px;
 		background: transparent;
 		cursor: ew-resize;
@@ -183,7 +269,6 @@ export default css `
 		flex-direction: column;
 		position: relative;
 		flex: auto;
-		background-color: var(--cz-color-bg-primary);
 	}
 	.tableContent:has(.tableContent-empty.spinner) {
 		opacity: 0.3;
@@ -192,25 +277,24 @@ export default css `
 	/* Empty data set styling */
 	.tableContent-empty {
 		position: absolute;
-		inset: 0;
+		top: 0;
+		right: 0;
+		bottom: 0;
+		left: 0;
 		display: flex;
 		align-items: center;
 		justify-content: center;
-		color: var(--cz-color-text-disabled);
-	}
-
-	.tableContent-empty:has(cosmoz-omnitable-skeleton) {
-		justify-content: stretch;
+		color: #ccc;
 	}
 	.tableContent-empty.overlay {
-		color: var(--cz-color-text-disabled);
+		color: #333;
 		z-index: 1;
 	}
 	.tableContent-empty > div {
 		display: flex;
 		flex-direction: column;
 		justify-content: center;
-		padding-bottom: calc(var(--cz-spacing) * 6);
+		padding-bottom: 24px;
 	}
 	.tableContent-empty.overlay > div {
 		padding-bottom: 0;
@@ -221,21 +305,17 @@ export default css `
 	.tableContent-empty div.tableContent-empty-message {
 		@apply --layout-vertical;
 		@apply --layout-center-justified;
-
-		padding-bottom: calc(var(--cz-spacing) * 6);
+		padding-bottom: 24px;
 	}
 	.tableContent-empty.overlay div.tableContent-empty-message {
 		padding-bottom: 0;
 	}
 	.tableContent-empty p {
-		font-size: var(--cz-text-base);
-		line-height: var(--cz-text-base-line-height);
+		font-size: 15px;
 		color: #ddd;
 		margin: 0;
 	}
 	.tableContent-empty h3 {
-		font-size: var(--cz-text-xl);
-		line-height: var(--cz-text-xl-line-height);
 		white-space: nowrap;
 		margin: 0px 0px 8px 0px;
 	}
@@ -253,48 +333,41 @@ export default css `
 	}
 
 	.itemRow {
-		border-bottom: 1px var(--cz-color-border-secondary) solid;
+		border-bottom-color: var(--cosmoz-omnitable-border-color, #e1e2e5);
+		border-bottom-width: 1px;
+		border-bottom-style: var(
+			--cosmoz-omnitable-item-row-border-bottom-style,
+			solid
+		);
+		/* set a min-height for rows so that rows with empty values are visible */
 	}
 	.itemRow-wrapper {
 		display: flex;
 		align-items: center;
-		min-height: calc(var(--cz-spacing) * 10);
-		padding-right: calc(var(--cz-spacing) * 2);
+		min-height: var(--item-row-min-height, 39px);
+		padding-right: 8px;
 	}
 
 	.itemRow[selected] {
-		background-color: var(--cz-color-bg-primary-hover);
-	}
-
-	.itemRow-cell {
-		font-size: var(--cz-text-sm);
-		line-height: var(--cz-text-sm-line-height);
+		background-color: var(
+			--cosmoz-omnitable-selection-color,
+			rgb(195, 212, 248)
+		);
+		@apply --cosmoz-omnitable-selected-row;
 	}
 
 	.tableContent .itemRow-cell paper-dropdown-menu {
-		margin-top: calc(var(--cz-spacing) * 2);
+		margin-top: -20px;
+
 	}
 
 	cosmoz-omnitable-item-expand[expanded] {
 		display: flex;
 		flex-direction: column;
-		font-size: var(--cz-text-sm);
-		line-height: var(--cz-text-sm-line-height);
 		padding: 5px 4%;
-		border-bottom: 1px var(--cz-color-border-secondary) solid;
-		background-color: var(--cz-color-bg-disabled);
-		animation: expand-in 0.25s ease;
-	}
-
-	@keyframes expand-in {
-		from {
-			opacity: 0;
-			transform: translateY(-4px);
-		}
-		to {
-			opacity: 1;
-			transform: translateY(0);
-		}
+		line-height: 1.3em;
+		border-bottom: solid 1px var(--cosmoz-omnitable-border-color, #e1e2e5);
+		background-color: #fafafa;
 	}
 
 	cosmoz-omnitable-item-expand:not([expanded]) {
@@ -304,12 +377,10 @@ export default css `
 	.groupRow {
 		display: flex;
 		align-items: center;
-		background-color: var(--cz-color-bg-tertiary);
-		font-size: var(--cz-text-sm);
-		line-height: var(--cz-text-sm-line-height);
-		font-weight: var(--cz-font-weight-bold);
-		color: var(--cz-color-text-primary);
-		border-bottom: 1px solid var(--cz-color-border-secondary);
+		background-color: #f5f6f9;
+		font-weight: 700;
+		color: #101010;
+		border-bottom: 1px solid var(--cosmoz-omnitable-border-color, #e1e2e5);
 	}
 
 	.groupRow-label {
@@ -317,11 +388,10 @@ export default css `
 		flex: auto;
 		align-items: center;
 		flex-wrap: wrap;
-		padding-left: calc(var(--cz-spacing) * 2);
+		padding-left: 8px;
 		margin: 0;
-		font-size: var(--cz-text-sm);
-		line-height: var(--cz-text-sm-line-height);
-		font-weight: var(--cz-font-weight-regular);
+		font-size: 1.15em;
+		font-weight: 400;
 		overflow: hidden;
 		text-overflow: ellipsis;
 		white-space: nowrap;
@@ -332,17 +402,14 @@ export default css `
 	}
 
 	.groupRow-badge {
-		background: var(--cz-color-bg-success-solid);
-		color: var(--cz-color-bg-secondary);
-		height: calc(var(--cz-spacing) * 7);
-		width: calc(var(--cz-spacing) * 7);
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		border-radius: var(--cz-radius-full);
-		font-size: var(--cz-text-sm);
-		line-height: var(--cz-text-sm-line-height);
-		font-weight: var(--cz-font-weight-regular);
+		background: #8be5c6;
+		color: #fff;
+		line-height: 30px;
+		width: 30px;
+		text-align: center;
+		border-radius: 50%;
+		font-size: 13px;
+		font-weight: 500;
 	}
 
 	.rtl {
@@ -358,26 +425,22 @@ export default css `
 	}
 
 	cosmoz-bottom-bar {
-		background: rgb(
-			from var(--cz-color-bg-brand-solid) r g b / calc(alpha * 0.45)
-		);
+		background-color: var(--cosmoz-omnitable-bottom-bar-color, #5f5a92);
 		overflow: hidden;
-		color: var(--cz-color-text-on-brand);
 	}
 	cosmoz-bottom-bar::part(bar) {
-		padding: 0 calc(var(--cz-spacing) * 6);
+		padding: 0 24px;
 	}
 
 	cosmoz-bottom-bar::slotted(*) {
-		background: rgb(
-			from var(--cz-color-bg-brand-solid) r g b / calc(alpha * 0.75)
-		);
-		color: var(--cz-color-text-on-brand);
+		background-color: #4c4875;
+		color: #fff;
+		border-color: #fff;
 	}
 
 	cosmoz-bottom-bar::slotted([disabled]) {
-		color: var(--cz-color-text-disabled);
-		border-color: var(--cz-color-border-disabled);
+		color: #b7b6c8;
+		border-color: #b7b6c8;
 		cursor: not-allowed;
 	}
 
@@ -385,73 +448,66 @@ export default css `
 		overflow: initial;
 	}
 
-	.omnitable-cell-number,
-	.omnitable-cell-date {
+	.omnitable-cell-number, .omnitable-cell-date {
 		font-variant-numeric: tabular-nums;
 	}
 
 	.itemRow:hover {
-		box-shadow: var(--cz-shadow-sm);
-		background-color: var(--cz-color-bg-primary-hover);
+		box-shadow: inset 1px 0 0 #dadce0, inset -1px 0 0 #dadce0,
+			0 1px 2px 0 rgb(60 64 67 / 30%), 0 1px 3px 1px rgb(60 64 67 / 15%);
+		background-color: var(--cosmoz-omnitable-row-hover-color);
 	}
 	.groupRow:hover .checkbox:not(:checked):not(:hover),
 	.itemRow:hover .checkbox:not(:checked):not(:hover) {
-		box-shadow: 0 0 0 2px
-			rgb(from var(--cz-color-text-primary) r g b / calc(alpha * 0.75)) inset;
+		box-shadow: 0 0 0 2px var(--cosmoz-omnitable-checkbox-shadow-color-not-hover, rgba(0, 0, 0, 0.54))
+		inset;
 	}
 	.groupRow:hover .expand:not(:hover),
 	.itemRow:hover .expand:not(:hover) {
-		color: rgb(from var(--cz-color-text-primary) r g b / calc(alpha * 0.75));
+		color: rgba(0, 0, 0, 0.54);
 	}
 
 	${checkbox}
 
 	.all {
-		align-self: center;
+		margin-bottom: 6px;
 	}
 
 	.expand {
-		width: calc(var(--cz-spacing) * 6);
-		height: calc(var(--cz-spacing) * 6);
+		width: 24px;
+		height: 24px;
 		padding: 0;
 		flex: none;
-		display: flex;
-		align-items: center;
-		justify-content: center;
 		border: none;
 		border-radius: 50%;
 		cursor: pointer;
 		background: none;
-		transition: 0.25s background ease-in;
+		transition: 0.15s background ease-in;
 		outline: none;
-		color: var(--cz-color-text-primary);
-		background: transparent;
-
-		&[hidden] {
-			display: none;
-		}
+		color: rgba(0, 0, 0, 0.16);
 	}
-
-	.groupRow .expand {
-		margin: var(--cz-spacing);
+	.expand svg {
+		fill: currentColor;
 	}
-
 	.expand:not([aria-expanded]) svg {
-		transform: scaleY(1);
+		transform: scaleY(-1);
 	}
 	.expand:active {
-		background: rgb(
-			from var(--cz-color-text-primary) r g b / calc(alpha * 0.15)
-		);
+		background: rgba(33, 33, 33, 0.25);
 	}
 	.expand:hover {
-		color: rgb(from var(--cz-color-text-primary) r g b / calc(alpha * 0.75));
+		color: #000;
+	}
+	.groupRow .expand {
+		margin: 8px;
 	}
 
 	.sg {
 		display: inline-flex;
+		width: 10px;
 		cursor: pointer;
 		align-items: center;
+		margin-top: 18px;
 		overflow: hidden;
 		flex: none;
 		background: none;
@@ -459,7 +515,6 @@ export default css `
 		outline: none;
 		color: inherit;
 		padding: 0;
-		transition: transform 0.3s ease;
 	}
 	.sg span {
 		display: none;
@@ -468,12 +523,14 @@ export default css `
 		display: block;
 	}
 	.sg[data-on] {
-		color: var(--cz-color-text-primary);
+		color: var(--cosmoz-omnitable-checkbox-checked-color, var(--primary-color));
 	}
 	.sg:not([data-on='desc']) {
 		transform: scaleY(-1);
 	}
-
+	:not(:hover) > .sg:not([data-on]) {
+		display: none;
+	}
 	.header-cell {
 		display: inline-flex;
 		position: relative;
@@ -483,42 +540,35 @@ export default css `
 		flex: auto;
 	}
 
+	:host([mini]) .itemRow .expand,
+	:host([mini]) cosmoz-omnitable-item-expand {
+		display: none;
+	}
+
 	.itemRow-minis {
 		display: flex;
 		justify-content: space-between;
 		margin: 14px 12px 12px 12px;
-		color: var(--cz-color-text-primary);
-	}
-
-	:host([mini]) {
-		--checkbox-offset: calc(var(--cz-spacing) * 2);
+		color: var(--cosmoz-omnitable-mini-color, #000);
 	}
 
-	:host([mini]) .itemRow .expand,
-	:host([mini]) cosmoz-omnitable-item-expand {
-		display: none;
+	:host([mini]) .itemRow {
+		border-radius: 12px;
+		border: 1px solid var(--cosmoz-omnitable-border-color, #e1e2e5);
+		margin: 4px 8px;
+		padding-top: 2px;
 	}
 
-	:host([mini]) .header > cosmoz-omnitable-header-row {
-		flex: 0;
+	:host([mini]) .itemRow:not([selected]) {
+		background: var(--cosmoz-omnitable-mini-item-background, #fdfdfd);
 	}
 
-	:host([mini]) .groupRow {
-		padding-left: var(--checkbox-offset);
+	:host([mini]) .itemRow:hover {
+		box-shadow: none;
 	}
 
 	:host([mini]) .header {
-		padding-left: var(--checkbox-offset);
-		justify-content: space-between;
-	}
-
-	:host([mini]) .itemRow {
-		border-radius: 12px;
-		box-shadow: inset 0 0 0 2px var(--cz-color-border-tertiary);
-		margin-block: var(--checkbox-offset);
-		margin-inline: var(--checkbox-offset);
-		padding-block: 4px;
-		border: none;
+		margin: 0 8px;
 	}
 
 	:host([mini]) .tableContent {
@@ -534,30 +584,42 @@ export default css `
 	}
 
 	:host([mini]) .tableContent-scroller::-webkit-scrollbar-thumb {
-		background: transparent;
+	background: transparent;
 	}
 
 	:host([mini]) .tableContent-scroller:hover::-webkit-scrollbar-thumb {
-		background: var(--cz-color-bg-tertiary);
+	background: var(--cosmoz-omnitable-mini-scrollbar-thumb-bg, #aaa);
 	}
 
 	:host([mini]) .tableContent-scroller::-webkit-scrollbar-button:decrement,
 	:host([mini]) .tableContent-scroller::-webkit-scrollbar-button:increment {
-		width: 0px;
+	width: 0px;
 	}
 
 	:host([mini]) cosmoz-omnitable-settings::part(columns) {
-		display: none;
+		display:none;
 	}
 
 	cz-spinner {
-		width: calc(var(--cz-spacing) * 12);
-		height: calc(var(--cz-spacing) * 12);
+		width: 48px;
+		height: 48px;
 		position: absolute;
 		top: 40%;
 		right: 50%;
-		border-color: var(--cz-color-gray-700);
-		border-top-color: var(--cz-color-black);
+		border-color: rgba(0, 0, 0, 0.2);
+		border-top-color: #000;
+	}
+
+	:host([inline]) {
+		overflow: visible;
+	}
+	:host([inline]) .tableContent {
+		overflow-y: visible;
+		flex: none;
+	}
+	:host([inline]) .tableContent-scroller {
+		overflow: visible;
+		flex-basis: auto;
 	}
 `;
 //# sourceMappingURL=cosmoz-omnitable-styles.js.map

package/dist/cosmoz-omnitable-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"cosmoz-omnitable-styles.js","sourceRoot":"","sources":["../src/cosmoz-omnitable-styles.ts"],"names":[],"mappings":"AAAA,8BAA8B;AAC9B,OAAO,EAAE,MAAM,IAAI,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAEtD,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoE1B,CAAC;AAEF,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+Uf,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2JV,CAAC"}
+{"version":3,"file":"cosmoz-omnitable-styles.js","sourceRoot":"","sources":["../src/cosmoz-omnitable-styles.ts"],"names":[],"mappings":"AAAA,8BAA8B;AAC9B,OAAO,EAAE,MAAM,IAAI,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAEtD,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8E1B,CAAC;AAEF,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoYf,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0JV,CAAC"}

package/dist/cosmoz-omnitable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cosmoz-omnitable.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable.js"],"names":[],"mappings":"AAuEa,+DAA4D;AACxE,qDAA0E"}
+{"version":3,"file":"cosmoz-omnitable.d.ts","sourceRoot":"","sources":["../src/cosmoz-omnitable.js"],"names":[],"mappings":"AAwEa,+DAA4D;AACxE,qDAA0E"}

package/dist/cosmoz-omnitable.js

@@ -51,6 +51,7 @@ customElements.define('cosmoz-omnitable', component(Omnitable, {
         'disabled-filtering',
         'loading',
         'mini-breakpoint',
+        'inline',
     ],
 }));
 const tmplt = `