Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

code(custom tooltip): enabling custom tooltips for relevant field types #90

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
79 changes: 49 additions & 30 deletions src/admin/utils/fieldTypes.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,12 +26,10 @@ export const common = {
title: {
type: "string",
title: "Title",
description: "Provide a title to be displayed for your field",
},
description: {
title: "Description",
type: "string",
description: "Provide a description to be displayed for your field",
},
},
optionsUiSchema: {
Expand Down Expand Up @@ -121,6 +119,10 @@ export const common = {

export const extra = {
optionsSchema: {
tooltip: {
title: "Tooltip",
type: "string"
},
readOnly: {
type: "boolean",
title: "Read-only",
Expand Down Expand Up @@ -171,7 +173,7 @@ const collections = {
hidden: {
type: "boolean",
title: "Do you want this field to be hidden?",
description: "If yes, this field will not be visible in the form",
tooltip: "If enabled, this field will not be visible in the form",
},
},
},
Expand All @@ -180,6 +182,12 @@ const collections = {
},
optionsUiSchemaUiSchema: {
...common.optionsUiSchemaUiSchema,
"ui:options": {
...common.optionsUiSchemaUiSchema["ui:options"],
hidden: {
"ui:widget": "switch",
}
}
},
default: {
schema: {
Expand Down Expand Up @@ -362,11 +370,12 @@ const simple = {
...common.optionsSchema,
pattern: {
title: "Validation regex",
description:
tooltip:
"The input will be validated against this regex on form submission",
type: "string",
format: "regex",
},
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand All @@ -392,7 +401,7 @@ const simple = {
suggestions: {
type: "string",
title: "Add a suggestion URL endpoint",
description: "Provide an URL endpoint, to fetch data from there",
tooltip: "Provide an URL endpoint to fetch data from",
},
convertToUppercase: {
type: "boolean",
Expand Down Expand Up @@ -441,6 +450,7 @@ const simple = {
title: "TextArea Schema",
properties: {
...common.optionsSchema,
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand All @@ -461,23 +471,20 @@ const simple = {
properties: {
...common.optionsUiSchema.properties["ui:options"].properties,
rows: {
title: "Rows",
description: "The number of rows in the textarea",
title: "Number of Rows",
description: "Default: 4",
type: "number",
},
maxLength: {
title: "Max Length",
description: "Infinity if not provided",
title: "Max Characters",
type: "number",
},
minLength: {
title: "Min Length",
description: "Empty if not provided",
title: "Min Characters",
type: "number",
},
placeholder: {
title: "Placeholder",
description: "Provide a placeholder for the field",
type: "string",
},
},
Expand Down Expand Up @@ -515,6 +522,7 @@ const simple = {
{ const: "number", title: "Float" },
],
},
tooltip: extra.optionsSchema.tooltip,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please move the tooltip up, here and in other fields, so that it appears directly under title and description (i.e. directly after ...common.optionsSchema)

readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand Down Expand Up @@ -554,6 +562,7 @@ const simple = {
{ const: "array", title: "Multiple Options" },
],
},
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand Down Expand Up @@ -583,9 +592,8 @@ const simple = {
enum: ["array"],
},
items: {
title: "Define your options",
title: "Options",
type: "object",
description: "The options for the widget",
properties: {
enum: {
title: "Options List",
Expand Down Expand Up @@ -640,7 +648,6 @@ const simple = {
type: {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add tooltip support also in switch

type: "string",
title: "Type of the returned value",
description: "Define the type of the returned value",
oneOf: [
{ const: "boolean", title: "Boolean" },
{ const: "string", title: "String" },
Expand Down Expand Up @@ -668,9 +675,9 @@ const simple = {
...common.optionsUiSchema.properties["ui:options"].properties,
falseToUndefined: {
type: "boolean",
title: "Do you want to return undefined instead of false?",
description:
"In some cases the returned value is preferred to be undefined than false",
title: "Return undefined instead of false?",
tooltip:
"In some cases the returned value can be preferred to be undefined than false",
},
},
},
Expand All @@ -679,6 +686,12 @@ const simple = {
},
optionsUiSchemaUiSchema: {
...common.optionsUiSchemaUiSchema,
"ui:options": {
...common.optionsUiSchemaUiSchema["ui:options"],
falseToUndefined: {
"ui:widget": "switch",
},
},
},
default: {
schema: {
Expand All @@ -700,14 +713,14 @@ const simple = {
properties: {
...common.optionsSchema,
enum: {
title: "Define your options",
title: "Options",
type: "array",
description: "The options for the radio widget",
items: {
title: "Radio Option",
type: "string",
},
},
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand Down Expand Up @@ -751,6 +764,7 @@ const simple = {
{ const: "array", title: "Select multiple values" },
],
},
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand All @@ -766,9 +780,8 @@ const simple = {
then: {
properties: {
enum: {
title: "Define your options",
title: "Options",
type: "array",
description: "The options for the widget",
items: {
title: "Option",
type: "string",
Expand All @@ -788,9 +801,8 @@ const simple = {
then: {
properties: {
enum: {
title: "Define your options",
title: "Options",
type: "array",
description: "The options for the widget",
items: {
title: "Option",
type: "number",
Expand All @@ -810,7 +822,7 @@ const simple = {
then: {
properties: {
items: {
title: "Define your options",
title: "Options",
type: "object",
properties: {
enum: {
Expand Down Expand Up @@ -880,6 +892,7 @@ const simple = {
type: "string",
title: "Maximum date allowed",
},
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand Down Expand Up @@ -929,6 +942,7 @@ const advanced = {
title: "URI Schema",
properties: {
...common.optionsSchema,
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand All @@ -951,7 +965,7 @@ const advanced = {
suggestions: {
type: "string",
title: "Add a suggestion URL endpoint",
description: "Provide an URL endpoint, to fetch data from there",
tooltip: "Provide a URL endpoint, to fetch data from there",
},
},
},
Expand Down Expand Up @@ -981,6 +995,7 @@ const advanced = {
title: "Rich/LaTeX Editor Schema",
properties: {
...common.optionsSchema,
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand Down Expand Up @@ -1017,14 +1032,15 @@ const advanced = {
tagPattern: {
type: "string",
title: "Pattern",
description: "Provide a regex for your pattern",
tooltip: "Only tags matching this regex will be allowed",
},
tagPatternErrorMessage: {
type: "string",
title: "Pattern error message",
description:
"Provide a message to display when the input does not match the pattern",
tooltip:
"Message to display when the input does not match the pattern",
},
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand Down Expand Up @@ -1061,6 +1077,7 @@ const advanced = {
title: "ID Fetcher Schema",
properties: {
...common.optionsSchema,
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand Down Expand Up @@ -1119,14 +1136,15 @@ const advanced = {
validateWith: {
type: "string",
title: "Validate with",
description:
tooltip:
"You can either provide a URL of a UI Schema to validate against or paste the JSON schema directly",
oneOf: [
{ const: "none", title: "None" },
{ const: "url", title: "URL" },
{ const: "json", title: "JSON" },
],
},
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand Down Expand Up @@ -1269,6 +1287,7 @@ export const hiddenFields = {
{ const: "number", title: "Float" },
],
},
tooltip: extra.optionsSchema.tooltip,
readOnly: extra.optionsSchema.readOnly,
isRequired: extra.optionsSchema.isRequired,
},
Expand Down
Loading