import { directive, Directive, PartType } from 'lit/directive.js';
import { nothing } from 'lit-html';

class CustomClassMapDirective extends Directive {
  constructor(partInfo) {
    super(partInfo);
    if (partInfo.type !== PartType.ATTRIBUTE || partInfo.name !== "class" || partInfo.strings?.length > 2) {
      throw new Error(
        "`customClassMap()` can only be used in the `class` attribute and must be the only part in the attribute."
      );
    }
  }
  render(classInfoList) {
    return " " + Object.keys(classInfoList).filter((key) => classInfoList[key]).join(" ") + " ";
  }
}
const customClassMap = directive(CustomClassMapDirective);

class CustomStyleMapDirective extends Directive {
  constructor(partInfo) {
    super(partInfo);
    if (partInfo.type !== PartType.ATTRIBUTE || partInfo.name !== "style" || partInfo.strings?.length > 2) {
      throw new Error(
        "`customStyleMap()` can only be used in the `style` attribute and must be the only part in the attribute."
      );
    }
  }
  render(styleInfoList) {
    const styles = Object.keys(styleInfoList).filter((key) => styleInfoList[key]);
    if (styles.length === 0) {
      return nothing;
    }
    return ` ${styles.join("; ")} `;
  }
}
const customStyleMap = directive(CustomStyleMapDirective);

export { customStyleMap as a, customClassMap as c };
