import {
  LocalizeController
} from "./chunk.X3FE7OHE.js";
import {
  SolidElement,
  customElement
} from "./chunk.H53WQBDK.js";
import {
  __decorateClass
} from "./chunk.S3NI7NKU.js";

// src/components/range-tick/range-tick.ts
import { css, html } from "lit";
import { property } from "lit/decorators.js";
import cx from "classix";
var SdRangeTick = class extends SolidElement {
  constructor() {
    super(...arguments);
    this.localize = new LocalizeController(this);
    this.subtick = false;
  }
  render() {
    return html`<div part="base" class="${cx(this.subtick ? "w-0.25" : "w-0.5")}"><div part="line" class="${cx(this.subtick ? "h-2" : "h-[10px]")}"></div><div part="label" class="flex items-center justify-center text-center text-nowrap text-sm sd-range-scale-ticks-color-text"><slot></slot></div></div>`;
  }
};
SdRangeTick.styles = [
  ...SolidElement.styles,
  css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
[part='line']{background-color:rgba(var(--sd-color-border-neutral-400,rgba(var(--sd-color-neutral-400))))}`
];
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdRangeTick.prototype, "subtick", 2);
SdRangeTick = __decorateClass([
  customElement("sd-range-tick")
], SdRangeTick);

export {
  SdRangeTick
};
