keystatic icon indicating copy to clipboard operation
keystatic copied to clipboard

checkbox focus indicator is cut off

Open stefanprobst opened this issue 2 years ago • 0 comments

the focus ring for a checkbox field is cut off when placed inside a dialog. see:

Screenshot_20230906_143220

the singleton schema for the above:

import { config, fields, singleton } from "@keystatic/core";

export default config({
  storage: { kind: "local" },
  singletons: {
    navigation: singleton({
      label: "Navigation",
      path: "./src/content/data/navigation",
      format: "json",
      schema: {
        navigation: fields.array(
          fields.conditional(
            fields.checkbox({ label: "Dropdown menu", defaultValue: false }),
            {
              true: fields.object({
                label: fields.text({ label: "Label" }),
                links: fields.array(
                  fields.object({
                    label: fields.text({ label: "Label" }),
                    href: fields.url({ label: "URL" }),
                  }),
                  {
                    label: "Menu",
                    itemLabel(props) {
                      return props.fields.label.value;
                    },
                  }
                ),
              }),
              false: fields.object({
                label: fields.text({ label: "Label" }),
                href: fields.url({ label: "URL" }),
              }),
            }
          ),
          {
            label: "Links",
            itemLabel(props) {
              return props.value.fields.label.value;
            },
          }
        ),
      },
    }),
  },
});

stefanprobst avatar Sep 06 '23 12:09 stefanprobst