@ds-autonomie/web-components 2.2.0 → 2.3.1

package/dist/chunks/chunk.KGZLC7FO.js

@@ -0,0 +1,91 @@
+import {
+  input_styles_default
+} from "./chunk.CWDSCTUA.js";
+
+// src/components/input-time/input-time.styles.ts
+import { css } from "lit";
+var input_time_styles_default = css`
+  ${input_styles_default}
+
+  .input--time {
+    overflow: visible;
+  }
+
+  .icon-button--time {
+    --padding: var(--dsa-spacing-4);
+    margin-right: var(--dsa-wc-input-padding-x);
+  }
+
+  .icon-button--time::part(base) {
+    color: inherit;
+  }
+
+  .time-popup::part(popup) {
+    z-index: var(--dsa-wc-z-index-dropdown);
+    overflow: hidden;
+  }
+
+  .time-popup--panel {
+    border: 1px solid var(--dsa-wc-input-time-panel-border-color);
+    border-radius: var(--dsa-wc-input-time-panel-border-radius);
+    background: var(--dsa-color-background-base);
+    box-shadow: var(--dsa-wc-shadow-small);
+    display: grid;
+    grid-auto-flow: column;
+  }
+
+  .time-popup--unit-container {
+    width: var(--dsa-wc-input-time-picker-unit-size);
+    max-height: calc(var(--dsa-wc-input-time-picker-unit-size) * 6);
+    margin: 0;
+    padding: var(--dsa-spacing-4);
+    overflow: auto;
+    scrollbar-width: none;
+    list-style: none;
+  }
+
+  .time-popup--unit {
+    cursor: pointer;
+    border-radius: var(--dsa-wc-input-time-picker-unit-radius);
+    font: var(--dsa-wc-input-time-picker-unit-font);
+    color: var(--dsa-wc-input-time-picker-unit-color);
+  }
+
+  .time-popup--unit:hover {
+    background-color: var(--dsa-wc-input-time-picker-unit-hover-color);
+  }
+
+  .time-popup--unit.time-popup--unit-selected {
+    border: 1px solid var(--dsa-wc-input-time-picker-unit-current-color);
+    color: var(--dsa-color-text-on-contrasted-primary);
+    background-color: var(--dsa-wc-input-time-picker-unit-selected-color);
+  }
+
+  .time-popup--unit.time-popup--unit-selected:hover {
+    background-color: var(--dsa-color-primitive-colors-identity-purple-800);
+  }
+
+  .time-popup--unit > * {
+    aspect-ratio: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .time-anchor {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+  }
+
+  /* Focus */
+  .time-popup--unit:focus-visible {
+    outline: var(--dsa-wc-focus-ring);
+    outline-offset: var(--dsa-wc-focus-ring-offset);
+  }
+`;
+
+export {
+  input_time_styles_default
+};