@muraldevkit/ui-toolkit 4.66.0-dev-7XJy.1 → 4.66.0-dev-7K0j.1

package/dist/esm/components/table/MrlTableRow/MrlTableRow.module.css

@@ -0,0 +1,155 @@
+.MrlTable--kSx86 {
+  --mrl-table-default-width: calc(100% - 10px);
+  --mrl-table-max-width: 1280px;
+  --mrl-table-header-background: var(--mrl-color-background);
+  --mrl-table-header-row-border-bottom: 2px solid rgba(var(--mrl-gray-30), 1);
+  --mrl-table-column-background-hover: rgba(var(--mrl-gray-10), 1);
+  --mrl-table-column-height: 48px;
+  --mrl-table-column-inline-spacing: var(--mrl-spacing-01);
+  --mrl-table-column-svg-color: var(--mrl-color-text-secondary);
+  --mrl-table-disabled-color: rgba(var(--mrl-gray-70), 1);
+  --mrl-table-row-height: 48px;
+  --mrl-table-row-border-bottom: 1px solid rgba(var(--mrl-gray-30), 1);
+  --mrl-table-row-background: var(--mrl-color-background);
+  --mrl-table-row-background-hover: rgba(var(--mrl-gray-10), 1);
+  --mrl-table-row-background-selected: rgba(var(--mrl-blue-10), 1);
+  --mrl-table-cell-height: 48px;
+  --mrl-table-cell-padding-block: 6px;
+  --mrl-table-cell-padding-inline: 6px;
+  --mrl-table-default-padding-inline: var(--mrl-spacing-02) var(--mrl-spacing-04);
+  --mrl-table-selection-width: 2.75rem;
+  --mrl-table-default-min-width: 198px;
+  --mrl-table-status-width: 192px;
+  --mrl-table-call-to-action-width: 92px;
+  --mrl-table-action-width: 48px;
+}
+
+.MrlTableEmptyState--OQ4xc {
+  --mrl-table-empty-state-padding-block: 64px;
+  --mrl-table-empty-state-padding-inline: 48px;
+  --mrl-table-empty-state-min-height: 104px;
+}
+
+/* stylelint-disable scss/operator-no-newline-after */
+.mrl-u-focus-wrapper--X8-L- {
+  position: relative;
+}
+
+.MrlTableRow--Ii7og {
+  background-color: var(--mrl-table-row-background);
+  border-bottom: var(--mrl-table-row-border-bottom);
+  font-size: var(--mrl-type-size-text-small);
+  font-weight: var(--mrl-type-weight-text);
+  height: var(--mrl-table-row-height);
+  outline: none;
+}
+.MrlTableRow--Ii7og:hover:not(.MrlTableRow--selected) > td {
+  background-color: var(--mrl-table-row-background-hover);
+}
+.MrlTableRow--Ii7og:focus-visible {
+  position: relative;
+}
+.MrlTableRow--Ii7og:focus-visible:focus-visible {
+  outline: none;
+}
+.MrlTableRow--Ii7og:focus-visible:focus-visible::after {
+  animation-duration: var(--mrl-duration-03);
+  animation-fill-mode: forwards;
+  animation-iteration-count: 1;
+  animation-timing-function: var(--mrl-timing-m3);
+  border: 0 solid transparent;
+  border-radius: calc(
+		var(--mrl-border-radius-functional) + var(--mrl-line-width-focus) + var(--mrl-space-offset-focus)
+	);
+  bottom: calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px) * -1);
+  content: "";
+  display: block;
+  left: calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px) * -1);
+  position: absolute;
+  right: calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px) * -1);
+  top: calc((var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px) * -1);
+  z-index: 1;
+  animation-name: border-animation--AYTiU;
+}
+@keyframes border-animation--AYTiU {
+  0% {
+    border-color: transparent;
+    border-width: 0;
+    bottom: var(--mrl-space-offset-focus);
+    left: var(--mrl-space-offset-focus);
+    right: var(--mrl-space-offset-focus);
+    top: var(--mrl-space-offset-focus);
+  }
+  50% {
+    border-color: var(--mrl-color-focus);
+    border-width: 0.25rem;
+    bottom: calc(var(--mrl-spacing-02) * -1);
+    left: calc(var(--mrl-spacing-02) * -1);
+    right: calc(var(--mrl-spacing-02) * -1);
+    top: calc(var(--mrl-spacing-02) * -1);
+  }
+  100% {
+    border-color: var(--mrl-color-focus);
+    border-width: var(--mrl-line-width-focus);
+    bottom: calc((
+						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
+					) * -1);
+    left: calc((
+						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
+					) * -1);
+    right: calc((
+						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
+					) * -1);
+    top: calc((
+						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
+					) * -1);
+  }
+}
+@keyframes border-animation-inverse--L6Feb {
+  0% {
+    border-color: transparent;
+    border-width: 0;
+    bottom: var(--mrl-space-offset-focus);
+    left: var(--mrl-space-offset-focus);
+    right: var(--mrl-space-offset-focus);
+    top: var(--mrl-space-offset-focus);
+  }
+  50% {
+    border-color: var(--mrl-color-focus-inverse);
+    border-width: 0.25rem;
+    bottom: calc(var(--mrl-spacing-02) * -1);
+    left: calc(var(--mrl-spacing-02) * -1);
+    right: calc(var(--mrl-spacing-02) * -1);
+    top: calc(var(--mrl-spacing-02) * -1);
+  }
+  100% {
+    border-color: var(--mrl-color-focus-inverse);
+    border-width: var(--mrl-line-width-focus);
+    bottom: calc((
+						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
+					) * -1);
+    left: calc((
+						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
+					) * -1);
+    right: calc((
+						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
+					) * -1);
+    top: calc((
+						var(--mrl-space-offset-focus) + var(--mrl-line-width-focus) + 0px
+					) * -1);
+  }
+}
+@keyframes outline-animation--DIxDi {
+  0% {
+    outline: 0 solid transparent;
+    outline-offset: 1px;
+  }
+  50% {
+    outline: 4px solid var(--mrl-color-focus);
+    outline-offset: 1px;
+  }
+  100% {
+    outline: 2px solid var(--mrl-color-focus);
+    outline-offset: 1px;
+  }
+}

package/dist/esm/components/table/MrlTableRow/MrlTableRow.module.scss.js

@@ -0,0 +1,10 @@
+import "./MrlTableRow.module.css";
+export default {
+	"MrlTable": "MrlTable--kSx86",
+	"MrlTableEmptyState": "MrlTableEmptyState--OQ4xc",
+	"mrl-u-focus-wrapper": "mrl-u-focus-wrapper--X8-L-",
+	"MrlTableRow": "MrlTableRow--Ii7og",
+	"border-animation": "border-animation--AYTiU",
+	"border-animation-inverse": "border-animation-inverse--L6Feb",
+	"outline-animation": "outline-animation--DIxDi"
+};

package/dist/esm/components/table/MrlTableRow/index.js

@@ -0,0 +1 @@
+export * from './MrlTableRow';

package/dist/esm/components/table/constants.js

@@ -0,0 +1,9 @@
+/*
+ * Table component
+ * ------------------------------------------------------------------
+ */
+export var MrlSortDirection;
+(function (MrlSortDirection) {
+    MrlSortDirection[MrlSortDirection["ASC"] = 1] = "ASC";
+    MrlSortDirection[MrlSortDirection["DESC"] = -1] = "DESC";
+})(MrlSortDirection || (MrlSortDirection = {}));